import { useChatStatus, type DerivedStatus } from '@/hooks/useChatStatus';
import { cn } from '@/lib/utils';

interface Props {
  chatId: string | null | undefined;
  className?: string;
}

const STATUS_CLASS: Record<DerivedStatus, string> = {
  working: 'bg-amber-500 animate-pulse',
  idle_warm: 'bg-emerald-500',
  idle_cold: 'bg-muted-foreground/40',
  error: 'bg-destructive',
};

const STATUS_LABEL: Record<DerivedStatus, string> = {
  working: 'working',
  idle_warm: 'idle',
  idle_cold: 'idle',
  error: 'error',
};

export function StatusDot({ chatId, className }: Props) {
  const status = useChatStatus(chatId);
  return (
    <span
      aria-label={`Status: ${STATUS_LABEL[status]}`}
      title={STATUS_LABEL[status]}
      className={cn(
        'inline-block w-1.5 h-1.5 rounded-full shrink-0',
        STATUS_CLASS[status],
        className,
      )}
    />
  );
}