function Layout()

in src/main/js/routes/layout/layout.js [18:57]

• 26 lines of code
• 4 McCabe index (conditional complexity)

function Layout() {
    const loaderData = useLoaderData();
    const revalidator = useRevalidator();
    const [searchParams, setSearchParams] = useSearchParams();
    // refresh interval state
    const refreshIconClass = "fas fa-sync-alt"
    const [refreshInterval, setRefreshInterval] = useState(-1);
    const [refreshIcon, setRefreshIcon] = useState(refreshIconClass);

    // Code below sets the expected effects once refreshes changes
    useEffect(() => {
        // only schedule refreshes if interval is bigger than 0
        if (refreshInterval > 0) {
            const interval = setInterval(() => {
                if (document.visibilityState === "visible") {
                    revalidator.revalidate();
                }
            }, refreshInterval);
            return () => clearInterval(interval);
        }
    }, [refreshInterval]);

    useEffect(() => {
        if (revalidator.state === "idle") {
            setRefreshIcon(refreshIconClass)
        } else {
            setRefreshIcon(refreshIconClass + " fa-spin text-yellow-400")
        }
    }, [revalidator.state]);

    function hostName() {
        let hostName = ""
        try {
            hostName = new URL(searchParams.get("config_host")).hostname
        } catch {}
        return hostName;
    }

    return (<>
        <Suspense fallback={<Loading/>}>