another step for constructing base project

client/src/app/[locale]/layout.tsx

@@ -0,0 +1,54 @@
+import type { ReactNode } from 'react';
+import { setRequestLocale, getMessages } from 'next-intl/server';
+import { NextIntlClientProvider } from 'next-intl';
+import { getThemeMode } from '@/lib/cookies/server';
+import { AppStoreProvider } from '@/store';
+import { ThemeProvider, getDirection } from '@/theme';
+import { routing } from '@/i18n/routing';
+
+/*
+ * This layout is the correct place for NextIntlClientProvider because it
+ * receives the locale directly from URL params — no header reads, no caching
+ * surprises. setRequestLocale(locale) is called first so that any server
+ * component deeper in the tree that calls getLocale() / getTranslations()
+ * gets the right locale from React.cache instead of falling through to the
+ * header fallback.
+ *
+ * getMessages({ locale }) passes the locale explicitly so the config
+ * callback in src/i18n/request.ts receives it via requestLocale directly
+ * (Promise.resolve(locale)) rather than reading it from the cache — an
+ * extra layer of defense against cache-ordering races.
+ */
+export default async function LocaleLayout({
+  children,
+  params,
+}: {
+  children: ReactNode;
+  params: Promise<{ locale: string }>;
+}) {
+  const { locale } = await params;
+
+  const safeLocale = routing.locales.includes(locale as (typeof routing.locales)[number])
+    ? locale
+    : routing.defaultLocale;
+
+  setRequestLocale(safeLocale);
+
+  const messages = await getMessages({ locale: safeLocale });
+  const { defaultMode } = await getThemeMode();
+  const dir = getDirection(safeLocale);
+
+  return (
+    <NextIntlClientProvider locale={safeLocale} messages={messages}>
+      <AppStoreProvider>
+        <ThemeProvider dir={dir} defaultMode={defaultMode}>
+          {children}
+        </ThemeProvider>
+      </AppStoreProvider>
+    </NextIntlClientProvider>
+  );
+}
+
+export function generateStaticParams() {
+  return routing.locales.map((locale) => ({ locale }));
+}