import React from 'react';

export type StatusVariant =
  | 'online' | 'offline' | 'degraded' | 'maintenance' |'confirmed' | 'processing' | 'kitchen' | 'ready' | 'delivered' | 'completed' | 'cancelled' | 'failed'
  | 'active' | 'resolved' | 'escalated' | 'abandoned' | 'rider'
  | 'seated' | 'noshow' | 'pending' | 'reminder_sent';

interface StatusBadgeProps {
  status: StatusVariant | string;
  size?: 'sm' | 'md';
  dot?: boolean;
}

const statusConfig: Record<string, { label: string; className: string }> = {
  online: { label: 'Online', className: 'badge badge-success' },
  offline: { label: 'Offline', className: 'badge badge-danger' },
  degraded: { label: 'Degraded', className: 'badge badge-warning' },
  maintenance: { label: 'Maintenance', className: 'badge badge-neutral' },
  confirmed: { label: 'Confirmed', className: 'badge badge-success' },
  processing: { label: 'AI Processing', className: 'badge badge-info' },
  kitchen: { label: 'In Kitchen', className: 'badge badge-warning' },
  ready: { label: 'Ready', className: 'badge badge-primary' },
  rider: { label: 'With Rider', className: 'badge badge-info' },
  delivered: { label: 'Delivered', className: 'badge badge-success' },
  completed: { label: 'Completed', className: 'badge badge-success' },
  cancelled: { label: 'Cancelled', className: 'badge badge-neutral' },
  failed: { label: 'Failed', className: 'badge badge-danger' },
  active: { label: 'Active', className: 'badge badge-info' },
  resolved: { label: 'Resolved', className: 'badge badge-success' },
  escalated: { label: 'Escalated', className: 'badge badge-danger' },
  abandoned: { label: 'Abandoned', className: 'badge badge-neutral' },
  seated: { label: 'Seated', className: 'badge badge-success' },
  noshow: { label: 'No Show', className: 'badge badge-danger' },
  pending: { label: 'Pending', className: 'badge badge-warning' },
  reminder_sent: { label: 'Reminder Sent', className: 'badge badge-info' },
};

const dotColors: Record<string, string> = {
  online: 'bg-success',
  offline: 'bg-danger',
  degraded: 'bg-warning',
  confirmed: 'bg-success',
  processing: 'bg-info',
  kitchen: 'bg-warning',
  ready: 'bg-primary-500',
  rider: 'bg-info',
  completed: 'bg-success',
  cancelled: 'bg-muted-foreground',
  failed: 'bg-danger',
  active: 'bg-info',
  resolved: 'bg-success',
  escalated: 'bg-danger',
  seated: 'bg-success',
  noshow: 'bg-danger',
  pending: 'bg-warning',
};

export default function StatusBadge({ status, size = 'md', dot = false }: StatusBadgeProps) {
  const config = statusConfig[status] || { label: status, className: 'badge badge-neutral' };
  const sizeClass = size === 'sm' ? 'text-[10px] px-2 py-0.5' : '';

  return (
    <span className={`${config.className} ${sizeClass} whitespace-nowrap`}>
      {dot && (
        <span
          className={`w-1.5 h-1.5 rounded-full ${dotColors[status] || 'bg-current'}`}
          style={{ display: 'inline-block' }}
        />
      )}
      {config.label}
    </span>
  );
}