Refactored patient display from separate ClientHeader to integrated EPDHeader. Architecture changes: - Implemented React Context pattern for patient data sharing - Created PatientContext with useState + setPatient for dynamic updates - Created useSetPatient hook for patient injection from nested layouts - Created EPDLayoutClient wrapper with PatientProvider - Context flow: EPDLayout → EPDLayoutClient → EPDHeader (consumer) UI improvements: - Removed "Mini-ECD" logo from header - Left-aligned patient info: name + status + John Doe indicator - Added geboortedatum (dd-mm-yyyy Dutch format) - Added BSN extraction from FHIR identifiers - Compact layout: Patient details | Timestamp | Actions ⋮ | Search - Actions dropdown with "Nieuwe rapportage" (expandable) Cleanup: - Deleted ClientHeader component (141 lines duplicate code) - Simplified PatientLayoutClient (only useSetPatient hook) - Single source of truth for patient display Result: Clean context-based architecture, improved UX, -141 LOC 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
26 lines
611 B
TypeScript
26 lines
611 B
TypeScript
'use client';
|
|
|
|
import type { ReactNode } from 'react';
|
|
import { EPDHeader } from './epd-header';
|
|
import { PatientProvider } from './patient-context';
|
|
|
|
interface EPDLayoutClientProps {
|
|
children: ReactNode;
|
|
}
|
|
|
|
export function EPDLayoutClient({ children }: EPDLayoutClientProps) {
|
|
return (
|
|
<PatientProvider>
|
|
<div className="flex-1 flex flex-col min-w-0">
|
|
{/* Header - Fixed 60px height */}
|
|
<EPDHeader />
|
|
|
|
{/* Page Content - Scrollable */}
|
|
<main className="flex-1 overflow-auto bg-white">
|
|
{children}
|
|
</main>
|
|
</div>
|
|
</PatientProvider>
|
|
);
|
|
}
|