1import i18n from 'i18next';
 2import {initReactI18next} from 'react-i18next';
 3import 'moment/locale/fr-ch';
 4import moment from 'moment';
 5import translationFr from '../locales/fr.json';
 6import translationEn from '../locales/en.json';
 7import {Enum_Userspermissionsuser_Lang as Lang} from '../generated/graphql';
 8
 9const STORAGE_KEY = 'i18n-lang';
10
11type AvailableLang = 'en' | 'fr';
12
13const resources = {
14  fr: {
15    translation: translationFr,
16  },
17  en: {
18    translation: translationEn,
19  },
20};
21
22export const getNavigatorLang = (): AvailableLang => {
23  if (typeof localStorage !== 'undefined') {
24    const storedLang = localStorage.getItem(STORAGE_KEY);
25    if (storedLang) return storedLang as AvailableLang;
26  }
27  if (typeof window !== 'undefined' && typeof window.navigator !== 'undefined')
28    if (navigator.language === 'fr' || navigator.language.includes('fr-'))
29      return 'fr';
30  return 'fr';
31};
32
33i18n
34  .use(initReactI18next) // passes i18n down to react-i18next
35  .init({
36    resources,
37    lng: getNavigatorLang(),
38    supportedLngs: ['fr', 'en'],
39    interpolation: {
40      escapeValue: false, // react already safes from xss
41    },
42  });
43
44// Moment - On lang change
45const changeMomentLang = (i18nLang: string) => {
46  const momentLang = i18nLang === 'fr' ? 'fr-ch' : 'en';
47  moment.locale(momentLang);
48};
49
50// Moment - On page load
51const i18nLang = getNavigatorLang();
52changeMomentLang(i18nLang);
53
54export const changeLang = (lang: Lang) => {
55  const i18nLang = lang.toLowerCase();
56  i18n.changeLanguage(i18nLang);
57  changeMomentLang(i18nLang);
58  if (typeof localStorage !== 'undefined')
59    localStorage.setItem(STORAGE_KEY, i18nLang);
60};
61
62export default i18n;