import { formatCountdown } from '../../hooks/useCountdown'

interface CountdownTimerProps {
  secondsLeft: number | null
}

export function CountdownTimer({ secondsLeft }: CountdownTimerProps) {
  if (secondsLeft === null) {
    return (
      <p className="text-sm text-muted">
        Pilih status untuk memberi tahu guru. Status akan direset setelah 5 menit.
      </p>
    )
  }

  return (
    <p className="text-sm text-body">
      Status direset dalam{' '}
      <span className="font-mono font-semibold text-ink">{formatCountdown(secondsLeft)}</span>
    </p>
  )
}