docs(16-03): complete tRPC client wiring plan

Tasks completed: 2/2
- Install tRPC React Query dependencies
- Wire tRPC React Query client with providers

SUMMARY: .planning/phases/16-frontend-scaffold/16-03-SUMMARY.md

.planning/ROADMAP.md

@@ -259,7 +259,7 @@ Plans:
 Plans:
 - [x] 16-01: Vite + React + Tailwind + shadcn/ui
 - [x] 16-02: Shared Types Package
-- [ ] 16-03: tRPC Client Wiring
+- [x] 16-03: tRPC Client Wiring
 - [ ] 16-04: React Router Setup
 - [ ] 16-05: Dev Server Integration
 
@@ -338,7 +338,7 @@ Phases execute in numeric order: 1 → 1.1 → 2 → 3 → 4 → 5 → 6 → 7
 | 13. Real Claude E2E Tests | v1.2 | 1/1 | Complete | 2026-02-02 |
 | 14. Parallel Phase Execution | v1.3 | 8/8 | Complete | 2026-02-02 |
 | 15. Frontend Wireframes | v1.3 | 3/3 | Complete | 2026-02-02 |
-| 16. Frontend Scaffold | v2.0 | 2/5 | In progress | - |
+| 16. Frontend Scaffold | v2.0 | 3/5 | In progress | - |
 | 17. Initiative Dashboard | v2.0 | 0/? | Not started | - |
 | 18. Initiative Detail | v2.0 | 0/? | Not started | - |
 | 19. Agent Inbox | v2.0 | 0/? | Not started | - |

.planning/STATE.md

@@ -10,11 +10,11 @@ See: .planning/PROJECT.md (updated 2026-02-04)
 ## Current Position
 
 Phase: 16 of 21 (Frontend Scaffold)
-Plan: 2 of 5 in current phase
+Plan: 3 of 5 in current phase
 Status: In progress
-Last activity: 2026-02-04 - Completed 16-01-PLAN.md
+Last activity: 2026-02-04 - Completed 16-03-PLAN.md
 
-Progress: █████████░ 94%
+Progress: █████████░ 97%
 
 ## Performance Metrics
 
@@ -182,6 +182,9 @@ Recent decisions affecting current work:
 - 16-01: App.tsx uses cn() from @/lib/utils to verify path alias and Tailwind integration
 - 16-02: Shared types package uses rootDir=../.. (no composite) for relative imports into backend
 - 16-02: skipLibCheck avoids drizzle-orm third-party declaration errors in shared package
+- 16-03: httpBatchLink URL set to /trpc (Vite proxy forwards to backend, same-origin in prod)
+- 16-03: QueryClient defaults: refetchOnWindowFocus=false, retry=1
+- 16-03: tsconfig project references to shared not needed (npm workspaces symlink handles resolution)
 
 ### Pending Todos
 
@@ -204,5 +207,5 @@ None.
 ## Session Continuity
 
 Last session: 2026-02-04
-Stopped at: Completed 16-01-PLAN.md
+Stopped at: Completed 16-03-PLAN.md
 Resume file: None

.planning/phases/16-frontend-scaffold/16-03-SUMMARY.md

@@ -0,0 +1,96 @@
+---
+phase: 16-frontend-scaffold
+plan: 03
+subsystem: ui
+tags: [trpc, react-query, vite, typescript]
+
+# Dependency graph
+requires:
+  - phase: 16-01
+    provides: Vite + React + Tailwind project
+  - phase: 16-02
+    provides: Shared types package with AppRouter export
+provides:
+  - tRPC React Query client with type-safe hooks
+  - React Query provider with sensible defaults
+  - httpBatchLink configured for Vite dev proxy
+affects: [17-initiative-dashboard, 18-initiative-detail, 19-agent-inbox]
+
+# Tech tracking
+tech-stack:
+  added: ["@trpc/client", "@trpc/react-query", "@tanstack/react-query"]
+  patterns: ["tRPC React Query provider wrapping", "httpBatchLink with Vite proxy"]
+
+key-files:
+  created: ["packages/web/src/lib/trpc.ts"]
+  modified: ["packages/web/package.json", "packages/web/src/main.tsx", "packages/web/src/App.tsx"]
+
+key-decisions:
+  - "httpBatchLink URL set to /trpc (proxied by Vite in dev, same-origin in prod)"
+  - "QueryClient defaults: refetchOnWindowFocus=false, retry=1"
+  - "Temporary App.tsx with health check to prove tRPC connection"
+
+patterns-established:
+  - "tRPC client: createTRPCReact<AppRouter>() in lib/trpc.ts"
+  - "Provider stack: trpc.Provider > QueryClientProvider > App"
+
+# Metrics
+duration: 2min
+completed: 2026-02-04
+---
+
+# Phase 16 Plan 03: tRPC Client Wiring Summary
+
+**tRPC React Query client wired to AppRouter with httpBatchLink, React Query provider, and health check verification**
+
+## Performance
+
+- **Duration:** 2 min
+- **Started:** 2026-02-04
+- **Completed:** 2026-02-04
+- **Tasks:** 2
+- **Files modified:** 4
+
+## Accomplishments
+- tRPC React Query client created with full AppRouter type inference
+- React Query provider configured with sensible defaults (no refetch on focus, single retry)
+- httpBatchLink configured for `/trpc` URL (Vite dev proxy forwards to backend at 127.0.0.1:3847)
+- Temporary App.tsx with `trpc.health.useQuery()` proves end-to-end type-safe data fetching
+- Vite build passes with full type checking
+
+## Task Commits
+
+Each task was committed atomically:
+
+1. **Task 1: Install tRPC React Query dependencies** - `603d908` (feat)
+2. **Task 2: Wire tRPC React Query client with providers** - `0d5645f` (feat)
+
+## Files Created/Modified
+- `packages/web/src/lib/trpc.ts` - tRPC React Query client with createTRPCReact<AppRouter> and httpBatchLink
+- `packages/web/package.json` - Added @trpc/client, @trpc/react-query, @tanstack/react-query, @codewalk-district/shared
+- `packages/web/src/main.tsx` - Root component with trpc.Provider and QueryClientProvider wrapping App
+- `packages/web/src/App.tsx` - Temporary health check component using trpc.health.useQuery()
+
+## Decisions Made
+- httpBatchLink URL set to `/trpc` relying on Vite dev proxy (no absolute URL needed)
+- QueryClient configured with refetchOnWindowFocus=false and retry=1 for development ergonomics
+- tsconfig.app.json project references to shared package not needed (npm workspaces symlink handles resolution, skipLibCheck avoids third-party declaration issues)
+
+## Deviations from Plan
+
+None - plan executed exactly as written.
+
+## Issues Encountered
+None
+
+## User Setup Required
+None - no external service configuration required.
+
+## Next Phase Readiness
+- tRPC client fully operational with type-safe hooks
+- All subsequent UI screens (dashboard, detail, inbox) can use `trpc.{procedure}.useQuery()` for data fetching
+- Ready for 16-04: React Router Setup
+
+---
+*Phase: 16-frontend-scaffold*
+*Completed: 2026-02-04*