Our monorepo-project has the following structure (roughly):
??? commons # provides i18n-instance
??? orchestrator # is wrapped with <I18nextProvider/>, encapsulates <component1/> and <component2/>
??? component1 # is wrapped with <I18nextProvider>
??? component2 # is wrapped with <I18nextProvider>
orchestrator, component1 and component2 are all written in React and compile to webcomponents, where component1 and component2 are children of orchestrator.
I wrap all webcomponents with <I18NextProvider>, passing them all the same i18next-instance, that is provided by the commons-workspace.
When I now call i18n.changeLanguage("en") from within the orchestrator, the changes don't propagate to component1 and component2. Not even, if I rerender the whole app after changing the language.
Do I have to provide three separate i18next-instances and call changeLanguage on all of them separately? Is there a way I can keep working with a single instance and call changeLanguage a single time?