import { CheckCircle, AlertCircle, Clock, X, AlertTriangle, Briefcase, Stethoscope, Timer, PartyPopper } from 'lucide-react'

/**
 * Reusable status badge for attendance records.
 * Renders one badge per status dimension (abnormal / late / early / OT / leave).
 *
 * Props:
 *   - code: status_code string (used for row-coloring and fallback)
 *   - late: late_minutes number
 *   - early: early_minutes number
 *   - ot: ot_minutes number
 *   - size: 'sm' | 'md' (default 'sm')
 */
export default function StatusBadge({ code, late = 0, early = 0, ot = 0, size = 'sm' }) {
  const sizeCls = size === 'md'
    ? 'px-3 py-1 text-sm'
    : 'px-2 py-0.5 text-xs'

  const badge = (icon, label, colorCls) => (
    <span className={`inline-flex items-center gap-1 ${sizeCls} rounded-full font-medium ${colorCls}`}>
      {icon}
      {label}
    </span>
  )

  const parts = []

  // Abnormal (any dimension > 30 min)
  if (late > 30 || early > 30 || ot > 30) {
    if (late > 30) parts.push(badge(<AlertTriangle size={12} />, `異常-遲到${late}分`, 'bg-red-100 text-red-700'))
    else if (early > 30) parts.push(badge(<AlertTriangle size={12} />, `異常-早退${early}分`, 'bg-red-100 text-red-700'))
    else parts.push(badge(<AlertTriangle size={12} />, `異常-OT${ot}分`, 'bg-red-100 text-red-700'))
  } else {
    // Individual badges (≤ 30 min each)
    if (late > 0) parts.push(badge(<AlertCircle size={12} />, `遲到${late}分`, 'bg-orange-100 text-orange-700'))
    if (early > 0) parts.push(badge(<Clock size={12} />, `早退${early}分`, 'bg-blue-100 text-blue-700'))
    if (ot > 0) parts.push(badge(<Clock size={12} />, `OT${ot}分`, 'bg-purple-100 text-purple-700'))
  }

  if (parts.length === 0) {
    return badge(<CheckCircle size={12} />, '正常', 'bg-green-100 text-green-700')
  }

  return <span className="inline-flex items-center gap-1 flex-wrap">{parts}</span>
}