Refactor i18n

app/src/i18n.js

@@ -1,24 +1,5 @@
-import i18n from 'i18next'; // eslint-disable-line import/no-extraneous-dependencies
-import languages from './languages';
+import setup from '../../i18n/i18n-setup';
 
-const resources = Object.keys(languages).reduce((accumulator, key) => {
-  accumulator[key] = {
-    common: languages[key].common,
-  };
-  return accumulator;
-}, {});
-
-i18n
-  .init({
-    fallbackLng: 'en',
-    resources,
-    lang: 'en',
-    ns: ['common'],
-    defaultNS: 'common',
-    saveMissing: true,
-    debug: false,
-    keySeparator: '>',
-    nsSeparator: '|',
-  });
+const i18n = setup();
 
 export default i18n;

i18n/i18n-setup.js

@@ -0,0 +1,27 @@
+import i18n from 'i18next';
+import languages from './languages';
+
+const setup = () => {
+  const resources = Object.keys(languages).reduce((accumulator, key) => {
+    accumulator[key] = {
+      common: languages[key].common,
+    };
+    return accumulator;
+  }, {});
+
+
+  return i18n
+    .init({
+      fallbackLng: 'en',
+      resources,
+      lang: 'en',
+      ns: ['common'],
+      defaultNS: 'common',
+      saveMissing: true,
+      debug: false,
+      keySeparator: '>',
+      nsSeparator: '|',
+    });
+};
+
+export default setup;

i18n/languages.js

@@ -0,0 +1,13 @@
+const languages = {
+  en: {
+    name: 'English',
+    common: require('./locales/en/common.json'),
+    flag: require('./flags/en.png'),
+  },
+  de: {
+    name: 'Deutsch',
+    common: require('./locales/de/common.json'),
+    flag: require('./flags/de.png'),
+  },
+};
+export default languages;

package.json

@@ -18,7 +18,7 @@
     "dist:win": "build --win --ia32 --x64",
     "dist:mac": "build --mac",
     "dist:linux": "build --linux --ia32 --x64 --armv7l",
-    "copy-files": "cpx \"./src/{index.html,assets/**/*,locales/**/*}\" ./app/build/",
+    "copy-files": "cpx \"./src/{index.html,assets/**/*}\" ./app/build/",
     "clean-build": "rm -rf app/build",
     "clean-dist": "rm -rf dist",
     "eslint": "eslint ./src/ ./app/src/ ./app/config/ ./features/",

src/components/languageDropdown/index.js

@@ -3,7 +3,7 @@ import { translate } from 'react-i18next';
 import React from 'react';
 
 import i18n from '../../i18n';
-import languages from '../../constants/languages';
+import languages from '../../../i18n/languages';
 
 const languagesSource = Object.keys(languages).map(key => ({
   value: key,

src/i18n.js

@@ -1,43 +1,5 @@
-import i18n from 'i18next';
-import languages from './constants/languages';
+import setup from '../i18n/i18n-setup';
 
-const resources = Object.keys(languages).reduce((accumulator, key) => {
-  accumulator[key] = {
-    common: languages[key].common,
-  };
-  return accumulator;
-}, {});
-
-i18n
-  .init({
-    fallbackLng: 'en',
-    resources,
-    react: {
-      // wait: true, // globally set to wait for loaded translations in translate hoc
-      // exposeNamespace: true // exposes namespace on data-i18next-options to be used in eg.
-    },
-
-    // have a common namespace used around the full app
-    ns: ['common'],
-    defaultNS: 'common',
-
-    keySeparator: '>',
-    nsSeparator: '|',
-
-    debug: false,
-
-    // cache: {
-    //   enabled: true,
-    // },
-
-    interpolation: {
-      escapeValue: false, // not needed for react!!
-      formatSeparator: ',',
-      format: (value, format) => {
-        if (format === 'uppercase') return value.toUpperCase();
-        return value;
-      },
-    },
-  });
+const i18n = setup();
 
 export default i18n;