import type { ReactNode } from "react";
import type { TargetStatus } from "@/lib/keywords/targets";
import { cn } from "@/lib/utils";

const META: Record<TargetStatus, { label: string; className: string }> = {
  candidate: {
    label: "candidat",
    className: "border border-border bg-transparent text-foreground",
  },
  planned: {
    label: "planifié",
    className: "bg-primary text-primary-foreground",
  },
  live: { label: "en ligne", className: "bg-emerald-600 text-white" },
};

export function TargetStatusBadge({
  status,
  prefix,
}: {
  status: TargetStatus;
  /** optional leading node, e.g. a <Flag> in the list "Pays ciblés" cell */
  prefix?: ReactNode;
}) {
  const m = META[status];
  return (
    <span
      className={cn(
        "inline-flex items-center gap-1 rounded-md px-1.5 py-0.5 text-xs font-medium",
        m.className,
      )}
    >
      {prefix ? <span aria-hidden>{prefix}</span> : null}
      {m.label}
    </span>
  );
}