I have been using react-i18next for a while and I have recently implemented a Cookie Consent React component. Therefore, I would like to only use cookies in i18next only if the user has accepted them.
The first step for me has been to remove the 'cookie' from the initial configuration:
import i18n from 'i18next';
import HttpApi from 'i18next-http-backend';
import LanguageDetector from 'i18next-browser-languagedetector';
import { initReactI18next } from 'react-i18next';
const i18nInitialConfig = (): void => {
i18n
.use(HttpApi)
.use(LanguageDetector)
.use(initReactI18next)
// init i18next
// for all options read: https://www.i18next.com/overview/configuration-options
.init({
fallbackLng: 'en',
whitelist: ['en'],
preload: ['en'],
load: 'languageOnly',
ns: namespaces,
debug: false,
interpolation: {
escapeValue: false // not needed for react as it escapes by default
},
detection: {
order: ['querystring'],
lookupQuerystring: 'lng'
},
react: {
// useSuspense: false,
}
});
};
However, it seems that removing cookie from detection, etc. does not change anything, I can still see the cookie being set. Is this expected?
My second question is, once the user accepts the cookie, how should I tell react-i18next to use cookies? Should I call init again? I am worried that might have side effects like the user selected language being reset.