"use client"

import { ticketStatusSchema, type TicketStatus } from "@/lib/schemas/ticket"
import { Badge } from "@/components/ui/badge"
import { cn } from "@/lib/utils"

const statusStyles: Record<TicketStatus, { label: string; className: string }> = {
  PENDING: { label: "Pendente", className: "border border-slate-200 bg-slate-100 text-slate-700" },
  AWAITING_ATTENDANCE: { label: "Em andamento", className: "border border-slate-200 bg-[#dff1fb] text-[#0a4760]" },
  PAUSED: { label: "Pausado", className: "border border-slate-200 bg-[#fff3c4] text-[#7a5901]" },
  RESOLVED: { label: "Resolvido", className: "border border-slate-200 bg-[#dcf4eb] text-[#1f6a45]" },
}

type TicketStatusBadgeProps = { status: TicketStatus; className?: string }

export function TicketStatusBadge({ status, className }: TicketStatusBadgeProps) {
  const parsed = ticketStatusSchema.parse(status)
  const styles = statusStyles[parsed]
  return (
    <Badge className={cn("inline-flex h-9 items-center gap-2 rounded-full px-3 text-sm font-semibold", styles?.className, className)}>
      {styles?.label ?? parsed}
    </Badge>
  )
}
