convex-monorepo/apps/next/src/app/layout.tsx

import type { Metadata, Viewport } from 'next';
import { Geist, Geist_Mono } from 'next/font/google';
import { env } from '@/env';

import '@/app/styles.css';

import Footer from '@/components/layout/footer';
import Header from '@/components/layout/header';
import { ConvexClientProvider } from '@/components/providers';
import { generateMetadata } from '@/lib/metadata';
import { ConvexAuthNextjsServerProvider } from '@convex-dev/auth/nextjs/server';
import PlausibleProvider from 'next-plausible';

import { ThemeProvider, Toaster } from '@gib/ui';

export const metadata: Metadata = generateMetadata();

export const viewport: Viewport = {
  themeColor: [
    { media: '(prefers-color-scheme: light)', color: 'white' },
    { media: '(prefers-color-scheme: dark)', color: 'black' },
  ],
};

const geistSans = Geist({
  subsets: ['latin'],
  variable: '--font-geist-sans',
});
const geistMono = Geist_Mono({
  subsets: ['latin'],
  variable: '--font-geist-mono',
});

const RootLayout = ({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) => {
  const app = (
    <ThemeProvider
      attribute='class'
      defaultTheme='system'
      enableSystem
      disableTransitionOnChange
    >
      <ConvexClientProvider>
        <div className='flex min-h-screen flex-col'>
          <Header />
          {children}
          <Footer />
        </div>
        <Toaster />
      </ConvexClientProvider>
    </ThemeProvider>
  );
  return (
    <ConvexAuthNextjsServerProvider>
      <html lang='en' suppressHydrationWarning>
        <body
          className={`${geistSans.variable} ${geistMono.variable} antialiased`}
        >
          {/* Plausible loads its per-site script through the same-origin
              proxy in next.config.js; without that config it stays off. */}
          {env.NEXT_PUBLIC_PLAUSIBLE_SRC ? (
            <PlausibleProvider>{app}</PlausibleProvider>
          ) : (
            app
          )}
        </body>
      </html>
    </ConvexAuthNextjsServerProvider>
  );
};
export default RootLayout;