Artifacts

"use client";

import { useEffect } from "react";
import { useRouter } from "next/navigation";

/**
 * Re-renders the current server component tree on an interval by calling
 * `router.refresh()`. This is how the Sessions pages stay live without a
 * websocket: every few seconds the server re-reads `session.json` and the page
 * reflects the latest status and runtime. Refreshing pauses while the tab is
 * hidden to avoid pointless work.
 */
export function AutoRefresh({ intervalMs = 5000 }: { intervalMs?: number }) {
  const router = useRouter();

  useEffect(() => {
    const tick = () => {
      if (typeof document !== "undefined" && document.hidden) return;
      router.refresh();
    };
    const t = setInterval(tick, intervalMs);
    return () => clearInterval(t);
  }, [router, intervalMs]);

  return null;
}