Merge pull request #904 from LiskHQ/897-language-setup

Enable locale default select in browser and on reload - Closes #897

app/src/main.js

@@ -37,11 +37,15 @@ const sendDetectedLang = (locale) => {
 };
 
 // read config data from JSON file
-storage.get('config', (error, data) => {
-  if (error) throw error;
-  lang = data.lang;
-  sendDetectedLang(lang);
-});
+const getConfig = () => {
+  storage.get('config', (error, data) => {
+    if (error) throw error;
+    lang = data.lang;
+    sendDetectedLang(lang);
+  });
+};
+
+getConfig();
 
 function createWindow() {
   // set language of the react app
@@ -182,3 +186,7 @@ ipcMain.on('set-locale', (event, locale) => {
     event.returnValue = 'Rebuilt electron menu.';
   }
 });
+
+ipcMain.on('request-locale', () => {
+  getConfig();
+});

src/utils/ipcLocale.js

@@ -4,6 +4,10 @@ export default {
     let localeInit = false;
 
     if (ipc) {
+      if (!i18n.language) {
+        ipc.send('request-locale');
+      }
+
       ipc.on('detectedLocale', (action, locale) => {
         i18n.changeLanguage(locale);
         localeInit = true;
@@ -14,6 +18,17 @@ export default {
           ipc.send('set-locale', locale);
         }
       });
+    } else {
+      const language = i18n.language || window.localStorage.getItem('lang');
+      if (language) {
+        i18n.changeLanguage(language);
+      } else {
+        i18n.changeLanguage('en');
+      }
+
+      i18n.on('languageChanged', (locale) => {
+        window.localStorage.setItem('lang', locale);
+      });
     }
   },
 };

src/utils/ipcLocale.test.js

@@ -16,13 +16,40 @@ describe('ipcLocale', () => {
   describe('init', () => {
     beforeEach(() => {
       delete window.ipc;
+      i18n.language = '';
     });
-    it('calling init when ipc is not on window should do nothing', () => {
-      ipcLocale.init();
+
+    it('calling init when ipc is not on window does not call ipc', () => {
+      ipcLocale.init(i18n);
       expect(ipc.on).to.not.have.been.calledWith();
       expect(ipc.send).to.not.have.been.calledWith();
     });
 
+    it('calling init when ipc is not on window saves locale in browser when there is no locale in i18n', () => {
+      window.localStorage.getItem = () => 'en';
+
+      ipcLocale.init(i18n);
+      expect(ipc.on).to.not.have.been.calledWith();
+      expect(ipc.send).to.not.have.been.calledWith();
+
+      expect(i18n.changeLanguage).to.have.been.calledWith('en');
+    });
+
+    it('calling init when ipc is not on window saves locale in browser when there is no locale in localStorage', () => {
+      window.localStorage.getItem = () => '';
+      i18n.language = 'de';
+
+      ipcLocale.init(i18n);
+      expect(i18n.changeLanguage).to.have.been.calledWith('de');
+    });
+
+    it('calling init when ipc is not on window saves locale in browser when there is no locale saved at all', () => {
+      window.localStorage.getItem = () => '';
+
+      ipcLocale.init(i18n);
+      expect(i18n.changeLanguage).to.have.been.calledWith('en');
+    });
+
     it('should be a function', () => {
       expect(typeof ipcLocale.init).to.be.equal('function');
     });
@@ -33,5 +60,12 @@ describe('ipcLocale', () => {
       expect(ipc.on).to.have.been.calledWith();
       expect(i18n.on).to.have.been.calledWith();
     });
+
+    it('calling init when ipc is available and there is no locale in i18n will make a request for locale ', () => {
+      window.ipc = ipc;
+
+      ipcLocale.init(i18n);
+      expect(ipc.send).to.have.been.calledWith('request-locale');
+    });
   });
 });