> ## Documentation Index
> Fetch the complete documentation index at: https://docs.clinikapi.com/llms.txt
> Use this file to discover all available pages before exploring further.

# PatientDashboard

> Full patient overview widget with encounters, vitals, medications, labs, notes, and prescriptions.

# PatientDashboard

A comprehensive patient overview displaying demographics, appointments, lab reports, prescriptions, and clinical notes. Supports light, dark, and glassmorphism themes.

## Usage

```tsx theme={null}
import { PatientDashboard } from '@clinikapi/react';

<PatientDashboard
  proxyUrl="/api/clinik"
  patientId="pt_abc123"
  theme="light"
/>
```

## Props

| Prop        | Type                                   | Required | Description                                        |
| ----------- | -------------------------------------- | -------- | -------------------------------------------------- |
| `proxyUrl`  | `string`                               | Yes      | Backend proxy URL (or `'demo'` for demo mode)      |
| `patientId` | `string`                               | No       | Patient ID to load (if omitted, shows create form) |
| `theme`     | `'light' \| 'dark' \| 'glassmorphism'` | No       | Color theme                                        |

## Views

The dashboard has three views:

1. **Create** — Patient creation form (firstName, lastName, email)
2. **Profile** — Patient overview with all related resources
3. **Edit** — Inline patient update form

## What It Displays

The profile view shows the patient's destructured FHIR bundle:

| Section            | FHIR Resource     | Enriched Fields                                                     |
| ------------------ | ----------------- | ------------------------------------------------------------------- |
| Patient info       | Patient           | name, email, photo, maritalStatus, languages, contacts              |
| Appointments       | Appointment       | status, appointmentType, serviceType, specialty, priority, created  |
| Labs & Diagnostics | DiagnosticReport  | code, status, category, effectiveDateTime/Period, conclusion        |
| Prescriptions      | MedicationRequest | medication, status, priority, category, dosageText, courseOfTherapy |
| Clinical Notes     | DocumentReference | title, docStatus, type, category, practiceSetting                   |

## Proxy Endpoint

Your proxy should handle the `patients.read` action with included resources:

```ts theme={null}
// Handle patients.read action
case 'patients.read':
  const { data } = await clinik.patients.read(body.data.id, {
    include: body.data.include || [
      'Encounter', 'Observation', 'MedicationRequest',
      'Appointment', 'DiagnosticReport', 'DocumentReference',
    ],
  });
  return Response.json({ data });
```

The SDK returns a `PatientReadResponse` with:

```ts theme={null}
{
  patient: Patient;
  encounters: Encounter[];
  observations: Observation[];
  medications: Medication[];
  appointments: Appointment[];
  intakes: QuestionnaireResponse[];
  consents: Consent[];
  labs: DiagnosticReport[];
  prescriptions: MedicationRequest[];
  notes: DocumentReference[];
  assessments: ClinicalImpression[];
  documents: Composition[];
}
```

## Actions

The dashboard can trigger:

* `patients.create` — Create a new patient
* `patients.read` — Load patient with included resources
* `patients.update` — Update patient demographics
* `appointments.create` — Schedule an appointment