root.tsx•966 B
import {
data,
Links,
Meta,
Outlet,
Scripts,
ScrollRestoration,
useLoaderData,
} from "@remix-run/react";
import { ConvexProvider, ConvexReactClient } from "convex/react";
import { useState } from "react";
export async function loader() {
const CONVEX_URL = process.env["CONVEX_URL"]!;
return data({ ENV: { CONVEX_URL } });
}
export function Layout({ children }: { children: React.ReactNode }) {
const { ENV } = useLoaderData<typeof loader>();
const [convex] = useState(() => new ConvexReactClient(ENV.CONVEX_URL));
return (
<html lang="en">
<head>
<meta charSet="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<Meta />
<Links />
</head>
<body>
<ConvexProvider client={convex}>{children}</ConvexProvider>
<ScrollRestoration />
<Scripts />
</body>
</html>
);
}
export default function App() {
return <Outlet />;
}