'use client'

import { useEffect } from 'react'
import { useRouter } from 'next/navigation'

// Escucha el stream del evento y refresca los datos del servidor (agrupando ráfagas).
export default function LiveRefresh({ eventId }: { eventId: string }) {
  const router = useRouter()
  useEffect(() => {
    let t: ReturnType<typeof setTimeout> | undefined
    const es = new EventSource(`/api/stream/${eventId}`)
    es.onmessage = () => { clearTimeout(t); t = setTimeout(() => router.refresh(), 800) }
    return () => { clearTimeout(t); es.close() }
  }, [eventId, router])
  return (
    <span className="chip bg-green-50 text-green-700"><span className="h-2 w-2 animate-pulse-ring rounded-full bg-live" />En vivo</span>
  )
}