marmar-context / web / context / src / clinician / patient / PatientTabs.tsx
PatientTabs.tsx
Raw
import type { PatientDetail } from "../../api/types";
import { tabNames, type PatientTab } from "../../logic/patients";
import { UnderlineTabs } from "../kit";
import { tabPath } from "./links";

/** Underline tabs, one address each: unread notes on Check-ins, a dot on Check when there is something new. */
export function PatientTabs({ patient, tabs, active }: { patient: PatientDetail; tabs: PatientTab[]; active: PatientTab }) {
  const unread = patient.attention.unreadNotes;
  return (
    <UnderlineTabs
      label="Patient sections"
      active={active}
      items={tabs.map((t) => ({
        id: t,
        label: tabNames[t],
        to: tabPath(patient.id, t),
        ...(t === "check_ins" && unread > 0 && { count: unread, countLabel: `${unread} unread ${unread === 1 ? "note" : "notes"}` }),
        ...(t === "check" && patient.attention.newSinceLastCheck && { dot: { tone: "amber" as const, label: "New information" } }),
      }))}
    />
  );
}