import type { QueueKind } from "./patientQueue.ts";

/**
 * The queue row's TASK / MESSAGE / PAYMENT chip, drawn as the patient-portal deck draws it.
 * Provisional per Spencer: coloured text may replace the chip later; the treatment is this map and span.
 * The chip's 10px caps and per-kind hues are the deck's own and have no shared hook, so they live in PatientQueue.css.
 */
export const QUEUE_KIND_CHIP: Record<QueueKind, { label: string }> = {
  // A questionnaire is a Task on the deck too ("Health history questionnaire").
  form: { label: "Task" },
  message: { label: "Message" },
  payment: { label: "Payment" },
  appointment: { label: "Appointment" },
};

export const QueueKindChip = ({ kind }: { kind: QueueKind }) => {
  const { label } = QUEUE_KIND_CHIP[kind];
  return (
    <span className="ahr-kind-chip" data-kind={kind}>
      {label}
    </span>
  );
};