ehoandClaude Sonnet 5
43dc3210cd
The folder now equals the layer, as CLAUDE.md decision 2 requires. 33 directories move by git mv (25 flat, plus upload/'s 8 subfolders split across all three layers). 28 distinct @shared/ui/* specifiers rewrite across 73 files, longest-first. Five relative imports inside upload/ become @shared/ui aliases because their sibling now lives in a different layer; two stay relative because both ends stay in the same layer. Four .mdx docs get their seven broken story imports fixed; atomic-design.mdx's page-shell import is untouched, because layout/ does not move. No component, template, story title, or layer-tag comment changes. That is RD-28's job. Verified against the ticket's acceptance commands: the 26 flat directories become exactly 3 layer folders with the counts the ticket names, only three @shared/ui/* prefixes remain (atoms, molecules, organisms), the .mdx import count holds at 7, and the relative-import count inside ui/ drops from 7 to 2 as decision 4 requires. The @shared/ui/ occurrence count moves from 200 to 205: decision 4 mandates turning 5 of those 7 relative imports into @shared/ui/* aliases, which decision 3's "200 before, 200 after" check does not account for. The 5-occurrence gap is exactly the 5 conversions decision 4 names, not a lost or duplicated specifier. npm run ci --full passes: lint, typecheck, dep:check, format, tokens, seam, both apps' + both libraries' tests, both apps' localized build, audit, backend tests, all three generated-artifact drift checks, and both Storybook instances' build + axe-core a11y suite (67+45 suites, 198+112 tests, all green). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
73 lines
3.0 KiB
TypeScript
73 lines
3.0 KiB
TypeScript
import { Component, input } from '@angular/core';
|
|
import { DatePipe } from '@angular/common';
|
|
import { Registration } from '@registratie/domain/registration';
|
|
import { statusColor, statusLabel } from '@registratie/domain/registration.policy';
|
|
import { DataRowComponent } from '@shared/ui/molecules/data-row/data-row.component';
|
|
import { StatusBadgeComponent } from '@shared/ui/atoms/status-badge/status-badge.component';
|
|
import { DataBlockComponent } from '@shared/ui/molecules/data-block/data-block.component';
|
|
|
|
/** Organism: registration summary in a CIBG Datablock. Composes data-row rows +
|
|
status-badge atom (no card wrapper — the datablock carries its own surface). */
|
|
@Component({
|
|
selector: 'app-registration-summary',
|
|
imports: [DatePipe, DataRowComponent, StatusBadgeComponent, DataBlockComponent],
|
|
template: `
|
|
<app-data-block i18n-ariaLabel="@@summary.ariaLabel" ariaLabel="Registratiegegevens">
|
|
<div
|
|
app-data-row
|
|
i18n-key="@@summary.bigNummer"
|
|
key="BIG-nummer"
|
|
[value]="reg().bigNummer"
|
|
></div>
|
|
<div app-data-row i18n-key="@@summary.naam" key="Naam" [value]="reg().naam"></div>
|
|
<div app-data-row i18n-key="@@summary.beroep" key="Beroep" [value]="reg().beroep"></div>
|
|
<div app-data-row i18n-key="@@summary.status" key="Status">
|
|
<app-status-badge [label]="label()" [color]="color()" />
|
|
</div>
|
|
<div
|
|
app-data-row
|
|
i18n-key="@@summary.registratiedatum"
|
|
key="Registratiedatum"
|
|
[value]="reg().registratiedatum | date: 'longDate'"
|
|
></div>
|
|
<!-- Each status variant renders only the row its own data supports. A single
|
|
@let binds status once so the @switch narrows its union by tag -- calling
|
|
reg().status again per case would give the checker a fresh, unnarrowed call. -->
|
|
@let status = reg().status;
|
|
@switch (status.tag) {
|
|
@case ('Geregistreerd') {
|
|
<div
|
|
app-data-row
|
|
i18n-key="@@summary.uiterste"
|
|
key="Uiterste herregistratie"
|
|
[value]="status.herregistratieDatum | date: 'longDate'"
|
|
></div>
|
|
}
|
|
@case ('Geschorst') {
|
|
<div
|
|
app-data-row
|
|
i18n-key="@@summary.geschorstTot"
|
|
key="Geschorst tot"
|
|
[value]="status.geschorstTot | date: 'longDate'"
|
|
></div>
|
|
<div app-data-row i18n-key="@@summary.reden" key="Reden" [value]="status.reden"></div>
|
|
}
|
|
@case ('Doorgehaald') {
|
|
<div
|
|
app-data-row
|
|
i18n-key="@@summary.doorgehaaldOp"
|
|
key="Doorgehaald op"
|
|
[value]="status.doorgehaaldOp | date: 'longDate'"
|
|
></div>
|
|
<div app-data-row i18n-key="@@summary.reden" key="Reden" [value]="status.reden"></div>
|
|
}
|
|
}
|
|
</app-data-block>
|
|
`,
|
|
})
|
|
export class RegistrationSummaryComponent {
|
|
reg = input.required<Registration>();
|
|
protected label = () => statusLabel(this.reg().status.tag);
|
|
protected color = () => statusColor(this.reg().status.tag);
|
|
}
|