Turns the prior roadmap sketch into ordered, gated work packages (enforcement gates, FP/DDD consistency, CIBG fidelity, Storybook curriculum, a11y) from the 2026-07-02 showcase-hardening audit.
2.8 KiB
2.8 KiB
WP-08 — One store idiom + machine naming + TEA MDX
Status: todo Phase: 1 — FP/DDD core
Why
Docs (docs/fp-tea-atomic-design.md, ARCHITECTURE §2c) teach createStore as THE
wiring, but the wizard pages hand-wire signal(model) + local dispatch() — juniors see
two idioms and copy the wrong one. Machine naming also drifts:
change-request.machine.ts exports bare State/Msg; upload.machine.ts exports
reduceUpload/initialUpload.
Read first
src/app/shared/application/store.ts(createStore) + its specdocs/fp-tea-atomic-design.mdPart on TEA-in-Angular- All
*.machine.tsfiles (6) and their UI wiring sites (wizard components/pages)
Decisions (pre-made, don't relitigate)
createStoreis THE idiom — migrate the hand-wired pages to it. One shape everywhere is the teachability win; the migration is ~5 lines per page.- Naming convention (goes into CLAUDE.md §3):
- State/Msg types are context-prefixed:
ChangeRequestState,ChangeRequestMsg(rename the bare ones; other machines already comply). - A top-level machine exports
initial+reduce. - A composable sub-machine (embedded in a parent model) keeps prefixed value
exports:
initialUpload/reduceUploadstay — prefixing avoids alias noise at the composition site.
- State/Msg types are context-prefixed:
Files
src/app/registratie/domain/change-request.machine.ts(+ spec + consumers) — rename- Wizard UI wiring:
registratie-wizard.component.ts,intake-wizard.component.ts,herregistratie-wizard.component.ts(whichever hand-wiresignal+dispatch) →createStore CLAUDE.md§3 — the naming + wiring convention- New
src/docs/machines.mdx— titleFoundations/State Machines (TEA)
Steps
- Rename
State/Msgin change-request (mechanical; lint/build finds consumers). - Swap hand-wired model signals for
createStore(initial, reduce)in the wizard components; templates keep dispatching messages — no template changes expected. - Write the convention into CLAUDE.md §3 (including the sub-machine rule).
- MDX page: Model/Msg/reduce, commands-outside-reducers,
createStorewiring, the naming rules — linkingherregistratie.machine.tsas the worked example.
Acceptance criteria
grep -rn "export type State\b\|export type Msg\b" src/app→ empty.- Every machine consumer wires via
createStore; no localsignal(model)+ hand-rolled dispatch remains. - Convention documented in CLAUDE.md; MDX renders.
- All machine specs pass unchanged (reducers untouched).
Verification
GREEN + npm run test-storybook:ci. Smoke: all three wizards step forward/back and
submit.
Out of scope
Changing reducer logic or messages; store specs for root stores (they're covered where logic exists).
Risks
Rename ripple — purely mechanical; reducer specs are the net.