import { Links, LiveReload, Meta, Outlet, Scripts, ScrollRestoration, useLoaderData } from "@remix-run/react"; import { json, type LinksFunction, type LoaderFunctionArgs } from "@remix-run/node"; import clsx from "clsx"; import { PreventFlashOnWrongTheme, ThemeProvider, useTheme } from "remix-themes"; import { getUserSession, themeSessionResolver } from "./sessions.server"; import { ProgressProvider } from "@bprogress/remix"; import "./tailwind.css"; export const links: LinksFunction = () => [ { rel: "preconnect", href: "https://fonts.googleapis.com" }, { rel: "preconnect", href: "https://fonts.gstatic.com", crossOrigin: "anonymous" }, { rel: "stylesheet", href: "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap" }, { rel: "stylesheet", href: "https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" } ]; export async function loader({ request }: LoaderFunctionArgs) { const { getTheme } = await themeSessionResolver(request); const userSession = await getUserSession(request); const sessionData = userSession ? { accessToken: userSession.accessToken, refreshToken: userSession.refreshToken, sessionId: userSession.sessionId, role: userSession.role, deviceId: userSession.deviceId, email: userSession.email, phone: userSession.phone, tokenType: userSession.tokenType, registrationStatus: userSession.registrationStatus, nextStep: userSession.nextStep } : null; return json({ sessionData, theme: getTheme() }); } export default function AppWithProviders() { const data = useLoaderData(); return ( ); } export function App() { const data = useLoaderData(); const [theme] = useTheme(); return (

' }} > ); }