/**
 * ProposalCountdownBadge — urgency badge for proposal expiry.
 * proposal-expiry-deadline (wave-12).
 *
 * Renders nothing (null) for variant='none'.
 * Uses --warning / --danger OKLCH tokens; no hardcoded colors.
 * Honours prefers-reduced-motion (no animated spin on ⏳ glyph).
 */
import * as React from 'react'
import { proposalCountdown } from '../proposal-countdown'
import { Badge } from '../primitives/badge'
import { formatDate } from '../lib/format-date'
import type { StoredLocale } from '../lib/locale'
import { toFormattingLocale } from '../lib/locale'

export interface ProposalCountdownBadgeProps {
  expiresAt: string | null
  status: string
  locale?: StoredLocale
}

export function ProposalCountdownBadge({
  expiresAt,
  status,
  locale = 'he',
}: ProposalCountdownBadgeProps): React.JSX.Element | null {
  const countdown = proposalCountdown(expiresAt, new Date(), status)
  const fmtLocale = toFormattingLocale(locale)

  if (countdown.variant === 'none') return null

  if (countdown.variant === 'expired') {
    const dateLabel = expiresAt ? formatDate(new Date(expiresAt), fmtLocale) : ''
    return (
      <Badge
        variant="secondary"
        aria-label={`Proposal expired on ${dateLabel}`}
      >
        ✗ {dateLabel}
      </Badge>
    )
  }

  if (countdown.variant === 'today') {
    return (
      <div
        role="status"
        className="inline-flex items-center gap-2 rounded px-2 py-1 text-body-2 font-medium text-danger border border-danger bg-surface"
        aria-label="Proposal expires today"
      >
        ⏳ Expires today
      </div>
    )
  }

  // amber (3–7 days) or red (1–2 days)
  const days = countdown.daysRemaining!
  const dateLabel = expiresAt ? formatDate(new Date(expiresAt), fmtLocale) : ''
  const variant = countdown.variant === 'red' ? 'error' : 'warning'
  const label = `Expires in ${days} day${days === 1 ? '' : 's'} (${dateLabel})`

  return (
    <Badge
      variant={variant}
      aria-label={`Proposal expires in ${days} day${days === 1 ? '' : 's'}`}
    >
      ⏳ {label}
    </Badge>
  )
}