import type { LinksFunction } from "@remix-run/node"; import { Links, Meta, Outlet, Scripts, ScrollRestoration, isRouteErrorResponse, useRouteError } from "@remix-run/react"; import React, { useEffect, useState, type PropsWithChildren } from "react"; import stylesheet from "bootstrap/dist/css/bootstrap.min.css?url"; export const links: LinksFunction = () => [ { rel: "stylesheet", href: stylesheet }, ]; import { Col, Container, Row } from "react-bootstrap"; function Document({ children, title = "K-FRIDGE", }: PropsWithChildren<{ title?: string}>) { return ( {children} ); } export default function App() { return ( ); } export function ErrorBoundary() { const error = useRouteError(); const [isOnline, setIsOnline] = useState( typeof navigator !== "undefined" ? navigator.onLine : true ); const tryRefresh = async () => { if (typeof window === "undefined") return; try { const res = await fetch(window.location.href, { method: "GET", cache: "no-store" }); if (res && res.ok) { window.location.reload(); } } catch (e) { // network still down; ignore, we'll retry on the next interval or when online } }; useEffect(() => { if (typeof window === "undefined") return; const handleOnline = () => { setIsOnline(true); tryRefresh(); }; const handleOffline = () => setIsOnline(false); window.addEventListener("online", handleOnline); window.addEventListener("offline", handleOffline); const hourly = window.setInterval(() => { tryRefresh(); }, 60 * 60 * 1000); return () => { window.removeEventListener("online", handleOnline); window.removeEventListener("offline", handleOffline); window.clearInterval(hourly); }; }, []); if (isRouteErrorResponse(error)) { return (

{error.status}

{error.statusText}

Status: {isOnline ? "Online" : "Offline"}. Will retry automatically every hour.

); } const errorMessage = error instanceof Error ? error.message : "Unknown error"; return (

App Error

{errorMessage}

Status: {isOnline ? "Online" : "Offline"}. Will retry automatically every hour.

); }