behnam/Nextjs-boilerplate
Template
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Fix translation issue for not switching the lang

Browse Source
This commit is contained in:
behnam 2025-03-07 10:53:01 +03:00
parent 1675d84cae
commit 693f07528e
4 changed files with 33 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/app/[lang]/dashboard/components/client/theme-provider/theme-provider.tsx
View File

@ -1,11 +1,12 @@
"use client"
"use client";
import * as React from "react"
import { ThemeProvider as NextThemesProvider } from "next-themes"
import * as React from "react";
import { ThemeProvider as NextThemesProvider } from "next-themes";
export function ThemeProvider({
children,
...props
}: React.ComponentProps<typeof NextThemesProvider>) {
return <NextThemesProvider {...props}>{children}</NextThemesProvider>
// eslint-disable-next-line react/jsx-props-no-spreading
return <NextThemesProvider {...props}>{children}</NextThemesProvider>;
}

6
src/app/[lang]/layout.tsx
View File

@ -20,7 +20,7 @@ export default async function layout(
) {
const { params, children } = props;
const { lang } = await params;
const { resources } = await initI18next({ lng: lang });
await initI18next({ lng: lang });
return (
<html lang={lang} suppressHydrationWarning>
<body
@ -32,9 +32,7 @@ export default async function layout(
enableSystem
disableTransitionOnChange
>
<TranslationsProvider lng={lang} resources={resources}>
{children}
</TranslationsProvider>
<TranslationsProvider lng={lang}>{children}</TranslationsProvider>
</ThemeProvider>
</body>
</html>

26
src/bootstrap/i18n/i18n-provider.tsx
View File

@ -2,16 +2,24 @@
import { I18nextProvider } from "react-i18next";
import { i18nInstance, initI18next, LANGS } from "@/bootstrap/i18n/i18n";
import { Resource } from "i18next";
import { PropsWithChildren } from "react";
import { PropsWithChildren, useEffect, useState } from "react";
import storeLang from "@/bootstrap/i18n/store-lang-action";
import { i18n } from "i18next";
export default function TranslationsProvider({
children,
lng,
resources,
}: PropsWithChildren & { lng: LANGS; resources: Resource }) {
if (!resources) return children;
initI18next({ lng, resources });
export default function TranslationsProvider(
props: PropsWithChildren & { lng: LANGS },
) {
const { lng, children } = props;
const [i18n, setI18n] = useState<i18n>();
useEffect(() => {
(async () => {
storeLang(lng);
setI18n((await initI18next({ lng })).i18n);
})();
}, [lng]);
if (!i18n) return null;
return <I18nextProvider i18n={i18nInstance}>{children}</I18nextProvider>;
}

9
src/bootstrap/i18n/store-lang-action.ts Normal file
View File

@ -0,0 +1,9 @@
"use server";
import { LANGS } from "@/bootstrap/i18n/i18n";
import { cookieName } from "@/bootstrap/i18n/settings";
import { cookies } from "next/headers";
export default async function storeLang(lng: LANGS) {
(await cookies()).set(cookieName, lng);
}