hurkicorgi
359a12ef9d
- New /api/events SSE endpoint (authed): pushes status every 5s and chat
on log-file mtime change (~1.5s poll). Heartbeat every 15s, hard-caps
each stream at 10min so the browser gets a clean auth refresh on
reconnect. Auto-aborts on client disconnect.
- Factored shared helpers out of the existing routes:
- lib/server-status.ts (probeStatus, reused by /api/status + SSE)
- lib/chat-log.ts (parseLogLine, readChatMessages, logMtime, reused by
/api/chat + SSE)
- EventsBridge client (mounted in Providers) opens one EventSource per
authed session and writes live data into the TanStack Query cache for
["status"] and ["chat"] — no refactor needed in consuming components,
they keep reading their usual query keys.
- Now that SSE pushes updates, polling intervals bumped: StatusCard and
ServerControls 10s -> 60s, ChatBridge 5s -> 30s. SSE handles realtime,
polling is safety fallback.
- OfflineBanner: sticky amber bar when navigator.onLine flips false.
- PWA: minimal public/sw.js with shell + asset cache (network-first for
HTML, stale-while-revalidate for static assets, never touches /api/*
or text/event-stream). ServiceWorkerRegister client registers it in
production only.
- AdminTabs now uses next/dynamic with skeleton fallbacks for Players /
Chat / Mods / Backups / Logs, keeping initial /admin bundle smaller.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
55 lines
1.6 KiB
TypeScript
55 lines
1.6 KiB
TypeScript
"use client";
|
|
|
|
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
|
import { SessionProvider } from "next-auth/react";
|
|
import { Toaster } from "sonner";
|
|
import { useEffect, useState } from "react";
|
|
import { CommandPalette } from "@/components/CommandPalette";
|
|
import { PlayerDrawer } from "@/components/PlayerDrawer";
|
|
import { EventsBridge } from "@/components/EventsBridge";
|
|
import { OfflineBanner } from "@/components/OfflineBanner";
|
|
import { ServiceWorkerRegister } from "@/components/ServiceWorkerRegister";
|
|
|
|
export function Providers({ children }: { children: React.ReactNode }) {
|
|
const [queryClient] = useState(
|
|
() =>
|
|
new QueryClient({
|
|
defaultOptions: {
|
|
queries: {
|
|
refetchOnWindowFocus: false,
|
|
},
|
|
},
|
|
})
|
|
);
|
|
|
|
const [theme, setTheme] = useState<"light" | "dark">("dark");
|
|
useEffect(() => {
|
|
const sync = () => {
|
|
setTheme(document.documentElement.classList.contains("dark") ? "dark" : "light");
|
|
};
|
|
sync();
|
|
const obs = new MutationObserver(sync);
|
|
obs.observe(document.documentElement, { attributes: true, attributeFilter: ["class"] });
|
|
return () => obs.disconnect();
|
|
}, []);
|
|
|
|
return (
|
|
<SessionProvider>
|
|
<QueryClientProvider client={queryClient}>
|
|
<EventsBridge />
|
|
<ServiceWorkerRegister />
|
|
<OfflineBanner />
|
|
{children}
|
|
<CommandPalette />
|
|
<PlayerDrawer />
|
|
<Toaster
|
|
theme={theme}
|
|
position="bottom-right"
|
|
richColors
|
|
closeButton
|
|
toastOptions={{ duration: 4000 }}
|
|
/>
|
|
</QueryClientProvider>
|
|
</SessionProvider>
|
|
);
|
|
}
|