import { Badge } from "@/components/ui/badge";

type Status = "online" | "starting" | "offline";

const config = {
  online: {
    label: "Online",
    className: "border-emerald-500/30 bg-emerald-500/10 text-emerald-300",
    dot: "bg-emerald-400 shadow-[0_0_6px_var(--color-emerald-400)]",
    pulse: false,
  },
  starting: {
    label: "Starting",
    className: "border-amber-500/30 bg-amber-500/10 text-amber-300",
    dot: "bg-amber-400",
    pulse: true,
  },
  offline: {
    label: "Offline",
    className: "border-red-500/30 bg-red-500/10 text-red-300",
    dot: "bg-red-400",
    pulse: false,
  },
} as const;

export function StatusBadge({ status }: { status: Status }) {
  const c = config[status];
  return (
    <Badge variant="outline" className={`gap-1.5 ${c.className}`}>
      <span className={`h-1.5 w-1.5 rounded-full ${c.dot} ${c.pulse ? "animate-pulse" : ""}`} />
      {c.label}
    </Badge>
  );
}

export function statusFromServer(s: { online: boolean; starting?: boolean }): Status {
  if (s.online) return "online";
  if (s.starting) return "starting";
  return "offline";
}