Automatic language detection and save (#305)

BesLogic · Nov 26, 2024 · 8311875 · 8311875
1 parent 4774c39
commit 8311875
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 4 deletions.
diff --git a/canopeum_frontend/package-lock.json b/canopeum_frontend/package-lock.json
diff --git a/canopeum_frontend/package.json b/canopeum_frontend/package.json
@@ -23,6 +23,7 @@
     "bootstrap": "^5.3.3",
     "browser-image-compression": "^2.0.2",
     "i18next": "^23.10.1",
+    "i18next-browser-languagedetector": "^8.0.0",
     "i18next-http-backend": "^2.5.0",
     "jwt-decode": "4.0.0",
     "maplibre-gl": "^4.1.1",

diff --git a/canopeum_frontend/src/i18n.ts b/canopeum_frontend/src/i18n.ts
@@ -1,9 +1,14 @@
 import { default as i18n } from 'i18next'
+import LanguageDetector from 'i18next-browser-languagedetector'
 import { initReactI18next } from 'react-i18next'
 
 import resources from './locale'
 
-void i18n.use(initReactI18next).init({
-  resources,
-  lng: 'en',
-})
+void i18n
+  .use(initReactI18next)
+  .use(LanguageDetector)
+  .init({
+    supportedLngs: Object.keys(resources),
+    resources,
+    detection: { convertDetectedLanguage: lng => lng.split('-')[0] }, // fr-CA -> fr
+  })