# asithalkonara/sl-mediflow-frontend architecture

> Architecture diagram of the GitHub repository asithalkonara/sl-mediflow-frontend, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-12). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/asithalkonara/sl-mediflow-frontend
- Repository: https://github.com/asithalkonara/sl-mediflow-frontend

## Overview

SL MediFlow is a role-based healthcare operations frontend. Its principal documented flow spans reception and queues, clinical consultation, lab and pharmacy fulfillment, and centralized cashier billing; separate branches cover administration, patient-facing records, and hardware/printing. The sampled source confirms authentication and hardware integration details, but most role-page interactions and their backend calls were not sampled, so those links are shown only where the README or excerpts establish them.

Main entry points: [`src/app/(dashboard)/cashier/page.tsx`](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/cashier/page.tsx) (Central billing), [`src/app/(dashboard)/doctor/consultation/[patientId]/page.tsx`](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/doctor/consultation/%5BpatientId%5D/page.tsx) (Consultation), [`src/components/providers/AuthProvider.tsx`](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/components/providers/AuthProvider.tsx) (Session provider), [`src/app/(dashboard)/receptionist/page.tsx`](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/receptionist/page.tsx) (Reception & queues)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_access["Access &amp; Navigation"]
  node_auth["Sign-in &amp; registration<br/>[page.tsx]"]
  node_session["Session provider<br/>[AuthProvider.tsx]"]
  node_dash["Role dashboards<br/>[layout.tsx]"]
end

subgraph group_care["Clinical Operations"]
  node_frontdesk["Reception &amp; queues<br/>[page.tsx]"]
  node_arrivals["Arrival scheduling<br/>[page.tsx]"]
  node_doctor["Consultation<br/>[page.tsx]"]
  node_prescriptions["Prescription builder<br/>[page.tsx]"]
  node_lab["Laboratory workflow<br/>[page.tsx]"]
  node_labresults["Results entry<br/>[page.tsx]"]
  node_pharmacy["Pharmacy POS<br/>[page.tsx]"]
  node_extra["Extra services"]
end

subgraph group_finance["Billing &amp; Administration"]
  node_cashier["Central billing<br/>[page.tsx]"]
  node_payments["Payment processing<br/>[page.tsx]"]
  node_refunds["Refunds<br/>[page.tsx]"]
  node_admin["Hospital administration<br/>[page.tsx]"]
  node_inventory["Inventory management<br/>[page.tsx]"]
  node_financeengine["Finance engine<br/>[page.tsx]"]
end

subgraph group_patient["Patient Services"]
  node_portal["Patient portal<br/>[page.tsx]"]
  node_reports["Public reports<br/>[page.tsx]"]
end

subgraph group_devices["Hardware &amp; Output"]
  node_display["Customer display<br/>[page.tsx]"]
  node_sync["Cart synchronization<br/>[useCartSync.ts]"]
  node_displayhook["Display sync hook"]
  node_hardwarehook["Hardware controls<br/>[useHardware.ts]"]
  node_hardware["Hardware facade"]
  node_pole["Pole display engine"]
  node_print["Thermal printing"]
  node_autocut["Printer auto-cut<br/>[printerAutoCut.ts]"]
  node_printerapi["Printer cut endpoint<br/>[route.ts]"]
end

node_user(("Hospital staff"))
node_backend[("MediFlow API")]
node_bridge["Local print bridge"]

node_user -->|"signs in"| node_auth
node_auth -.->|"establishes session"| node_session
node_session -->|"refreshes session"| node_backend
node_session -.->|"gates access"| node_dash
node_dash -.->|"routes staff"| node_frontdesk
node_frontdesk -->|"queues patients"| node_doctor
node_doctor -->|"builds prescriptions"| node_prescriptions
node_doctor -->|"requests tests"| node_lab
node_lab -->|"enters results"| node_labresults
node_prescriptions -->|"sends prescription"| node_pharmacy
node_doctor -.->|"orders services"| node_extra
node_frontdesk -->|"aggregates charges"| node_cashier
node_lab -->|"aggregates charges"| node_cashier
node_pharmacy -->|"pushes charges"| node_cashier
node_cashier -.->|"processes payment"| node_payments
node_cashier -.->|"manages refunds"| node_refunds
node_admin -->|"manages stock"| node_inventory
node_admin -->|"tracks finances"| node_financeengine
node_user -.->|"views records"| node_portal
node_user -.->|"opens report"| node_reports
node_sync -->|"provides cart state"| node_displayhook
node_displayhook -.->|"supplies display state"| node_display
node_hardwarehook -->|"controls devices"| node_hardware
node_hardwarehook -->|"loads configuration"| node_pole
node_hardware -->|"sends display data"| node_pole
node_hardware -->|"calls bridge"| node_bridge
node_autocut -->|"requests cut"| node_printerapi
node_autocut -->|"fallback print"| node_bridge
node_print -.->|"triggers cut"| node_autocut

click node_auth "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(auth)/login/page.tsx"
click node_session "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/components/providers/AuthProvider.tsx"
click node_dash "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/layout.tsx"
click node_frontdesk "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/receptionist/page.tsx"
click node_arrivals "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/frontdesk/arrivals/page.tsx"
click node_doctor "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/doctor/consultation/%5BpatientId%5D/page.tsx"
click node_prescriptions "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/doctor/prescriptions/page.tsx"
click node_lab "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/labtech/requests/page.tsx"
click node_labresults "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/labtech/results/%5BrequestId%5D/page.tsx"
click node_pharmacy "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/pharmacist/prescriptions/page.tsx"
click node_extra "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/components/doctor/ExtraServiceOrderModal.tsx"
click node_cashier "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/cashier/page.tsx"
click node_payments "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/cashier/process/%5BpaymentId%5D/page.tsx"
click node_refunds "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/billing/refunds/page.tsx"
click node_admin "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/superadmin/page.tsx"
click node_inventory "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/superadmin/inventory/page.tsx"
click node_financeengine "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/superadmin/finance/page.tsx"
click node_portal "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/patient-portal/dashboard/page.tsx"
click node_reports "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/reports/%5BreferenceNo%5D/page.tsx"
click node_display "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/customer-display/page.tsx"
click node_sync "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/frontdesk/hooks/useCartSync.ts"
click node_displayhook "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/hooks/useCustomerDisplaySync.ts"
click node_hardwarehook "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/hooks/useHardware.ts"
click node_hardware "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/services/hardware.service.ts"
click node_pole "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/services/pole-display.service.ts"
click node_print "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/components/printing/PrescriptionPrintTemplate.tsx"
click node_autocut "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/lib/printerAutoCut.ts"
click node_printerapi "https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/api/printer/cut/route.ts"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_auth,node_session,node_dash toneBlue
class node_frontdesk,node_arrivals,node_doctor,node_prescriptions,node_lab,node_labresults,node_pharmacy,node_extra,node_backend toneAmber
class node_cashier,node_payments,node_refunds,node_admin,node_inventory,node_financeengine toneMint
class node_portal,node_reports toneRose
class node_display,node_sync,node_displayhook,node_hardwarehook,node_hardware,node_pole,node_print,node_autocut,node_printerapi,node_user,node_bridge toneIndigo
```

## Components

### Access & Navigation

- [Sign-in & registration](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(auth)/login/page.tsx): `src/app/(auth)/login/page.tsx`
- [Session provider](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/components/providers/AuthProvider.tsx): `src/components/providers/AuthProvider.tsx`
- [Role dashboards](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/layout.tsx): `src/app/(dashboard)/layout.tsx`

### Clinical Operations

- [Reception & queues](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/receptionist/page.tsx): `src/app/(dashboard)/receptionist/page.tsx`
- [Arrival scheduling](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/frontdesk/arrivals/page.tsx): `src/app/frontdesk/arrivals/page.tsx`
- [Consultation](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/doctor/consultation/%5BpatientId%5D/page.tsx): `src/app/(dashboard)/doctor/consultation/[patientId]/page.tsx`
- [Prescription builder](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/doctor/prescriptions/page.tsx): `src/app/(dashboard)/doctor/prescriptions/page.tsx`
- [Laboratory workflow](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/labtech/requests/page.tsx): `src/app/(dashboard)/labtech/requests/page.tsx`
- [Results entry](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/labtech/results/%5BrequestId%5D/page.tsx): `src/app/(dashboard)/labtech/results/[requestId]/page.tsx`
- [Pharmacy POS](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/pharmacist/prescriptions/page.tsx): `src/app/(dashboard)/pharmacist/prescriptions/page.tsx`
- [Extra services](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/components/doctor/ExtraServiceOrderModal.tsx): `src/components/doctor/ExtraServiceOrderModal.tsx`

### Billing & Administration

- [Central billing](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/cashier/page.tsx): `src/app/(dashboard)/cashier/page.tsx`
- [Payment processing](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/cashier/process/%5BpaymentId%5D/page.tsx): `src/app/(dashboard)/cashier/process/[paymentId]/page.tsx`
- [Refunds](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/billing/refunds/page.tsx): `src/app/(dashboard)/billing/refunds/page.tsx`
- [Hospital administration](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/superadmin/page.tsx): `src/app/(dashboard)/superadmin/page.tsx`
- [Inventory management](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/superadmin/inventory/page.tsx): `src/app/(dashboard)/superadmin/inventory/page.tsx`
- [Finance engine](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/(dashboard)/superadmin/finance/page.tsx): `src/app/(dashboard)/superadmin/finance/page.tsx`

### Patient Services

- [Patient portal](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/patient-portal/dashboard/page.tsx): `src/app/patient-portal/dashboard/page.tsx`
- [Public reports](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/reports/%5BreferenceNo%5D/page.tsx): `src/app/reports/[referenceNo]/page.tsx`

### Hardware & Output

- [Customer display](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/customer-display/page.tsx): `src/app/customer-display/page.tsx`
- [Cart synchronization](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/frontdesk/hooks/useCartSync.ts): `src/app/frontdesk/hooks/useCartSync.ts`
- [Display sync hook](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/hooks/useCustomerDisplaySync.ts): `src/hooks/useCustomerDisplaySync.ts`
- [Hardware controls](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/hooks/useHardware.ts): `src/hooks/useHardware.ts`
- [Hardware facade](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/services/hardware.service.ts): `src/services/hardware.service.ts`
- [Pole display engine](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/services/pole-display.service.ts): `src/services/pole-display.service.ts`
- [Thermal printing](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/components/printing/PrescriptionPrintTemplate.tsx): `src/components/printing/PrescriptionPrintTemplate.tsx`
- [Printer auto-cut](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/lib/printerAutoCut.ts): `src/lib/printerAutoCut.ts`
- [Printer cut endpoint](https://github.com/asithalkonara/sl-mediflow-frontend/blob/main/src/app/api/printer/cut/route.ts): `src/app/api/printer/cut/route.ts`

### Other components

- **Hospital staff**
- **MediFlow API**
- **Local print bridge**

## Connections

- Hospital staff → Sign-in & registration: signs in (evidence: `README.md`)
- Sign-in & registration → Session provider: establishes session
- Session provider → MediFlow API: refreshes session (evidence: `src/components/providers/AuthProvider.tsx`)
- Session provider → Role dashboards: gates access
- Role dashboards → Reception & queues: routes staff
- Reception & queues → Consultation: queues patients (evidence: `README.md`)
- Consultation → Prescription builder: builds prescriptions (evidence: `README.md`)
- Consultation → Laboratory workflow: requests tests (evidence: `README.md`)
- Laboratory workflow → Results entry: enters results (evidence: `README.md`)
- Prescription builder → Pharmacy POS: sends prescription (evidence: `README.md`)
- Consultation → Extra services: orders services
- Reception & queues → Central billing: aggregates charges (evidence: `README.md`)
- Laboratory workflow → Central billing: aggregates charges (evidence: `README.md`)
- Pharmacy POS → Central billing: pushes charges (evidence: `README.md`)
- Central billing → Payment processing: processes payment
- Central billing → Refunds: manages refunds
- Hospital administration → Inventory management: manages stock (evidence: `README.md`)
- Hospital administration → Finance engine: tracks finances (evidence: `README.md`)
- Hospital staff → Patient portal: views records
- Hospital staff → Public reports: opens report
- Cart synchronization → Display sync hook: provides cart state (evidence: `src/hooks/useCustomerDisplaySync.ts`)
- Display sync hook → Customer display: supplies display state
- Hardware controls → Hardware facade: controls devices (evidence: `src/hooks/useHardware.ts`)
- Hardware controls → Pole display engine: loads configuration (evidence: `src/hooks/useHardware.ts`)
- Hardware facade → Pole display engine: sends display data (evidence: `src/services/hardware.service.ts`)
- Hardware facade → Local print bridge: calls bridge (evidence: `src/services/hardware.service.ts`)
- Printer auto-cut → Printer cut endpoint: requests cut (evidence: `src/lib/printerAutoCut.ts`)
- Printer auto-cut → Local print bridge: fallback print (evidence: `src/lib/printerAutoCut.ts`)
- Thermal printing → Printer auto-cut: triggers cut
