auto translation setup

2026-04-17 10:46:24 +02:00
parent e1efa898b4
commit dbeb294920
3 changed files with 46 additions and 19 deletions
@@ -1,5 +1,7 @@
 import type { Metadata } from "next";
 import { Playfair_Display, Inter } from "next/font/google";
+import { NextIntlClientProvider } from "next-intl";
+import { getMessages } from 'next-intl/server';

 import "./globals.css";

@@ -22,27 +24,34 @@ export const metadata: Metadata = {
 	description: "Portfolio de Mathéo Guilbert, développeur web freelance.",
 };

-export default function RootLayout({
-	children,
-}: Readonly<{
-	children: React.ReactNode;
-}>) {
+export default async function RootLayout({
+    children,
+    params,
+}: {
+    children: React.ReactNode;
+    params: Promise<{ locale: string }>;
+}) {
+	const { locale } = await params;
+    const messages = await getMessages();
+
 	return (
-		<html lang="fr" className={`${playfairDisplay.variable} ${inter.variable} bg-brand-beige overflow-hidden antialiased`}>
+		<html lang={locale} className={`${playfairDisplay.variable} ${inter.variable} bg-brand-beige overflow-hidden antialiased`}>
 			
 			<body className="h-screen w-screen bg-brand-beige text-brand-brown flex flex-col overflow-hidden">
-				<div className="sticky top-0 z-50 bg-brand-beige w-full px-2.75 pt-2.75">
-					<Header />
-				</div>
+				<NextIntlClientProvider messages={messages}>
+					<div className="sticky top-0 z-50 bg-brand-beige w-full px-2.75 pt-2.75">
+						<Header />
+					</div>
 					
-				{/* Scrolling bloc */}
-				<CustomScrollArea>
-					<main className="px-2.75 pb-2.75">
-						{children}
-					</main>
+					{/* Scrolling bloc */}
+					<CustomScrollArea>
+						<main className="px-2.75 pb-2.75">
+							{children}
+						</main>
 						
-					<Footer />
-				</CustomScrollArea>
+						<Footer />
+					</CustomScrollArea>
+				</NextIntlClientProvider>
 			</body>
 		</html>
 	);
@@ -0,0 +1,15 @@
+import { getRequestConfig } from 'next-intl/server';
+import { notFound } from 'next/navigation';
+
+const locales = ['fr', 'en'];
+
+export default getRequestConfig(async ({ requestLocale }) => {
+    const locale = await requestLocale;
+
+    if (!locale || !locales.includes(locale)) notFound();
+
+    return {
+        locale,
+        messages: (await import(`./messages/${locale}.json`)).default
+    };
+});
@@ -1,7 +1,10 @@
 import type { NextConfig } from "next";
+import createNextIntlPlugin from 'next-intl/plugin';

 const nextConfig: NextConfig = {
  /* config options here */
 };

-export default nextConfig;
+const withNextIntl = createNextIntlPlugin('./i18n.ts');
+
+export default withNextIntl(nextConfig);