i18next doesn't work in next 15

[modern birch]

does anyone know why i18next with react-i18next doesn't work in next 15 and works with next 14 , am i missing something ?

[edgy anchor]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

[mystic creek]

Can you share your project structure?

https://nextjs.org/docs/pages/building-your-application/routing/internationalization

[modern birch]

all I did is this
`import i18n from "i18next";
import { initReactI18next } from "react-i18next";

const resources = {
en: {
translation: {
react: "Welcome to React and react-i18next"
}
},
fr: {
translation: {
react: "Bienvenue à React et react-i18next"
}
}
};

i18n.use(initReactI18next)
.init({
resources,
fallbackLng: 'en',
lng: "en",

interpolation: {
  escapeValue: false
}

});
export default i18n;`

then imported i18n to layout.tsx and then used the useTranslation inside page.tsx app router

[mystic creek]

what can you see in the log?

[modern birch]

all I see is this in the logs

Uncaught TypeError: (0 , react__WEBPACK_IMPORTED_MODULE_0__.createContext) is not a function

import { initReactI18next } from './initReactI18next.js';
5 | export { getDefaults, setDefaults, getI18n, setI18n, initReactI18next };

6 | export const I18nContext = createContext();
| ^
7 | export class ReportNamespaces {
8 | constructor() {
9 | this.usedNamespaces = {};

[modern birch]

I fixed the issue its because I have to add this layout and wrap it inside layout.tsx

'use client'; import { I18nextProvider } from 'react-i18next'; import i18n from '@/utils/i18n'; import React from 'react'; export default function I18nProvider({ children }: { children : React.ReactNode}) { return <I18nextProvider i18n={i18n}>{children}</I18nextProvider>; }