ehoandClaude Sonnet 5
5977efe044
Each dashboard section (Mijn aanvragen, Wat moet ik regelen, Mijn registratie, Specialismen, Wat wilt u doen, Beheer) now owns its own store access, async state, and template. DashboardPage becomes pure composition. Extract the repeated RemoteData Success-narrowing pattern into successOf() and the dashboard sort/split logic into sortForDashboard/concepten/ingediend, both with tests. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
44 lines
1.9 KiB
TypeScript
44 lines
1.9 KiB
TypeScript
import { Component, inject } from '@angular/core';
|
|
import { successOf } from '@shared/application/remote-data';
|
|
import { HeadingComponent } from '@shared/ui/heading/heading.component';
|
|
import { SkeletonComponent } from '@shared/ui/skeleton/skeleton.component';
|
|
import { ASYNC } from '@shared/ui/async/async.component';
|
|
import { BigProfileStore } from '@registratie/application/big-profile.store';
|
|
import { RegistrationTableComponent } from '@registratie/ui/registration-table/registration-table.component';
|
|
|
|
/** Section: "Specialismen en aantekeningen" — a separate resource from the rest of
|
|
the dashboard (own load/empty/error state), because it is genuinely a second
|
|
endpoint (`big-register.adapter.ts`), not part of the BFF-lite view call. */
|
|
@Component({
|
|
selector: 'app-specialismen-section',
|
|
imports: [HeadingComponent, SkeletonComponent, RegistrationTableComponent, ...ASYNC],
|
|
template: `
|
|
<section>
|
|
<app-heading [level]="2" i18n="@@dashboard.specialismen"
|
|
>Specialismen en aantekeningen</app-heading
|
|
>
|
|
<div class="app-section">
|
|
<app-async [data]="store.aantekeningen()" (retryClicked)="store.reloadAantekeningen()">
|
|
<ng-template appAsyncLoaded>
|
|
@if (aantekeningen(); as r) {
|
|
<app-registration-table [rows]="r" />
|
|
}
|
|
</ng-template>
|
|
<ng-template appAsyncLoading>
|
|
<app-skeleton height="2.5rem" [count]="3" />
|
|
</ng-template>
|
|
<ng-template appAsyncEmpty>
|
|
<p class="app-text-subtle" i18n="@@dashboard.geenSpecialismen">
|
|
U heeft nog geen specialismen of aantekeningen.
|
|
</p>
|
|
</ng-template>
|
|
</app-async>
|
|
</div>
|
|
</section>
|
|
`,
|
|
})
|
|
export class SpecialismenSection {
|
|
protected store = inject(BigProfileStore);
|
|
protected aantekeningen = () => successOf(this.store.aantekeningen());
|
|
}
|