Design doc for upgrading the room-settings Base tab from the cramped
horizontal two-column rows to a stacked-label layout matching the
sibling Access tab. Also gitignore the .superpowers/ brainstorm dir.
Combines spec + 5-task plan into a single doc for faster execution.
Branch: feat/navigator-p2-query (forked from feat/navigator-modernization
P1 tip). Migrates search from event-driven imperative state to
useNitroQuery with cache per [tabCode, filter], invalidator on
FlatCreatedEvent + RoomSettingsUpdatedEvent, accept-filter that rejects
mismatched-tab server pushes.
Key API changes: useNavigatorActions DELETED (sendSearch +
reloadCurrentSearch gone); useNavigatorData no longer returns
searchResult; navigatorUiStore adds currentTabCode + currentFilter +
setTab + setFilter; new useNavigatorSearch hook returns the
{ searchResult, isFetching, refetch } triple.
Bite-sized tasks with exact code blocks:
- Task 1: navigatorUiStore (TDD, 14 cases)
- Task 2: useDoorState extraction (TDD, 11 cases incl. dual-subscription filters)
- Task 3: useNavigatorStore internal closure (move all non-door listeners + new actions)
- Task 4: 3 filters + barrel rewrite + smoke test
- Tasks 5-8: 13 consumer migrations (atomic commit)
- Task 9: delete useNavigator.ts + final verification (typecheck/test/lint/manual)
Each commit is a green stopping point except Task 4 step 8 (intentional
intermediate-broken commit while consumers still import the removed
useNavigator export from the barrel). Tasks 5-8 land atomically to close
that gap in the next commit.
First of four planned phases reworking the Navigator on a clean
origin/Dev base. P1 is pure refactor (zero visible change): split
the 492-line useNavigator god-hook into wired-tools-style filters
(useNavigatorData / useNavigatorUiState / useNavigatorActions),
extract door lifecycle to useDoorState under src/hooks/rooms/widgets,
hoist the 9 local useState in NavigatorView into a Zustand
navigatorUiStore, migrate all 13 active consumers, and delete the
shim.
The Zustand UI store uses per-key selectors in useNavigatorUiState
to match createNitroStore's documented convention ("subscribe to
specific slices only").
Spec also anchors the visual rework (P4) target so architecture
decisions in P1 align with where we are heading: rich empty states,
card hover-reveal, saved-search chip row, filter intent chips,
sticky section headers, skeleton loaders.
Out of scope for P1 (each gets its own future spec): TanStack Query
migration of search (P2), reactive favourites/snapshot pattern (P3),
virtualization + empty states + persistence + chips (P4), Form
Action on search input (P6), WidgetErrorBoundary wrap (P5,
parallel-eligible).
simoleo89