Active Cases

A stage-by-stage board of the patients you are treating, with value and coordinator.

<!-- GENERATED FILE. Do not edit by hand. Source: components/help/content/. Run npm run gen:docs. -->

Purpose & Business Context

Active Cases is the clinic's delivery board. Once an inquiry becomes a confirmed patient, it lives here as a case that moves through stages from Quoted to Recovery. The screen answers the operational questions a partner clinic asks daily: who am I treating, what stage is each patient at, how much is the case worth, and which coordinator is on the patient side.

Commercially it is the revenue-in-flight view. Grouping cases by stage makes bottlenecks visible (for example several patients stuck at Treatment planned) and the open pipeline total quantifies the value the clinic is actively delivering.

Screen Overview

A summary header of three stat cards (Open cases, Open pipeline value, Total cases) sits above a Kanban-style board. The board renders one column per case stage that actually has cases, and each column holds case cards for the patients in that stage.

For the demo, five cases span the pipeline: Yusuf Al-Rashid (Treatment planned), Sarah Thompson (Quoted), Grace Wanjiru (In treatment), Omar Haddad (Recovery) and Ahmed Saleh (Closed).

Controls & Components

• Summary stats (x3): Open cases (count of non-Closed cases), Open pipeline value (their summed USD value) and Total cases (every case including Closed).
• Stage columns: one column per stage that has at least one case, in order Inquiry, Quoted, Treatment planned, In treatment, Recovery, Closed. Each header shows a stage-coloured dot and a count pill.
• Case cards: patient name and flag, country, procedure, a surgery or status date, the case value (USD), the patient-side coordinator and a stage-coloured Badge.

Field Definitions

• Open cases: Cases whose stage is not Closed, the patients you are actively treating.
• Open pipeline value: The sum of the case values (USD) across all open cases.
• Total cases: The count of every case on the board, including Closed ones.
• Stage: The case's position in the delivery pipeline: Inquiry, Quoted, Treatment planned, In treatment, Recovery or Closed, each with its own colour.
• Surgery date: A human-readable date or status on the card, for example '12 Jun 2026', 'Admitted 1 Jun' or 'Discharged 28 May'.
• Value: The case value in USD shown on the card, the price the clinic is delivering against.
• Coordinator: The Global Clinic coordinator on the patient side (for example Priya Nair or Arjun Rao) who liaises with the patient.

User Actions & Workflows

1. Read the three summary stats to gauge open caseload and pipeline value.
2. Scan the columns left to right to see how cases are distributed across the pipeline.
3. Find a patient's card to check their procedure, date, value and coordinator.
4. Use the stage counts to spot where work is clustering and which patients are nearing treatment.
5. Cross-reference the coordinator name when you need to reach the patient-side contact.

Navigation & Relationships

Reached from: the sidebar Cases item, the dashboard Active cases tile, the Open pipeline tile, and any row in the dashboard's Pipeline snapshot.

Continues from: the Inquiries inbox; an accepted inquiry is the upstream of an active case.

Summarised by: the dashboard, whose Active cases and Open pipeline tiles and Pipeline snapshot are computed from the same clinicCases data shown here.

Business Rules & Constraints

• Clinic-only screen; gated by RequireAuth with role "clinic".
• The board only renders columns for stages that currently contain cases, keeping it tidy.
• Open cases and Open pipeline value always exclude Closed cases; Total cases includes them.
• The board is read-only in this prototype: cards display case state but cannot be dragged between stages.
• Stage colour is consistent everywhere (dot, count pill and Badge) so a stage reads the same across the console.

Data Dependencies

Reads clinicCases from lib/data (backed by data/clinicCases.json). Open counts, the pipeline total and the per-stage columns are all derived from that array at render time.

• clinicCases: the seeded case list (patient, procedure, stage, date, value, coordinator)
• derived openCases / openValue: power the summary stats
• derived columns: the set of stages that have cases

Error Handling & Edge Cases

• A stage with no cases is simply omitted from the board rather than shown as an empty column.
• Long patient names on a card are truncated with an ellipsis so cards keep a uniform height.
• Date fields accept free-form status text (Admitted, Discharged, Completed) as well as calendar dates.
• Mobile and narrow widths: the column grid reflows so columns stack and remain scrollable.

User Roles & Permissions

• Clinic admin: Full view of the board, summary metrics and every case card.
• Clinic staff: Same view; clinical and coordination staff use the board to track and deliver patient care.
• Patient / other roles: No access. Patients see their own single case in the patient app's Journey, not the clinic's whole board.

Related Features & Functionalities

The Inquiries inbox (the source of new cases), the dashboard (Active cases, Open pipeline and the Pipeline snapshot), the Team screen (the surgeons delivering these cases) and the patient app's Journey, which is the patient-facing mirror of a single case.

Flow & Screenshots

flowchart LR
  Cases[Active Cases] --> Stats[Summary stats]
  Cases --> Board[Stage board]
  Board --> Q[Quoted]
  Q --> TP[Treatment planned]
  TP --> IT[In treatment]
  IT --> Rec[Recovery]
  Rec --> Closed[Closed]

Guided Walkthrough Steps

The in-app walkthrough for this screen has 6 steps (auto-advances every 5 seconds; Prev / Pause / Next; click outside to exit):

1. Active Cases ([data-tour="nav.cases"])

Your delivery board for every patient you are treating. You are on the Cases tab now.

1. Caseload at a glance ([data-tour="cases.summary"])

Open cases, the open pipeline value they represent, and your total case count, all computed live.

1. The stage board ([data-tour="cases.board"])

Cases are grouped into columns by stage, from Quoted through Recovery to Closed. Only stages with cases appear, so the board stays tidy.

1. Where cases begin ([data-tour="nav.inquiries"])

Every case starts as an inquiry. Accept a lead in the inbox and it becomes a case here.

1. Who delivers care ([data-tour="nav.team"])

The surgeons and staff treating these patients are managed on the Team screen.

1. Case events ([data-tour="topbar.notifications"])

Escrow releases and surgery scheduling for your cases show up in the notifications bell.