Files
Codewalkers/.planning/phases/16-frontend-scaffold/16-02-PLAN.md
Lukas May f5f25c4854 docs(16): create frontend scaffold phase plan
Phase 16: Frontend Scaffold
- 5 plans in 3 waves
- 4 parallel-capable, 1 sequential with checkpoint
- Ready for execution
2026-02-04 17:04:59 +01:00

4.0 KiB

phase, plan, type, wave, depends_on, files_modified, autonomous
phase plan type wave depends_on files_modified autonomous
16-frontend-scaffold 02 execute 1
packages/shared/package.json
packages/shared/tsconfig.json
packages/shared/src/index.ts
packages/shared/src/trpc.ts
packages/shared/src/types.ts
package.json
src/trpc/router.ts
true
Export shared types (AppRouter, DB entity types) from a shared package so the frontend can consume them.

Purpose: The frontend needs AppRouter type for tRPC client type inference, and DB entity types (Initiative, Phase, Task, Agent, Message) for component props. Creating a shared package avoids import path gymnastics between backend and frontend. Output: packages/shared/ package exporting AppRouter and entity types.

<execution_context> @/.claude/get-shit-done/workflows/execute-plan.md @/.claude/get-shit-done/templates/summary.md </execution_context>

@.planning/PROJECT.md @.planning/ROADMAP.md @.planning/STATE.md

Existing types to export

@src/trpc/router.ts @src/db/schema.ts

Task 1: Create shared types package packages/shared/package.json, packages/shared/tsconfig.json, packages/shared/src/index.ts, packages/shared/src/trpc.ts, packages/shared/src/types.ts, package.json 1. Create `packages/shared/` directory.
  1. Create packages/shared/package.json:

    • name: @codewalk-district/shared
    • type: module
    • main: ./src/index.ts (no build step — consumed via TypeScript project references)
    • types: ./src/index.ts
    • exports: { ".": "./src/index.ts" }
  2. Create packages/shared/tsconfig.json:

    • Extends nothing (standalone)
    • compilerOptions: target ES2022, module NodeNext, moduleResolution NodeNext, strict, declaration true, composite true, outDir dist
    • include: ["src"]
  3. Create packages/shared/src/trpc.ts:

    • Re-export the AppRouter type from the backend:
    export type { AppRouter } from '../../../src/trpc/router.js';
    

    This uses relative path since we're in the same git repo. The frontend will import AppRouter from @codewalk-district/shared.

  4. Create packages/shared/src/types.ts:

    • Re-export entity types the frontend needs:
    export type { Initiative, Phase, Plan, Task, Agent, Message } from '../../../src/db/schema.js';
    

    These are the Drizzle InferSelectModel types (read-only shapes).

  5. Create packages/shared/src/index.ts:

    • Barrel export:
    export type { AppRouter } from './trpc.js';
    export type { Initiative, Phase, Plan, Task, Agent, Message } from './types.js';
    
  6. Add packages/shared to root package.json workspaces array (should already include "packages/*" from Plan 01, but verify).

  7. Run npm install from root to link the shared package.

NOTE: This package exports ONLY types (no runtime code). It exists solely so the frontend can import type { AppRouter } from '@codewalk-district/shared' without reaching into backend internals. cd packages/shared && npx tsc --noEmit succeeds (types resolve correctly). From packages/web, importing type { AppRouter } from '@codewalk-district/shared' should resolve (test with a scratch file if needed, or just verify tsc). AppRouter and entity types importable from @codewalk-district/shared. No build step needed — TypeScript resolves directly.

Before declaring plan complete: - [ ] `packages/shared/` exists with package.json, tsconfig.json, and src/ - [ ] TypeScript compiles `packages/shared/` without errors - [ ] AppRouter type re-exported correctly - [ ] Entity types (Initiative, Phase, Task, etc.) re-exported correctly

<success_criteria>

  • @codewalk-district/shared package exists and resolves
  • AppRouter type accessible to frontend consumers
  • Entity types accessible to frontend consumers
  • No runtime dependencies — types only </success_criteria>
After completion, create `.planning/phases/16-frontend-scaffold/16-02-SUMMARY.md`