diff --git a/.planning/REQUIREMENTS.md b/.planning/REQUIREMENTS.md index 859b7d8..5d11597 100644 --- a/.planning/REQUIREMENTS.md +++ b/.planning/REQUIREMENTS.md @@ -64,7 +64,11 @@ Requirements for this milestone. Each maps to roadmap phases. - [ ] **DETAIL-02**: Clicking a catalog search result navigates to a public detail page (`/global-items/:id`) with "Add to Collection" button - [ ] **DETAIL-03**: Item detail page has edit mode toggle for modifying personal fields (notes, category, quantity, purchase price) - [x] **DETAIL-04**: Thread candidates navigate to detail pages instead of opening slide-out panels +<<<<<<< HEAD - [ ] **DETAIL-05**: Slide-out panels for items and candidates are removed from the application +======= +- [x] **DETAIL-05**: Slide-out panels for items and candidates are removed from the application +>>>>>>> worktree-agent-a00c5cfa ### Tags @@ -185,7 +189,11 @@ Which phases cover which requirements. Updated during roadmap creation. | DETAIL-02 | Phase 21 | Pending | | DETAIL-03 | Phase 21 | Pending | | DETAIL-04 | Phase 21 | Complete | +<<<<<<< HEAD | DETAIL-05 | Phase 21 | Pending | +======= +| DETAIL-05 | Phase 21 | Complete | +>>>>>>> worktree-agent-a00c5cfa **Coverage:** - v2.0 requirements: 45 total diff --git a/.planning/STATE.md b/.planning/STATE.md index 3f0e44b..5aafd11 100644 --- a/.planning/STATE.md +++ b/.planning/STATE.md @@ -3,13 +3,13 @@ gsd_state_version: 1.0 milestone: v1.3 milestone_name: Research & Decision Tools status: planning -stopped_at: Completed 21-02-PLAN.md -last_updated: "2026-04-06T13:03:13.009Z" +stopped_at: Completed 21-03-PLAN.md +last_updated: "2026-04-06T13:14:25.653Z" last_activity: 2026-04-06 progress: total_phases: 15 - completed_phases: 14 - total_plans: 39 + completed_phases: 13 + total_plans: 38 completed_plans: 37 percent: 0 --- @@ -58,8 +58,9 @@ Key decisions made during v2.0 planning: - [Phase 20]: Created tags table in schema (was missing, needed for GET /api/tags endpoint) - [Phase 20]: FAB visible on all authenticated routes, not just collection gear tab - [Phase 20]: Add button on catalog search cards is a stub (Phase 21 wires actual flow) -- [Phase 21]: Candidate data fetched from useThread hook (find in array) not new API endpoint -- [Phase 21]: AddCandidateModal inline in thread page, local modal pattern replacing UIStore panel +- [Phase 21]: Preserved currentThreadId derivation in __root.tsx for CandidateDeleteDialog +- [Phase 21]: CollectionView empty state Add button rewired to catalog search overlay +- [Phase 21]: ItemForm/CandidateForm decoupled from UIStore with onClose prop pattern ### Pending Todos @@ -70,7 +71,7 @@ None active. | # | Description | Date | Commit | Directory | |---|-------------|------|--------|-----------| | 260406-j44 | Comprehensive dev seed script for bikepacking gear data | 2026-04-06 | — | [260406-j44-comprehensive-dev-seed-script-for-bikepa](./quick/260406-j44-comprehensive-dev-seed-script-for-bikepa/) | -| Phase 21 P02 | 4min | 2 tasks | 2 files | +| Phase 21 P03 | 6min | 2 tasks | 10 files | ### Blockers/Concerns @@ -79,6 +80,6 @@ None active. ## Session Continuity -Last session: 2026-04-06T13:03:13.007Z -Stopped at: Completed 21-02-PLAN.md +Last session: 2026-04-06T13:14:25.651Z +Stopped at: Completed 21-03-PLAN.md Resume file: None diff --git a/.planning/phases/21-item-catalog-detail-pages/21-03-SUMMARY.md b/.planning/phases/21-item-catalog-detail-pages/21-03-SUMMARY.md new file mode 100644 index 0000000..0a8ac78 --- /dev/null +++ b/.planning/phases/21-item-catalog-detail-pages/21-03-SUMMARY.md @@ -0,0 +1,143 @@ +--- +phase: 21-item-catalog-detail-pages +plan: 03 +subsystem: ui +tags: [react, tanstack-router, navigation, panel-removal, uistore] + +requires: + - phase: 21-item-catalog-detail-pages + provides: "Item detail page at /items/:id (Plan 01), Candidate detail page at /threads/:threadId/candidates/:candidateId (Plan 02)" +provides: + - "All card components navigate to detail pages instead of opening panels" + - "Slide-out panels removed from root layout" + - "UIStore cleaned of all panel-related state" +affects: [phase-22] + +tech-stack: + added: [] + patterns: + - "Card click navigation via useNavigate instead of UIStore panel state" + - "Catalog search card click closes overlay then navigates to detail page" + +key-files: + created: [] + modified: + - src/client/components/ItemCard.tsx + - src/client/components/CandidateCard.tsx + - src/client/components/CandidateListItem.tsx + - src/client/components/CatalogSearchOverlay.tsx + - src/client/routes/__root.tsx + - src/client/stores/uiStore.ts + - src/client/components/CollectionView.tsx + - src/client/components/ItemForm.tsx + - src/client/components/CandidateForm.tsx + - src/client/routes/threads/$threadId.tsx + +key-decisions: + - "Preserved currentThreadId derivation in __root.tsx for CandidateDeleteDialog dependency" + - "CollectionView empty state Add button now opens catalog search instead of removed add panel" + - "ItemForm and CandidateForm migrated to onClose prop pattern instead of UIStore panel close" + +patterns-established: + - "Navigation-first pattern: card clicks navigate to detail pages, no more slide-out panels" + - "Form onClose prop: forms accept optional onClose callback instead of coupling to UIStore" + +requirements-completed: [DETAIL-04, DETAIL-05] + +duration: 6min +completed: 2026-04-06 +--- + +# Phase 21 Plan 03: Card Navigation Rewire & Panel Removal Summary + +**All card components rewired from slide-out panels to detail page navigation, panels removed from root layout, UIStore cleaned of panel state** + +## Performance + +- **Duration:** 6 min +- **Started:** 2026-04-06T13:04:59Z +- **Completed:** 2026-04-06T13:11:00Z +- **Tasks:** 2 +- **Files modified:** 10 + +## Accomplishments +- ItemCard, CandidateCard, CandidateListItem all navigate to detail pages on click using TanStack Router useNavigate +- CatalogSearchOverlay cards navigate to /global-items/:id (closing overlay first), with Add button using stopPropagation +- Slide-out panel JSX and imports completely removed from __root.tsx +- UIStore cleaned of 11 panel-related properties/actions while preserving all dialog, FAB, and catalog search state +- All downstream references (CollectionView, ItemForm, CandidateForm, thread page) updated to remove dead panel references + +## Task Commits + +Each task was committed atomically: + +1. **Task 1: Rewire card click handlers to navigate to detail pages** - `1f79c5c` (feat) +2. **Task 2: Remove slide-out panels from root layout and clean UIStore** - `4c79735` (feat) + +## Files Created/Modified +- `src/client/components/ItemCard.tsx` - Navigate to /items/$itemId instead of openEditPanel +- `src/client/components/CandidateCard.tsx` - Navigate to /threads/$threadId/candidates/$candidateId +- `src/client/components/CandidateListItem.tsx` - Navigate to candidate detail page +- `src/client/components/CatalogSearchOverlay.tsx` - Card click navigates to /global-items/$globalItemId +- `src/client/routes/__root.tsx` - Removed both SlideOutPanel instances and all panel state reads +- `src/client/stores/uiStore.ts` - Removed panel state/actions, kept dialogs and other state +- `src/client/components/CollectionView.tsx` - Empty state button uses catalog search instead of add panel +- `src/client/components/ItemForm.tsx` - Replaced closePanel with onClose prop +- `src/client/components/CandidateForm.tsx` - Replaced closeCandidatePanel with onClose prop, removed UIStore import +- `src/client/routes/threads/$threadId.tsx` - Replaced openCandidateAddPanel with local state + +## Decisions Made +- Preserved currentThreadId derivation block in __root.tsx because CandidateDeleteDialog depends on it (checker flagged this) +- CollectionView empty state Add button rewired to open catalog search overlay rather than the removed add panel +- ItemForm and CandidateForm given onClose prop to decouple from UIStore panel actions (forms still exist on disk per plan requirement) + +## Deviations from Plan + +### Auto-fixed Issues + +**1. [Rule 3 - Blocking] Updated CollectionView.tsx to remove dead openAddPanel reference** +- **Found during:** Task 2 (panel cleanup) +- **Issue:** CollectionView referenced openAddPanel which was removed from UIStore +- **Fix:** Replaced with openCatalogSearch("collection") to maintain "Add Item" functionality via catalog +- **Files modified:** src/client/components/CollectionView.tsx +- **Verification:** grep confirms no dead references remain +- **Committed in:** 4c79735 (Task 2 commit) + +**2. [Rule 3 - Blocking] Updated threads/$threadId.tsx to remove dead openCandidateAddPanel reference** +- **Found during:** Task 2 (panel cleanup) +- **Issue:** Thread page referenced openCandidateAddPanel which was removed from UIStore +- **Fix:** Replaced with local useState (Plan 02 already restructured this file with a proper modal) +- **Files modified:** src/client/routes/threads/$threadId.tsx +- **Verification:** grep confirms no dead references remain +- **Committed in:** 4c79735 (Task 2 commit) + +**3. [Rule 3 - Blocking] Updated ItemForm.tsx and CandidateForm.tsx to remove dead panel close references** +- **Found during:** Task 2 (panel cleanup) +- **Issue:** Forms referenced closePanel/closeCandidatePanel which were removed from UIStore +- **Fix:** Added onClose prop to both forms, replaced store calls with onClose?.() +- **Files modified:** src/client/components/ItemForm.tsx, src/client/components/CandidateForm.tsx +- **Verification:** grep confirms no dead references remain +- **Committed in:** 4c79735 (Task 2 commit) + +--- + +**Total deviations:** 3 auto-fixed (3 blocking) +**Impact on plan:** All auto-fixes necessary to prevent broken references after panel state removal. No scope creep. + +## Issues Encountered +None + +## User Setup Required +None - no external service configuration required. + +## Known Stubs +None - all navigation targets exist (created by Plans 01 and 02), no placeholder data. + +## Next Phase Readiness +- All cards navigate to detail pages, panel-to-page migration complete +- Phase 21 complete: item detail pages, candidate detail pages, and navigation rewiring all done +- Ready for Phase 22 (next milestone work) + +--- +*Phase: 21-item-catalog-detail-pages* +*Completed: 2026-04-06* diff --git a/src/client/components/CandidateCard.tsx b/src/client/components/CandidateCard.tsx index f35a7f4..3ebc064 100644 --- a/src/client/components/CandidateCard.tsx +++ b/src/client/components/CandidateCard.tsx @@ -1,3 +1,4 @@ +import { useNavigate } from "@tanstack/react-router"; import { useFormatters } from "../hooks/useFormatters"; import type { CandidateDelta } from "../hooks/useImpactDeltas"; import { LucideIcon } from "../lib/iconData"; @@ -46,7 +47,7 @@ export function CandidateCard({ delta, }: CandidateCardProps) { const { weight, price } = useFormatters(); - const openCandidateEditPanel = useUIStore((s) => s.openCandidateEditPanel); + const navigate = useNavigate(); const openConfirmDeleteCandidate = useUIStore( (s) => s.openConfirmDeleteCandidate, ); @@ -56,7 +57,12 @@ export function CandidateCard({ return (