Automatically set translation according to browser settings

common/webapp/public/lang/settings.conf

@@ -1,5 +1,6 @@
 {
   default: "en"
+  useBrowserLanguage: true
   languages: [
     // remove the languages you don't need reorder them or add your own
     { locale: "cs", name: "Czech" }
@@ -11,22 +12,22 @@
     { locale: "lv", name: "Latviešu" }
     { locale: "hu", name: "Magyar" }
     { locale: "nl", name: "Nederlands" }
-    { locale: "no_nb", name: "Norsk bokmål" }
+    { locale: "nb", name: "Norsk bokmål" }
     { locale: "pl", name: "Polski" }
-    { locale: "pt_PT", name: "Português (Portugal)" }
+    { locale: "pt-PT", name: "Português (Portugal)" }
     { locale: "ru", name: "Русский" }
-    { locale: "sr_latn", name: "Srpski (latinica)" }
-    { locale: "sr_cyrl", name: "Српски (ћирилица)" }
+    { locale: "sr-Latn-RS", name: "Srpski (latinica)" }
+    { locale: "sr-Cyrl-RS", name: "Српски (ћирилица)" }
     { locale: "fi", name: "Suomi" }
     { locale: "es", name: "Spanish" }
     { locale: "sv", name: "Svenska" }
     { locale: "tr", name: "Türkçe" }
     { locale: "th", name: "ภาษาไทย" }
     { locale: "ua", name: "Українська" }
     { locale: "ja", name: "日本語" }
-    { locale: "zh_CN", name: "简体中文(中国大陆)" }
-    { locale: "zh_TW", name: "繁體中文(台灣)" }
-    { locale: "zh_HK", name: "繁體中文(香港特別行政區)" }
+    { locale: "zh-CN", name: "简体中文(中国大陆)" }
+    { locale: "zh-TW", name: "繁體中文(台灣)" }
+    { locale: "zh-HK", name: "繁體中文(香港特別行政區)" }
     { locale: "ko", name: "한국어" }
     { locale: "vi", name: "Tiếng Việt"}
   ]

common/webapp/src/i18n.js

@@ -32,6 +32,25 @@ export async function setLanguage(lang) {
 
 export async function loadLanguageSettings() {
 	let settings = await fetchHocon(`./lang/settings.conf`);
+	let selectedLanguage = null;
+
+	if (settings.useBrowserLanguage) {
+		const availableLanguages = settings.languages.map(lang => lang.locale);
+
+        for (let browserLanguage of navigator.languages) {
+            selectedLanguage = availableLanguages.find(lang => lang === browserLanguage);
+            if (selectedLanguage) break;
+
+            let baseBrowserLanguage = browserLanguage.split('-')[0];
+            selectedLanguage = availableLanguages.find(lang => lang.startsWith(baseBrowserLanguage));
+            if (selectedLanguage) break;
+        }
+	}
+
+	if (!selectedLanguage) {
+		selectedLanguage = settings.default;
+	}
+
 	i18n.languages = settings.languages;
-	await setLanguage(settings.default);
+	await setLanguage(selectedLanguage);
 }