chore: complete v1.0 MVP milestone
Archive roadmap, requirements, and phase directories to milestones/. Evolve PROJECT.md with validated requirements and key decisions. Reorganize ROADMAP.md with milestone grouping. Delete REQUIREMENTS.md (fresh for next milestone).
This commit is contained in:
@@ -0,0 +1,123 @@
|
||||
---
|
||||
phase: 02-planning-threads
|
||||
plan: 02
|
||||
subsystem: ui
|
||||
tags: [react, tanstack-router, tanstack-query, zustand, tabs, threads, candidates]
|
||||
|
||||
requires:
|
||||
- phase: 02-planning-threads
|
||||
provides: Thread and candidate API endpoints at /api/threads
|
||||
- phase: 01-foundation-and-collection
|
||||
provides: SlideOutPanel, ConfirmDialog, ItemCard, ItemForm, CategoryPicker, ImageUpload, uiStore pattern
|
||||
provides:
|
||||
- Tabbed home page with gear/planning views
|
||||
- Thread list with card UI showing candidate count and price range
|
||||
- Thread detail page with candidate card grid
|
||||
- Candidate add/edit via slide-out panel with same fields as items
|
||||
- Thread resolution flow with confirmation dialog and collection integration
|
||||
- TanStack Query hooks for thread and candidate CRUD
|
||||
affects: [03-setups-and-dashboard]
|
||||
|
||||
tech-stack:
|
||||
added: []
|
||||
patterns: [tab navigation via URL search params, dual slide-out panel pattern, cross-query invalidation on resolution]
|
||||
|
||||
key-files:
|
||||
created:
|
||||
- src/client/hooks/useThreads.ts
|
||||
- src/client/hooks/useCandidates.ts
|
||||
- src/client/components/ThreadTabs.tsx
|
||||
- src/client/components/ThreadCard.tsx
|
||||
- src/client/components/CandidateCard.tsx
|
||||
- src/client/components/CandidateForm.tsx
|
||||
- src/client/routes/threads/$threadId.tsx
|
||||
modified:
|
||||
- src/client/stores/uiStore.ts
|
||||
- src/client/routes/index.tsx
|
||||
- src/client/routes/__root.tsx
|
||||
|
||||
key-decisions:
|
||||
- "Tab navigation uses URL search params (?tab=gear|planning) via TanStack Router validateSearch for shareable URLs"
|
||||
- "Candidate panel runs alongside item panel as separate SlideOutPanel instance, controlled by independent uiStore state"
|
||||
- "Resolution invalidates threads, items, and totals queries for cross-tab data freshness"
|
||||
- "FAB hidden on thread detail pages to avoid confusion between item add and candidate add"
|
||||
|
||||
patterns-established:
|
||||
- "Tab navigation pattern: URL search params with z.enum().catch() for default, ThreadTabs renders underline indicator"
|
||||
- "Dual panel pattern: root layout renders two SlideOutPanel instances with independent open/close state"
|
||||
- "Cross-query invalidation: useResolveThread invalidates threads + items + totals on success"
|
||||
|
||||
requirements-completed: [THRD-01, THRD-02, THRD-03, THRD-04]
|
||||
|
||||
duration: 4min
|
||||
completed: 2026-03-15
|
||||
---
|
||||
|
||||
# Phase 2 Plan 02: Thread Frontend UI Summary
|
||||
|
||||
**Tabbed home page with thread list cards, candidate grid detail view, slide-out candidate CRUD, and resolution flow that adds winners to the collection**
|
||||
|
||||
## Performance
|
||||
|
||||
- **Duration:** 4 min
|
||||
- **Started:** 2026-03-15T10:42:22Z
|
||||
- **Completed:** 2026-03-15T10:46:26Z
|
||||
- **Tasks:** 2
|
||||
- **Files modified:** 10
|
||||
|
||||
## Accomplishments
|
||||
- Tabbed home page switching between My Gear collection and Planning thread list
|
||||
- Thread cards displaying name, candidate count, creation date, and price range chips
|
||||
- Thread detail page with candidate card grid matching ItemCard visual style
|
||||
- Candidate add/edit via slide-out panel with all item fields (name, weight, price, category, notes, URL, image)
|
||||
- Resolution confirmation dialog that picks winner, creates collection item, and archives thread
|
||||
- 63 existing tests still pass with zero regressions
|
||||
|
||||
## Task Commits
|
||||
|
||||
Each task was committed atomically:
|
||||
|
||||
1. **Task 1: Hooks, store, tab navigation, and thread list** - `a9d624d` (feat)
|
||||
2. **Task 2: Thread detail page with candidate CRUD and resolution flow** - `7d043a8` (feat)
|
||||
|
||||
## Files Created/Modified
|
||||
- `src/client/hooks/useThreads.ts` - TanStack Query hooks for thread CRUD and resolution
|
||||
- `src/client/hooks/useCandidates.ts` - TanStack Query mutation hooks for candidate CRUD
|
||||
- `src/client/stores/uiStore.ts` - Extended with candidate panel and resolve dialog state
|
||||
- `src/client/components/ThreadTabs.tsx` - Tab switcher with active underline indicator
|
||||
- `src/client/components/ThreadCard.tsx` - Thread list card with candidate count and price range chips
|
||||
- `src/client/components/CandidateCard.tsx` - Candidate card with edit, delete, and pick winner actions
|
||||
- `src/client/components/CandidateForm.tsx` - Candidate form with dollar-to-cents conversion
|
||||
- `src/client/routes/index.tsx` - Refactored to tabbed HomePage with CollectionView and PlanningView
|
||||
- `src/client/routes/threads/$threadId.tsx` - Thread detail page with candidate grid
|
||||
- `src/client/routes/__root.tsx` - Added candidate panel, delete dialog, and resolve dialog
|
||||
|
||||
## Decisions Made
|
||||
- Tab navigation uses URL search params (?tab=gear|planning) for shareable/bookmarkable URLs
|
||||
- Candidate panel is a separate SlideOutPanel instance with independent state in uiStore
|
||||
- Resolution invalidates threads, items, and totals queries to keep cross-tab data fresh
|
||||
- FAB hidden on thread detail pages to avoid confusion between item add and candidate add
|
||||
- useMatchRoute detects thread detail page in root layout for candidate panel context
|
||||
|
||||
## Deviations from Plan
|
||||
|
||||
None - plan executed exactly as written.
|
||||
|
||||
## Issues Encountered
|
||||
None.
|
||||
|
||||
## User Setup Required
|
||||
None - no external service configuration required.
|
||||
|
||||
## Next Phase Readiness
|
||||
- Full thread planning workflow operational end-to-end
|
||||
- Thread and candidate UI consumes all API endpoints from Plan 01
|
||||
- Ready for Phase 3 (Setups and Dashboard) which may reference threads for impact preview
|
||||
|
||||
---
|
||||
*Phase: 02-planning-threads*
|
||||
*Completed: 2026-03-15*
|
||||
|
||||
## Self-Check: PASSED
|
||||
|
||||
All 10 files verified present. Both commit hashes (a9d624d, 7d043a8) verified in git log.
|
||||
Reference in New Issue
Block a user