- ST-601/602: loading skeletons en error boundary - ST-603: Sonner toasts op alle CRUD-operaties - ST-604: DemoTooltip op uitgeschakelde knoppen - ST-605: KeyboardSensor dnd-kit, Escape sluit modals - ST-606: min-width banner < 1024px - ST-607: WCAG AA aria-labels en skip link - ST-608: rate limiting login (10/min) en registratie (5/uur) - ST-609: security integratietests cross-user toegang (7 tests) - ST-610: GitHub Actions CI/CD workflow - ST-611: README met quickstart, deployment en API-docs - ST-612: Lars-flow acceptatiechecklist - fix: settings toont gebruikersnaam i.p.v. interne id - fix: seed idempotent, testdata altijd gekoppeld aan demo-gebruiker Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
34 lines
1.2 KiB
TypeScript
34 lines
1.2 KiB
TypeScript
export default function Loading() {
|
|
return (
|
|
<div className="flex flex-col h-full animate-pulse">
|
|
{/* Header skeleton */}
|
|
<div className="px-4 py-3 border-b border-border bg-surface-container-low shrink-0 flex items-center justify-between">
|
|
<div className="space-y-1.5">
|
|
<div className="h-4 w-32 bg-border rounded" />
|
|
<div className="h-3 w-48 bg-border/60 rounded" />
|
|
</div>
|
|
<div className="h-7 w-24 bg-border rounded" />
|
|
</div>
|
|
|
|
{/* Split pane skeleton */}
|
|
<div className="flex-1 flex overflow-hidden">
|
|
{/* Left */}
|
|
<div className="w-2/5 border-r border-border p-4 space-y-3">
|
|
<div className="h-4 w-24 bg-border rounded" />
|
|
{[1, 2, 3, 4, 5].map(i => (
|
|
<div key={i} className="h-8 bg-border/50 rounded" />
|
|
))}
|
|
</div>
|
|
{/* Right */}
|
|
<div className="flex-1 p-4 space-y-3">
|
|
<div className="h-4 w-16 bg-border rounded" />
|
|
<div className="flex gap-2 flex-wrap">
|
|
{[1, 2, 3].map(i => (
|
|
<div key={i} className="w-28 h-24 bg-border/50 rounded-lg" />
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|