@tropic prawn ```tsx
import type { Metadata } from "next";
import localFont from "next/font/local";
import "./globals.css";
import Header from "./ui/Header";
import Footer from "./components/Footer";
import { auth } from "@/auth";
import { SessionProvider } from "next-auth/react";
import { Toaster } from "@/components/ui/sonner";
import { CartProvider } from "./lib/context/CartContext";
import "@radix-ui/themes/styles.css";
import { Theme } from "@radix-ui/themes";
const geistSans = localFont({
src: "./fonts/GeistVF.woff",
variable: "--font-geist-sans",
weight: "100 900",
});
const geistMono = localFont({
src: "./fonts/GeistMonoVF.woff",
variable: "--font-geist-mono",
weight: "100 900",
});
export const metadata: Metadata = {
title: "My App",
description: "Generated by create next app",
};
export default async function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
const session = await auth();
return (
<SessionProvider session={session}>
<html lang="en">
<head>
<link
href="https://fonts.googleapis.com/css2?family=Anton&family=Lilita+One&family=Matemasie&display=swap"
rel="stylesheet"></link>
</head>
<body
className={${geistSans.variable} ${geistMono.variable} antialiased}>
<Theme>
<CartProvider>
<Toaster />
<Header session={session} />
<div className="max-w-7xl mx-auto">{children}</div>
<Footer />
</CartProvider>
</Theme>
</body>
</html>
</SessionProvider>
);
}