import { STATUS_STYLES } from "@/lib/colors";
import { fmtDate } from "@/lib/format";
import type { EmploymentStatus } from "@/lib/supabase/types";

type StatusChipProps = {
  status: EmploymentStatus;
  entryDate?: string | null; // shown as "Eintritt {date}" when status is Geplant
};

export function StatusChip({ status, entryDate }: StatusChipProps) {
  const label = status === "Geplant" && entryDate ? `Eintritt ${fmtDate(entryDate)}` : status;
  return (
    <span
      className={`inline-flex items-center whitespace-nowrap rounded-full px-2.5 py-0.5 text-xs font-semibold ${STATUS_STYLES[status]}`}
    >
      {label}
    </span>
  );
}