hts/apps/staffai/app/staffai/layout.tsx

95 lines
2.5 KiB
TypeScript

import { GeistSans } from 'geist/font/sans'
import { GeistMono } from 'geist/font/mono'
import '@/app/globals.css'
import { cn } from '@/lib/utils'
import { TailwindIndicator } from '@/components-ai/tailwind-indicator'
import { Providers } from '@/components-ai/providers'
import { Header } from '@/components-ai/header'
import { Toaster } from '@/components-ai/ui/sonner'
import { Navigation } from '@/components/navbar/navigation'
import { Inter } from 'next/font/google';
import TranslationsProvider from '@/components/TranslationsProvider';
import initTranslations from '../i18n';
import { ReactNode } from 'react'
import { dir } from 'i18next'
export const metadata = {
metadataBase: process.env.VERCEL_URL
? new URL(`https://${process.env.VERCEL_URL}`)
: undefined,
title: {
default: 'AI Chatbot',
template: `%s - AI `
},
// description: 'An AI-powered chatbot template built with Next.js and Vercel.',
// icons: {
// icon: '/favicon.ico',
// shortcut: '/favicon-16x16.png',
// apple: '/apple-touch-icon.png'
// }
}
const inter = Inter({ subsets: ['latin'] });
const i18nNamespaces = ['common', 'home'];
export const viewport = {
themeColor: [
{ media: '(prefers-color-scheme: light)', color: 'white' },
{ media: '(prefers-color-scheme: dark)', color: 'black' }
]
}
interface RootLayoutProps {
children: React.ReactNode
}
// export default function RootLayout({ children }: RootLayoutProps) {
export default async function RootLayout({
children,
params: { locale }
}: {
children: ReactNode;
params: { locale: string };
}) {
const { t, resources } = await initTranslations(locale, i18nNamespaces);
return (
<html
lang={locale}
// dir={dir(locale)}
suppressHydrationWarning
>
<body
className={cn(
'font-sans antialiased',
GeistSans.variable,
GeistMono.variable,
"bg-white"
)}
>
<TranslationsProvider
namespaces={i18nNamespaces}
locale={locale}
resources={resources}>
<Toaster position="top-center" />
<Providers
attribute="class"
defaultTheme="system"
enableSystem
disableTransitionOnChange
>
<div className="flex flex-col min-h-screen ">
<main className="flex flex-col flex-1 bg-muted/2">{children}</main>
</div>
<TailwindIndicator />
</Providers>
</TranslationsProvider>
</body>
</html>
)
}