tabletop-commander/app/layout.tsx
2024-09-08 06:43:39 -06:00

62 lines
2.1 KiB
TypeScript

import type { Metadata } from "next";
import { Roboto } from "next/font/google";
import "./globals.css";
import Link from "next/link";
import { DevToolboxContextProvider } from "@/components/devtools/context";
import { RecoilRootClient } from "@/components/recoilRoot";
import { JotaiProvider } from "@/components/jotaiProvider";
import { Toaster } from "@/components/toast";
import { SessionProvider } from "next-auth/react";
import { User } from "@/components/user/index";
import { getCurrentGameSystem } from "@/actions/GameSystems";
import { Nav } from "@/components/nav";
import { SSE } from "@/components/sse";
import { auth } from "@/auth";
const roboto = Roboto({ subsets: ["latin"], weight: "400" });
export const metadata: Metadata = {
title: "Tabletop Commander",
description: "Rules and tools for tabletop games!",
};
export default async function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
const currentGame = await getCurrentGameSystem();
return (
<html lang="en">
<SessionProvider>
<body className={roboto.className + " flex min-h-[100vh]"}>
<nav className="h-[100vh] sticky top-0 left-0 bottom-0 p-8 rounded-r-3xl dark:bg-mixed-300 bg-primary-400 w-max shadow-2xl">
<div className="flex flex-col h-full">
<h1 className="text-lg font-bold pb-6 border-b dark:border-dark-500 border-primary-600">
<Link href="/">Tabletop Commander</Link>
</h1>
<Nav game={currentGame ?? undefined} />
<div className="mt-auto">
<User />
</div>
</div>
</nav>
<RecoilRootClient>
<JotaiProvider>
<DevToolboxContextProvider
isDev={process.env.NODE_ENV !== "production"}
>
<main className="p-8 w-full overflow-visible">{children}</main>
<Toaster />
</DevToolboxContextProvider>
</JotaiProvider>
</RecoilRootClient>
<div id="root-portal"></div>
</body>
</SessionProvider>
<SSE />
</html>
);
}