feat(site): the Zuiddrecht resident pages match the boards: board keys on blocks and pages, menu groups and rows from the portal

[rubenvdlinde]

Why

The signed-in pages of the Zuiddrecht example site are rendered by the generic Mijn omgeving blocks, and the Mijn Zuiddrecht boards (MijnOverzicht, MijnZaken, Zaak, MijnMenu) draw several of them differently. Measured on the demo instance (:8097, 6 October; the "before" and "after" shots and the boards rendered from their x-dc source are in the lane dir, named in the report): the case cards were Den Haag folder cards with the step line above a 6px bar and a green status badge; the open question was an action row with a date badge; the newest messages were action rows with "Nieuw" badges and chevrons; the resident menu had the site's own groups and no Overzicht entry; Mijn zaken drew folder cards; the case page opened on "Uw zaak" as the h1 with the title under it, showed Documenten and Wat er is gebeurd twice, and had no Gegevens heading and no Mijn zaken crumb.

The site serves every portal, so none of this can be the new default: each difference is a key a contribution or a portal declares, and a block, page or portal that declares none renders as before (tested).

What changes

Keys a contribution may declare (lib/Contribution/BoardKeys.php, wired into the list, school, record and resolver normalisers; each kept only when well formed):

• cases: display: compact (number left, pill tag right, the title as a link, an 8px bar, one line "Stap 1 van 5 · klaar uiterlijk 1 november" under it), showAll: true ("Alle zaken" beside the heading whenever the collection has a page), yourTurn: [values] (the turn values at which the tag reads the turn's words, in the warning tone, instead of the status in the new info tone).
• tasks with display: highlight: tone: warning|info, dueInLine: true ("Voor uw aanvraag ..., uiterlijk 18 oktober").
• inbox: display: list (a title and "vandaag" / "gisteren" / the day, "Alle berichten" beside the heading, no badge, no chevron).
• documents: upload: true (an outlined "Document toevoegen" beside the heading, through the case screen's route).
• detail: label (a heading over the facts, "Gegevens") and timeline: false (the card draws no history of its own, the timeline block does).
• citizenCase: display: actions (the closed window sentence as a green notice with a tick; no status block, no documents section; the fields, "Mijn wijziging opslaan" and "Deze aanvraag intrekken" stay).
• a page record: heading: record (the record's name is the h1, "Uw zaak · 2026-0082" its eyebrow) and under: cases (the breadcrumb passes through Mijn zaken).

Keys a portal may declare (portal schema 0.12.0, register 0.67.0, both additive): residentMenu.groups (the menu in the portal's own groups by section name or app:page, overview as an item that opens /mijn, no icons; an item the layout does not name keeps its place in the site's own groups, so nothing becomes unreachable) and myCases.display: rows (Mijn zaken as rows with "Uiterlijk klaar op"). The Zuiddrecht example site declares both.

Where every moved thing is reachable now: Bezwaar maken and Klacht indienen stay on the overview (dossiq's cta blocks, unchanged); Mijn wijziging opslaan and Deze aanvraag intrekken stay on the case page under Stukken (the case screen with display: actions); Toegang tot zaken and Melding indienen stay in the menu (Melding indienen in the declared "Vragen en meldingen" group, Toegang tot zaken appended in the site's own "Zaken en taken" group). The tests in tests/zuiddrecht-resident-boards.spec.mjs render each.

What dossiq must declare for the boards to show (not in this PR; swapped in on :8097 by rename for the live check, originals restored): in lib/Portal/PortalPages.php the keys above on its overview blocks (cases: display, showAll, yourTurn: ['applicant']; tasks: display: 'highlight', tone: 'warning', dueInLine: true, buttonLabel: 'Document toevoegen'; inbox: display: 'list'), on its case page (record: heading: 'record', under: 'cases'; documents: label: 'Stukken', upload: true; detail: label: 'Gegevens', timeline: false; citizenCase: display: 'actions'), and in lib/Portal/CitizenManifest.php valueLabels.portalTurn.applicant reading "Wacht op u". The open question's case line ("Voor uw aanvraag parkeervergunning") needs a lookup of the case title on the vragenAanU block (lookups + subtitleFields), also dossiq's.

Open decision, not changed

The case page's section order stays dossiq's (steps, documents, timeline, facts, actions); the board draws steps, Gegevens, Stukken, then the question.

Remaining differences, each with its reason

• The e-mail prompt keeps text above buttons and "Niet nu" as an outlined button (the board: one row, a text button): ContactPrompt is shared by every portal and has no portal key yet.
• The question panel ("Een vraag over deze zaak?" with a textarea) stays the "Bericht sturen" button opening dossiq's reply form: an inline form for a cta is a new block display out of this PR's scope.
• "Terug naar Mijn zaken" keeps the collection's label with its capital.
• The warning tag's colours come from the bridge's status-badge warning roles (a 12% warning tint, darker text) rather than the board's #fff4de / #7a4f00; the info tag reads the set's info roles exactly.
• The current step keeps Den Haag's 2px ring (the board draws 3px): the marker has one border width for every state.
• Page titles are 40px where the board draws 44px (they carry utrecht-heading-2, the record's name's size); the greeting is 44px.

Verified

• PHP: composer check:strict (COMPOSER_PROCESS_TIMEOUT=0, per-lane TMPDIR): lint, phpcs, phpmd, psalm, phpstan green; PHPUnit 2914 tests with the 46 inherited "class not found" errors (identical on a clean development clone, see feat(site): the Zuiddrecht example resident: Sanne de Vries, her cases and a sign-in without a broker #1227) and no failure after the register test pin (PortaliqRegisterConfigTest OK, 26 tests). tests/Unit/Contribution/BoardKeysTest.php + the five neighbouring normaliser tests: 74 tests OK. phpcs on every changed PHP file: clean.
• Node: npm run check:specs (all 118 specs, the new check:resident-boards wired in): exit 0 (118 spec files, 0 failing). npm run lint: 0 errors. stylelint, format (prettier), check:schema-l10n, check:l10n-js, check:register, check:json-strict: exit 0.
• Hydra gates the CI way (ConductionNL/.github main, HYDRA_GATE_BASE_REF=origin/development): 86 of 86 applicable gates ran; one red, gate-64 apphost-autoload-prelude on lib/AppInfo/StorePlaneRegistrar.php, untouched by this PR (inherited; identical on origin/development).
• Live on :8097 with thematiq chore(release): 0.2.8-unstable.20261002145016 #1106, this branch, feat(signin): one click on a demo signs the example resident in, behind an explicit switch #1250 and dossiq declaring the keys: the overview, Mijn zaken, the case page and Berichten shot at 1440 and 390 beside the boards (shots in the lane dir); the menu groups, Overzicht, the compact cards with "klaar uiterlijk", the plain message list, the rows with "Uiterlijk klaar op", the eyebrow and h1, the Mijn zaken crumb, Gegevens, Stukken with Document toevoegen, the green "U hoeft nu niets te doen" notice, and the save and withdraw buttons all on screen.

Inherited, not touched: gate-64 above.

🤖 Generated with Claude Code

[github-actions]

Quality Report — ConductionNL/portaliq @ f71fb7f

Check	PHP	Vue	Security	License	Tests
lint	✅
phpcs	✅
phpmd	❌
psalm	✅
phpstan	✅
phpmetrics	✅
eslint		✅
stylelint		✅
build		✅
check-specs		✅
check-manifest		✅
format		✅
check-l10n-js		✅
check-schema-l10n		✅
check-reuse		✅
composer			✅	✅ 108/108
npm			✅	✅ 984/984
app:check-code	⏭️
info.xml	✅
REUSE	✅
lockfile sync		✅
PHPUnit					✅
Newman					✅
Playwright					⏭️ deferred: E2E runs locally and on the promotion path only. This pull request targets development, so the suite is asked once per promotion into beta and main rather than once per push per open pull request. Run it locally with npx playwright test, or from the Actions tab on a branch with no open pull request into development.
Hydra gates					❌

---

Quality workflow — 2026-10-06 22:39 UTC

Download the full PDF report from the workflow artifacts.

[github-actions]

Quality Report — ConductionNL/portaliq @ 5465540

Check	PHP	Vue	Security	License	Tests
lint	✅
phpcs	✅
phpmd	❌
psalm	✅
phpstan	✅
phpmetrics	✅
eslint		✅
stylelint		✅
build		✅
check-specs		✅
check-manifest		✅
format		✅
check-l10n-js		✅
check-schema-l10n		✅
check-reuse		✅
composer			✅	✅ 108/108
npm			✅	✅ 984/984
app:check-code	⏭️
info.xml	✅
REUSE	✅
lockfile sync		✅
PHPUnit					✅
Newman					✅
Playwright					⏭️ deferred: E2E runs locally and on the promotion path only. This pull request targets development, so the suite is asked once per promotion into beta and main rather than once per push per open pull request. Run it locally with npx playwright test, or from the Actions tab on a branch with no open pull request into development.
Hydra gates					❌

---

Quality workflow — 2026-10-06 23:01 UTC

Download the full PDF report from the workflow artifacts.