Files
base-front-project/src/app/[locale]/layout.tsx

56 lines
1.7 KiB
TypeScript

import { getDirection } from "@/i18n/direction";
import { routing } from "@/i18n/routing";
import { ClientAppProvider } from "@/providers/ClientAppProvider";
import "@/styles/globals.css";
import type { Metadata } from "next";
import { hasLocale, NextIntlClientProvider } from "next-intl";
import { getMessages } from "next-intl/server";
import { notFound } from "next/navigation";
export const metadata: Metadata = {
title: "Theater of dreams",
};
export default async function RootLayout({
children,
params,
}: Readonly<{
children: React.ReactNode;
params: Promise<{ locale: string }>;
}>) {
const { locale } = await params;
if (!hasLocale(routing.locales, locale)) {
notFound();
}
const messages = await getMessages();
const dir = getDirection(locale);
return (
<html dir={dir} lang={locale} suppressHydrationWarning>
<head>
{/* Prevent theme flicker before hydration */}
<script
dangerouslySetInnerHTML={{
__html: `
(function() {
try {
const stored = localStorage.getItem('theme');
const theme = stored || 'dark';
document.documentElement.setAttribute('data-theme', theme);
} catch (e) {}
})();
`,
}}
/>
</head>
<body className="bg-background">
<NextIntlClientProvider locale={locale} messages={messages}>
<ClientAppProvider>{children}</ClientAppProvider>
</NextIntlClientProvider>
</body>
</html>
);
}