import type { NoteKind } from "../../api/types";
import { cn, Icon, type IconName } from "../kit";

// Literal strings so Tailwind finds every class.
const kinds: Record<NoteKind, { icon: IconName; tile: string }> = {
  symptom: { icon: "thermometer-line", tile: "bg-amber-fill text-amber-icon" },
  how_taken: { icon: "capsule-line", tile: "bg-blue-fill text-blue-icon" },
  not_started: { icon: "pause-circle-line", tile: "bg-grey-fill text-grey-icon" },
  side_effect: { icon: "drop-line", tile: "bg-pink-fill text-pink-icon" },
  allergy_history: { icon: "alarm-warning-line", tile: "bg-red-fill text-red-icon" },
  other_medicines: { icon: "medicine-bottle-line", tile: "bg-green-fill text-green-icon" },
  measurement: { icon: "pulse-line", tile: "bg-indigo-fill text-indigo-icon" },
  patient_question: { icon: "question-line", tile: "bg-blue-fill text-blue-icon" },
  red_flag: { icon: "alarm-warning-fill", tile: "bg-red-icon text-white" },
  not_understood: { icon: "translate-2", tile: "bg-purple-fill text-purple-icon" },
};
const other = { icon: "flask-line" as IconName, tile: "bg-grey-fill text-grey-icon" };

/** YCI-24: one icon per note kind, in a small tile tinted by what kind of note it is. */
export function NoteIcon({ kind, className }: { kind: NoteKind; className?: string }) {
  const k = kinds[kind] ?? other;
  return (
    <span aria-hidden="true" className={cn("flex size-7 shrink-0 items-center justify-center rounded-lg", k.tile, className)}>
      <Icon name={k.icon} size={16} />
    </span>
  );
}