// components/admin/DashboardAutoRefresh.tsx
// Refreshes the server-rendered dashboard on an interval (admin.md section 2.1:
// read tiles refresh every 20 to 30 seconds rather than per-event streaming, to
// keep the admin off the hot write path). Uses router.refresh() so the server
// components re-query cached aggregates. Pauses when the tab is hidden and
// respects prefers-reduced-motion by never animating (it only re-fetches).

"use client";

import * as React from "react";
import { useRouter } from "next/navigation";

export function DashboardAutoRefresh({ seconds = 25 }: { seconds?: number }) {
  const router = useRouter();

  React.useEffect(() => {
    const ms = Math.max(10, seconds) * 1000;
    let timer: ReturnType<typeof setInterval> | null = null;

    function start() {
      if (timer) return;
      timer = setInterval(() => {
        if (document.visibilityState === "visible") {
          router.refresh();
        }
      }, ms);
    }
    function stop() {
      if (timer) {
        clearInterval(timer);
        timer = null;
      }
    }

    start();
    document.addEventListener("visibilitychange", () => {
      if (document.visibilityState === "visible") {
        router.refresh();
        start();
      } else {
        stop();
      }
    });

    return stop;
  }, [router, seconds]);

  return null;
}