import { useRegisterSW } from "virtual:pwa-register/react";

/**
 * UpdatePrompt — aviso de nova versão disponível, estilo Spotify.
 *
 * ADR-007: nunca atualiza sozinho — só troca de versão quando o usuário
 * confirma, porque um reload automático interromperia a reprodução de áudio.
 */
export default function UpdatePrompt() {
  const { needRefresh: [needRefresh], updateServiceWorker } = useRegisterSW({
    onRegisteredSW(swUrl, registration) {
      // Verifica se há uma versão nova a cada 60 minutos, sem forçar nada.
      if (registration) {
        setInterval(() => {
          registration.update();
        }, 60 * 60 * 1000);
      }
    },
  });

  if (!needRefresh) return null;

  return (
    <div
      className="
        fixed
        bottom-20
        lg:bottom-6
        left-1/2
        -translate-x-1/2
        z-50
        w-[calc(100%-2rem)]
        max-w-sm
        rounded-2xl
        border
        border-white/10
        bg-sof-borgonha-light
        px-5
        py-4
        shadow-2xl
        flex
        items-center
        justify-between
        gap-4
      "
      role="status"
    >
      <p className="text-sm font-medium text-sof-text">Nova versão disponível</p>
      <button
        onClick={() => updateServiceWorker(true)}
        className="rounded-full bg-sof-gold px-4 py-1.5 text-sm font-bold text-sof-borgonha hover:bg-sof-gold-light transition-colors flex-shrink-0"
      >
        Atualizar
      </button>
    </div>
  );
}
