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

export type StatusType =
  | "completed"
  | "done"
  | "inProgress"
  | "in_progress"
  | "delayed"
  | "cancelled"
  | "notStarted"
  | "not_started"
  | "pending"
  | "planned"
  | "todo"
  | "review"
  | "underDevelopment";

export type StatusVariant = "default" | "outline";

interface StatusBadgeProps {
  status: StatusType | string;
  label: string;
  variant?: StatusVariant;
  className?: string;
}

/**
 * Get consistent color classes for status badges
 * Returns both filled (default) and outline variants
 */
function getStatusClasses(status: string, variant: StatusVariant = "default") {
  const normalizedStatus = status.toLowerCase().replace(/_/g, "");

  // Map status to color scheme with both default and outline variants
  const statusColorMap: Record<
    string,
    { default: string; outline: string }
  > = {
    // Completed states - Success
    completed: {
      default: "bg-tag-background-success-light text-tag-text-success border-tag-border-success-light",
      outline: "bg-transparent text-tag-text-success border-tag-text-success/50",
    },
    done: {
      default: "bg-tag-background-success-light text-tag-text-success border-tag-border-success-light",
      outline: "bg-transparent text-tag-text-success border-tag-text-success/50",
    },

    // In Progress states - Info
    inprogress: {
      default: "bg-tag-background-info-light text-tag-text-info border-tag-border-info-light",
      outline: "bg-transparent text-tag-text-info border-tag-text-info/50",
    },
    review: {
      default: "bg-tag-background-info-light text-tag-text-info border-tag-border-info-light",
      outline: "bg-transparent text-tag-text-info border-tag-text-info/50",
    },
    underdevelopment: {
      default: "bg-tag-background-info-light text-tag-text-info border-tag-border-info-light",
      outline: "bg-transparent text-tag-text-info border-tag-text-info/50",
    },

    // Delayed/Cancelled states - Destructive/Warning
    delayed: {
      default: "bg-tag-background-warning-light text-tag-text-warning border-tag-border-warning-light",
      outline: "bg-transparent text-tag-text-warning border-tag-text-warning/50",
    },
    cancelled: {
      default: "bg-tag-background-warning-light text-tag-text-warning border-tag-border-warning-light",
      outline: "bg-transparent text-tag-text-warning border-tag-text-warning/50",
    },

    // Not Started/Pending states - Neutral
    notstarted: {
      default: "bg-tag-background-neutral-light text-tag-text-neutral border-tag-border-neutral-light",
      outline: "bg-transparent text-tag-text-neutral border-tag-text-neutral/50",
    },
    pending: {
      default: "bg-tag-background-neutral-light text-tag-text-neutral border-tag-border-neutral-light",
      outline: "bg-transparent text-tag-text-neutral border-tag-text-neutral/50",
    },
    planned: {
      default: "bg-tag-background-neutral-light text-tag-text-neutral border-tag-border-neutral-light",
      outline: "bg-transparent text-tag-text-neutral border-tag-text-neutral/50",
    },
    todo: {
      default: "bg-tag-background-neutral-light text-tag-text-neutral border-tag-border-neutral-light",
      outline: "bg-transparent text-tag-text-neutral border-tag-text-neutral/50",
    },
  };

  const colors = statusColorMap[normalizedStatus] || {
    default: "bg-tag-background-neutral-light text-tag-text-neutral border-tag-border-neutral-light",
    outline: "bg-transparent text-tag-text-neutral border-tag-text-neutral/50",
  };

  return colors[variant];
}


export function StatusBadge({
  status,
  label,
  variant = "default",
  className,
}: StatusBadgeProps) {
  return (
    <Badge
      variant="outline"
      className={cn(
        "inline-flex items-center px-3 py-1 rounded-lg text-sm font-medium border whitespace-nowrap",
        getStatusClasses(status, variant),
        className
      )}
    >
      {label}
    </Badge>
  );
}