gatsbyjs / themes

This is a repo for Gatsby's official themes.
138 stars 78 forks source link

[gatsby-theme-i18n-react-i18next] hydrate and useTranslation #100

Open kaelhem opened 3 years ago

kaelhem commented 3 years ago

Hi, I'm trying to use the gatsby-theme-i18n-react-i18next theme but facing some hydratation issues.

To reproduce the behavior, you can simply clone this repo and launch the available react-i18next sample in dev:

cd themes-master/starters/example-react-i18next 
yarn && gatsby develop

When you click a link for the first time after page load, you can see this error displayed in console: Warning: Cannot update a component (Layout) while rendering a different component (PageRenderer).

Looking at the stacktrace, it seems related to the 'useTranslation' hook of the react-i18next library. I found this similar issue on the repo of the library : https://github.com/i18next/react-i18next/issues/1124 but this is not very helping (I played with the useSuspense parameter, but it changes nothing apparently).

My question is: what are consequences of this warning ? Is it ok to "live with it" ? Is there some known workarounds?

Thanks !

chrisk8er commented 3 years ago

i Get the same issue when using useTranslation and gatsby-theme-i18n