i18n-Fundament: Cookie-basierte Sprachumschaltung (DE/EN/PL)

Wörterbücher unter lib/i18n statt next-intl (Next.js 16 ist neu genug,
dass eine externe Routing-Middleware zusätzliches Risiko bedeutet
hätte); Sprache liegt in einem Cookie, kein URL-Präfix nötig, dadurch
bleibt proxy.ts unverändert. LocaleProvider stellt Wörterbuch + Sprache
per Context für Client-Komponenten bereit (lib/i18n/shared.ts ist
bewusst getrennt von lib/i18n/index.ts, damit next/headers nicht in
den Client-Bundle gelangt).

app/api/locale/route.ts

@@ -0,0 +1,23 @@
+import { NextResponse } from "next/server";
+import { isLocale, LOCALE_COOKIE } from "@/lib/i18n";
+import { isSameOrigin } from "@/lib/origin";
+
+// Setzt das Sprach-Cookie. Kein Login nötig (auch anonyme Besucher
+// der öffentlichen Speisekarte sollen die Sprache wechseln können).
+export async function POST(request: Request) {
+  if (!isSameOrigin(request)) {
+    return NextResponse.json({ error: "Nicht erlaubt." }, { status: 403 });
+  }
+  const body = await request.json().catch(() => null);
+  const locale = body?.locale;
+  if (!isLocale(locale)) {
+    return NextResponse.json({ error: "Ungültige Sprache." }, { status: 400 });
+  }
+  const response = NextResponse.json({ ok: true });
+  response.cookies.set(LOCALE_COOKIE, locale, {
+    path: "/",
+    maxAge: 60 * 60 * 24 * 365,
+    sameSite: "lax",
+  });
+  return response;
+}

app/layout.tsx

@@ -3,6 +3,8 @@ import { Geist } from "next/font/google";
 import "./globals.css";
 import { createClient } from "@/lib/supabase/server";
 import { COLOR_VARS, DEFAULT_COLORS, faviconUrl, SITE_TITLE } from "@/lib/types";
+import { getDictionary, getLocale } from "@/lib/i18n";
+import { LocaleProvider } from "@/components/i18n/LocaleProvider";
 import packageJson from "@/package.json";
 
 // Farben/Logo/Favicon sollen Änderungen sofort widerspiegeln.
@@ -37,11 +39,11 @@ export default async function RootLayout({
   children: React.ReactNode;
 }>) {
   const supabase = await createClient();
-  const { data: settings } = await supabase
-    .from("settings")
-    .select("colors")
-    .eq("id", 1)
-    .maybeSingle();
+  const [{ data: settings }, locale] = await Promise.all([
+    supabase.from("settings").select("colors").eq("id", 1).maybeSingle(),
+    getLocale(),
+  ]);
+  const dict = getDictionary(locale);
 
   const colors: Record<string, string> = {
     ...DEFAULT_COLORS,
@@ -52,9 +54,11 @@ export default async function RootLayout({
   ) as React.CSSProperties;
 
   return (
-    <html lang="de" className={`${geistSans.variable} h-full antialiased`}>
+    <html lang={locale} className={`${geistSans.variable} h-full antialiased`}>
       <body style={style} className="min-h-full flex flex-col">
-        {children}
+        <LocaleProvider locale={locale} dict={dict}>
+          {children}
+        </LocaleProvider>
         <footer className="mt-auto px-4 py-2 text-right text-xs text-gray-400 select-none">
           Version {packageJson.version}
         </footer>