export const PROFICIENCY_LABELS = ["", "Aware", "Basic", "Intermediate", "Advanced", "Expert"];

export const PROFICIENCY_CLASSES = [
  "bg-gray-100 text-gray-700 border-gray-300 dark:bg-gray-700 dark:text-gray-200 dark:border-gray-500",
  "bg-blue-100 text-blue-800 border-blue-300 dark:bg-blue-900/60 dark:text-blue-200 dark:border-blue-600",
  "bg-indigo-100 text-indigo-800 border-indigo-300 dark:bg-indigo-900/60 dark:text-indigo-200 dark:border-indigo-500",
  "bg-amber-100 text-amber-800 border-amber-300 dark:bg-amber-900/60 dark:text-amber-200 dark:border-amber-500",
  "bg-green-100 text-green-800 border-green-300 dark:bg-green-900/60 dark:text-green-200 dark:border-green-500",
];

export function proficiencyClasses(level: number): string {
  const idx = Math.max(0, Math.min(4, Math.round(level) - 1));
  return PROFICIENCY_CLASSES[idx] ?? PROFICIENCY_CLASSES[0]!;
}

export function ProficiencyBadge({ value }: { value: number }) {
  return (
    <span className={`inline-block px-2 py-0.5 text-xs rounded font-medium border ${proficiencyClasses(value)}`}>
      {value} {PROFICIENCY_LABELS[value] ?? ""}
    </span>
  );
}

export function GapIndicator({ gap }: { gap: number }) {
  if (gap > 0) {
    return (
      <span className="inline-flex items-center gap-1 px-2 py-0.5 text-xs rounded font-semibold bg-red-100 text-red-700 border border-red-200 dark:bg-red-900/40 dark:text-red-300 dark:border-red-700">
        -{gap} shortage
      </span>
    );
  }
  if (gap < 0) {
    return (
      <span className="inline-flex items-center gap-1 px-2 py-0.5 text-xs rounded font-semibold bg-green-100 text-green-700 border border-green-200 dark:bg-green-900/40 dark:text-green-300 dark:border-green-700">
        +{Math.abs(gap)} surplus
      </span>
    );
  }
  return (
    <span className="inline-flex items-center gap-1 px-2 py-0.5 text-xs rounded font-semibold bg-gray-100 text-gray-500 border border-gray-200 dark:bg-gray-700 dark:text-gray-300 dark:border-gray-600">
      balanced
    </span>
  );
}

export function formatDate(iso: string | null): string {
  if (!iso) return "Not within 30d";
  const d = new Date(iso);
  return d.toLocaleDateString("en-GB", { day: "2-digit", month: "short", year: "numeric" });
}
