From 6b9c2d3925c676dd4f04888da1a4b3fffe1deaff Mon Sep 17 00:00:00 2001
From: behnam <behnamrahimpour74@gmail.com>
Date: Fri, 15 Nov 2024 20:25:42 +0300
Subject: [PATCH] Fix i18n issue for html
---
src/app/[lang]/layout.tsx | 27 +++++++++++++++++++++++----
src/app/layout.tsx | 24 ++----------------------
src/bootstrap/i18n/i18n.ts | 4 +++-
3 files changed, 28 insertions(+), 27 deletions(-)
diff --git a/src/app/[lang]/layout.tsx b/src/app/[lang]/layout.tsx
index 4fbaf40..b142672 100644
--- a/src/app/[lang]/layout.tsx
+++ b/src/app/[lang]/layout.tsx
@@ -1,15 +1,34 @@
import { initI18next } from "@/bootstrap/i18n/i18n";
import TranslationsProvider from "@/bootstrap/i18n/i18n-provider";
+import localFont from "next/font/local";
import { PropsWithChildren } from "react";
+const geistSans = localFont({
+ src: "./../fonts/GeistVF.woff",
+ variable: "--font-geist-sans",
+ weight: "100 900",
+});
+const geistMono = localFont({
+ src: "./../fonts/GeistMonoVF.woff",
+ variable: "--font-geist-mono",
+ weight: "100 900",
+});
+
export default async function layout(
props: PropsWithChildren & { params: Promise<{ lang: string }> },
) {
- const { lang } = await props.params;
+ const { params, children } = props;
+ const { lang } = await params;
const { resources } = await initI18next({ lng: lang });
return (
- <TranslationsProvider lng={lang} resources={resources}>
- {props.children}
- </TranslationsProvider>
+ <html lang={lang}>
+ <body
+ className={`${geistSans.variable} ${geistMono.variable} antialiased`}
+ >
+ <TranslationsProvider lng={lang} resources={resources}>
+ {children}
+ </TranslationsProvider>
+ </body>
+ </html>
);
}
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index a36cde0..c277050 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,35 +1,15 @@
import type { Metadata } from "next";
-import localFont from "next/font/local";
import "./globals.css";
-const geistSans = localFont({
- src: "./fonts/GeistVF.woff",
- variable: "--font-geist-sans",
- weight: "100 900",
-});
-const geistMono = localFont({
- src: "./fonts/GeistMonoVF.woff",
- variable: "--font-geist-mono",
- weight: "100 900",
-});
-
export const metadata: Metadata = {
title: "Create Next App",
description: "Generated by create next app",
};
-export default function RootLayout({
+export default async function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
- return (
- <html lang="en">
- <body
- className={`${geistSans.variable} ${geistMono.variable} antialiased`}
- >
- {children}
- </body>
- </html>
- );
+ return children;
}
diff --git a/src/bootstrap/i18n/i18n.ts b/src/bootstrap/i18n/i18n.ts
index 8b348f2..c95d601 100644
--- a/src/bootstrap/i18n/i18n.ts
+++ b/src/bootstrap/i18n/i18n.ts
@@ -3,6 +3,8 @@ import { createInstance, i18n, Resource } from "i18next";
import resourcesToBackend from "i18next-resources-to-backend";
import { initReactI18next } from "react-i18next/initReactI18next";
+const initI18nextInstance = createInstance();
+
export const initI18next = async (params: {
lng: string;
i18n?: i18n;
@@ -10,7 +12,7 @@ export const initI18next = async (params: {
ns?: string;
}) => {
const { lng, i18n, ns, resources } = params;
- const i18nInstance = i18n || createInstance();
+ const i18nInstance = i18n || initI18nextInstance;
await i18nInstance
.use(initReactI18next)
.use(