Feature/i18n load resources from backend (#746)

* Load i18n resources from backend

* Move locales to public folder

src/i18n/index.ts

@@ -9,14 +9,42 @@
 import { use } from 'i18next';
 import { initReactI18next } from 'react-i18next';
 import LanguageDetector from 'i18next-browser-languagedetector';
-import { resources } from '@/i18n/translations';
+import HttpBackend from 'i18next-http-backend';
+
+/**
+ * Keys have to match {@link ISOLanguages} codes, they're used for showing the language name in the dropdown in the {@link Settings}.<br/>
+ * In case there is no language code for the key in {@link ISOLanguages}, the corresponding language has to be added
+ */
+export const i18nResources = [
+    'ar',
+    'de',
+    'en',
+    'es',
+    'fr',
+    'id',
+    'it',
+    'ja',
+    'ko',
+    'nb_NO',
+    'pt',
+    'sv',
+    'uk',
+    'vi',
+    'zh_Hans',
+    'zh_Hant',
+];
 
 export const i18n = use(initReactI18next)
+    .use(HttpBackend)
     .use(LanguageDetector)
     .init({
-        resources,
-
         fallbackLng: 'en',
+
+        backend: {
+            loadPath: '/locales/{{lng}}.json',
+            allowMultiLoading: true,
+        },
+
         interpolation: {
             escapeValue: false,
             format: (value, format) => {
@@ -28,6 +56,7 @@ export const i18n = use(initReactI18next)
                 }
             },
         },
+
         returnNull: false,
         debug: process.env.NODE_ENV !== 'production',
     });