Guides
The recipes for working in the product site — adding a board, adding a filter, putting a route on a phone, and getting a preview deployment.
Add a board
- Route. A
page.tsxunder the group it belongs to —(features)/(props)/my-board/page.tsx. The nested groups add no layout; they exist so the file tree reads like the nav. - Parts.
src/composed/my-board/, one directory for the board. - Shape. Render
FeatureTemplaterather than assembling the filter bar, panel and body by hand. See Architecture. - Filters.
src/components/filters/my-board-filters.tsx, renderingFilterGroups. That file is the complete set. - State. nuqs keys, so the board's state is its URL.
- Look at it.
bun run dev:web, then open the route — the gates do not catch a board that renders below the fold.
Add a filter
It goes in the panel file above. Put it on the top bar as well only if it is changed between one look at the results and the next, and bind both controls to the same nuqs key.
Conventions has the two bugs this prevents, and why a filter reachable only from the bar is one of them.
Retire a legacy route
LEGACY_ROUTES in next.config.js lists what still belongs to
legacy. Build the page here, then delete the entry — in
that order. The rewrites match first, so a page added while its entry stands is
never reached.
Look at a change
The dev box has no display and no browser, and localhost in a link reaches
whoever is reading it. Take the address from the registry:
node packages/statshub-tooling/apps.cjs # what is serving, and where
bun run phone # a QR code for a real deviceThe preview skill covers driving the browser and reading its console.
Ship a preview
Deploy a preview is the shared procedure — this app is one of the ones it covers.
Packages
The four workspace packages this app pulls in, what each settles, and the rule for when a component moves out of src/components and into the kit.
Agents
What to load before writing code in the product site, the rules a gate will not catch for you, and the one thing that always has to be checked in a browser.