add: locale and i18n

2025-07-24 03:14:21 +03:30
parent b9d14478a1
commit 1b3fac2f43
38 changed files with 385 additions and 69 deletions
@@ -0,0 +1,9 @@
+import 'server-only'
+ 
+const dictionaries = {
+  en: () => import('@/dictionaries/en.json').then((module) => module.default),
+  fa: () => import('@/dictionaries/fa.json').then((module) => module.default),
+}
+ 
+export const getDictionary = async (locale: 'en' | 'fa') =>
+  dictionaries[locale]()
@@ -0,0 +1,49 @@
+import { Metadata } from "next";
+import "../globals.css";
+import { ReactQueryProvider } from "@/components/providers/ReactQueryProvider";
+import { notFound } from "next/navigation";
+import i18nConfig from "../../../i18nConfig";
+import initTranslations from '@/lib/i18n';
+import TranslationsProvider from "@/components/utils/TranslationsProdiver";
+
+export const metadata: Metadata = {
+  title: 'Dashboard',
+  description: 'Webapp dashboard'
+}
+
+const i18nNamespaces = ['auth'];
+
+export default async function RootLayout({
+  children,
+  params,
+}: Readonly<{
+  children: React.ReactNode;
+  params: { locale: string }
+}>) {
+  const { locale } = await params;
+  if (!i18nConfig.locales.includes(locale)) {
+    notFound();
+  }
+  const { resources } = await initTranslations(locale, i18nNamespaces);
+
+  return (
+
+    <html lang={locale} className="h-svh overflow-hidden">
+      <body
+        dir={locale === 'fa' ? 'rtl' : 'ltr'}
+        className={`antialiased bg-background h-svh overflow-hidden`}
+      >
+        <ReactQueryProvider>
+          <TranslationsProvider
+            namespaces={i18nNamespaces}
+            locale={locale}
+            resources={resources}>
+            <div id="root" className="h-svh overflow-hidden">
+              {children}
+            </div>
+          </TranslationsProvider>
+        </ReactQueryProvider>
+      </body>
+    </html >
+  );
+}
@@ -1,31 +0,0 @@
-import { Metadata } from "next";
-import "./globals.css";
-import { ReactQueryProvider } from "@/components/providers/ReactQueryProvider";
-
-export const metadata: Metadata = {
-  title: 'Dashboard',
-  description: 'Webapp dashboard'
-}
-
-export default function RootLayout({
-  children,
-}: Readonly<{
-  children: React.ReactNode;
-}>) {
-
-  return (
-
-    <html lang="en" className="h-svh overflow-hidden">
-      <body
-        dir="rtl"
-        className={`antialiased bg-background h-svh overflow-hidden`}
-      >
-        <ReactQueryProvider>
-          <div id="root" className="h-svh overflow-hidden">
-            {children}
-          </div>
-        </ReactQueryProvider>
-      </body>
-    </html>
-  );
-}