"use client";

import type { EnquiryStatus } from "@/types/enquiry";

const statusLabelMap: Record<EnquiryStatus, string> = {
  pending: "Pending",
  responded: "Responded",
};

const statusClassMap: Record<EnquiryStatus, { text: string; dot: string }> = {
  pending: {
    text: "text-[var(--color-amber)]",
    dot: "bg-[var(--color-amber-light)]",
  },
  responded: {
    text: "text-[var(--color-green)]",
    dot: "bg-[var(--color-green)]",
  },
};

export default function QuestionStatusBadge({ status }: { status: EnquiryStatus | string }) {
  const normalizedStatus = (status?.toLowerCase() || "pending") as EnquiryStatus;
  const label = statusLabelMap[normalizedStatus] || "Pending";
  const classes = statusClassMap[normalizedStatus] || statusClassMap.pending;

  return (
    <span className="flex items-center gap-1.5">
      <span className={`h-1.5 w-1.5 rounded-full ${classes.dot}`} />
      <span className={`whitespace-nowrap text-[13px] font-medium ${classes.text}`}>
        {label}
      </span>
    </span>
  );
}