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

const statusStyles: Record<string, string> = {
  // Initiative statuses
  active: "bg-blue-100 text-blue-800 hover:bg-blue-100/80 border-blue-200",
  completed: "bg-green-100 text-green-800 hover:bg-green-100/80 border-green-200",
  archived: "bg-gray-100 text-gray-800 hover:bg-gray-100/80 border-gray-200",

  // Phase statuses
  pending: "bg-gray-100 text-gray-800 hover:bg-gray-100/80 border-gray-200",
  approved: "bg-amber-100 text-amber-800 hover:bg-amber-100/80 border-amber-200",
  in_progress: "bg-blue-100 text-blue-800 hover:bg-blue-100/80 border-blue-200",
  blocked: "bg-red-100 text-red-800 hover:bg-red-100/80 border-red-200",
};

const defaultStyle = "bg-gray-100 text-gray-800 hover:bg-gray-100/80 border-gray-200";

function formatStatusText(status: string): string {
  return status.replace(/_/g, " ").toUpperCase();
}

interface StatusBadgeProps {
  status: string;
  className?: string;
}

export function StatusBadge({ status, className }: StatusBadgeProps) {
  const style = statusStyles[status] ?? defaultStyle;

  return (
    <Badge className={cn(style, className)}>
      {formatStatusText(status)}
    </Badge>
  );
}