Karma Admin Console

import { AppShell, ColorSchemeScript, MantineProvider, mantineHtmlProps, } from "@mantine/core"; import "@mantine/core/styles.css"; import "@mantine/dates/styles.css"; import "mantine-react-table/styles.css"; import "@mantine/nprogress/styles.css"; import "@mantine/notifications/styles.css"; import "@mantine/dropzone/styles.css"; import { Links, Meta, Outlet, Scripts, ScrollRestoration, useNavigation } from "react-router"; import { Toaster } from "sonner"; import { theme } from "./lib/theme"; import "./root.css"; import { UserProvider } from "./providers/UserProvider"; import { ModalsProvider } from "@mantine/modals"; import { Notifications } from "@mantine/notifications"; import { NavigationProgress, nprogress } from "@mantine/nprogress"; import { useEffect, useRef } from "react"; const COMPLETE_DELAY_MS = 200; function GlobalLoader() { const navigation = useNavigation(); const completeTimer = useRef | null>(null); useEffect(() => { const isActive = navigation.state === "loading" || navigation.state === "submitting"; if (isActive) { if (completeTimer.current) { clearTimeout(completeTimer.current); completeTimer.current = null; } nprogress.start(); } else { completeTimer.current = setTimeout(() => { nprogress.complete(); completeTimer.current = null; }, COMPLETE_DELAY_MS); } return () => { if (completeTimer.current) { clearTimeout(completeTimer.current); completeTimer.current = null; } }; }, [navigation.state]); return ( ); } export function Layout({ children }: { children: React.ReactNode }) { return ( Karma Admin Console {children} ); } export default function Root() { return ; }