- SUMMARY.md with 2 tasks, 10 files modified, 3 deviations documented - STATE.md updated with position, decisions, metrics - Requirements DETAIL-04, DETAIL-05 marked complete
144 lines
6.5 KiB
Markdown
144 lines
6.5 KiB
Markdown
---
|
|
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*
|