import type { ReservationStatus } from "@/lib/reservation-status";
import type { TableStatus } from "@/lib/reservation-status";
import { RESERVATION_STATUS_LABELS } from "@/lib/reservation-status";
import { cn } from "@/lib/utils";

const TABLE_STYLES: Record<TableStatus, string> = {
  available: "bg-emerald-500/15 text-emerald-700 border-emerald-200",
  reserved: "bg-amber-500/15 text-amber-800 border-amber-200",
  occupied: "bg-red-500/15 text-red-700 border-red-200",
};

const TABLE_LABELS: Record<TableStatus, string> = {
  available: "Available",
  reserved: "Reserved",
  occupied: "Occupied",
};

const ARRIVAL_STYLES: Partial<Record<ReservationStatus, string>> = {
  pending: "bg-zinc-500/15 text-zinc-700 border-zinc-200",
  confirmed: "bg-blue-500/15 text-blue-700 border-blue-200",
  reserved: "bg-amber-500/15 text-amber-800 border-amber-200",
  arrived: "bg-sky-500/15 text-sky-700 border-sky-200",
  occupied: "bg-red-500/15 text-red-700 border-red-200",
  completed: "bg-zinc-500/15 text-zinc-600 border-zinc-200",
  cancelled: "bg-zinc-500/15 text-zinc-500 border-zinc-200 line-through",
  no_show: "bg-zinc-500/15 text-zinc-500 border-zinc-200",
};

export function TableStatusBadge({ status }: { status: TableStatus }) {
  return (
    <span className={cn("rounded-md border px-2 py-0.5 text-xs font-semibold", TABLE_STYLES[status])}>
      {TABLE_LABELS[status]}
    </span>
  );
}

export function ArrivalStatusBadge({ status }: { status: ReservationStatus }) {
  return (
    <span
      className={cn(
        "rounded-md border px-2 py-0.5 text-xs font-semibold",
        ARRIVAL_STYLES[status] ?? "bg-muted text-muted-foreground",
      )}
    >
      {RESERVATION_STATUS_LABELS[status]}
    </span>
  );
}

export function tableBorderClass(status: TableStatus): string {
  switch (status) {
    case "available":
      return "border-emerald-400/60 bg-emerald-50/50 dark:bg-emerald-950/20";
    case "reserved":
      return "border-amber-400/60 bg-amber-50/50 dark:bg-amber-950/20";
    case "occupied":
      return "border-red-400/60 bg-red-50/50 dark:bg-red-950/20";
  }
}
