import { Chip } from '@mui/material'
import { CheckCircle2, PauseCircle, AlertCircle, Clock, XCircle } from 'lucide-react'
import type { LucideIcon } from 'lucide-react'
import type { SourceStatus } from '../../domain/dataSource'
import { SOURCE_STATUS_LABELS, SOURCE_STATUS_COLORS } from '../../domain/dataSource'

const STATUS_ICONS: Record<SourceStatus, LucideIcon> = {
  ACTIVE: CheckCircle2,
  PAUSED: PauseCircle,
  ERROR: AlertCircle,
  PENDING_REVIEW: Clock,
  DISABLED: XCircle,
}

interface SourceHealthBadgeProps {
  status: SourceStatus
}

export function SourceHealthBadge({ status }: SourceHealthBadgeProps) {
  const Icon = STATUS_ICONS[status]
  const { bg, fg } = SOURCE_STATUS_COLORS[status]
  return (
    <Chip
      size="small"
      icon={<Icon size={11} color={fg} />}
      label={SOURCE_STATUS_LABELS[status]}
      sx={{
        bgcolor: bg,
        color: fg,
        border: 'none',
        fontSize: '0.7rem',
        fontWeight: 600,
        '& .MuiChip-icon': { ml: 0.75 },
      }}
    />
  )
}
