/**
 * InterviewStatusBadge Component
 * Color-coded status badges for interview bookings
 */

"use client";

import { InterviewStatus } from "@/lib/types/interview.types";

interface InterviewStatusBadgeProps {
  status: InterviewStatus;
  className?: string;
}

export default function InterviewStatusBadge({
  status,
  className = "",
}: InterviewStatusBadgeProps) {
  const statusConfig = {
    [InterviewStatus.PENDING]: {
      label: "Pending",
      classes: "bg-yellow-100 text-yellow-800 border-yellow-300",
      icon: "⏳",
    },
    [InterviewStatus.CONFIRMED]: {
      label: "Confirmed",
      classes: "bg-green-100 text-green-800 border-green-300",
      icon: "✓",
    },
    [InterviewStatus.RESCHEDULED]: {
      label: "Rescheduled",
      classes: "bg-blue-100 text-blue-800 border-blue-300",
      icon: "↻",
    },
    [InterviewStatus.CANCELLED]: {
      label: "Cancelled",
      classes: "bg-red-100 text-red-800 border-red-300",
      icon: "✕",
    },
    [InterviewStatus.COMPLETED]: {
      label: "Completed",
      classes: "bg-gray-100 text-gray-800 border-gray-300",
      icon: "✔",
    },
  };

  const config = statusConfig[status] || statusConfig[InterviewStatus.PENDING];

  return (
    <span
      className={`inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-xs font-semibold border ${config.classes} ${className}`}
    >
      <span>{config.icon}</span>
      <span>{config.label}</span>
    </span>
  );
}