Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

I18n issue - wrong translations appear for the first render (probably) #294

Open
KuzMaxOriginal opened this issue Dec 5, 2024 · 1 comment

Comments

@KuzMaxOriginal
Copy link

To reproduce, set the default locale (e.g. de). For example, in the playground (app/page.tsx) replace this line:

-    const [i18n, setI18n] = useState("en");
+    const [i18n, setI18n] = useState("de");

And the error will appear:

Error: Text content does not match server-rendered HTML.
See more info here: https://nextjs.org/docs/messages/react-hydration-error

Text content did not match. Server: "Mon" Client: "Mo."

It seems to me that the first render happens in English, then in the specified language.

image

@KuzMaxOriginal
Copy link
Author

In my production Next application it worked a bit differently: it showed English for the first time we open the datepicker, then it would change the locale. To prevent this, I had to forcefully rerender the component by updating key.

@onesine, can I create a PR to fix this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant