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>
23 lines
635 B
TypeScript
23 lines
635 B
TypeScript
'use client';
|
|
|
|
import type { ReactNode } from 'react';
|
|
import type { FHIRPatient } from '@/lib/fhir';
|
|
import { useSetPatient } from '@/app/epd/components/patient-context';
|
|
|
|
interface PatientLayoutClientProps {
|
|
patient: FHIRPatient;
|
|
patientId: string;
|
|
children: ReactNode;
|
|
}
|
|
|
|
export function PatientLayoutClient({ patient, children }: PatientLayoutClientProps) {
|
|
// Inject patient data into the context (provided by parent EPDLayoutClient)
|
|
useSetPatient(patient);
|
|
|
|
return (
|
|
<div className="flex h-full flex-1 flex-col bg-white">
|
|
<div className="flex-1 overflow-auto bg-slate-50">{children}</div>
|
|
</div>
|
|
);
|
|
}
|