ELECTRON-1213 - Fix localization for more information window (#657)

src/app/window-utils.ts

@@ -134,7 +134,7 @@ export const createComponentWindow = (
         if (!browserWindow || !windowExists(browserWindow)) {
             return;
         }
-        browserWindow.webContents.send('set-locale-resource', { locale: i18n.getLocale(), resource: i18n.loadedResources });
+        browserWindow.webContents.send('page-load', { locale: i18n.getLocale(), resource: i18n.loadedResources });
     });
     browserWindow.setMenu(null as any);
 

src/locale/en-US.json

@@ -15,6 +15,8 @@
   },
   "MoreInfo": {
     "More Information": "More Information",
+    "Others": "Others",
+    "related": "related",
     "Version Information": "Version Information"
   },
   "Bring All to Front": "Bring All to Front",

src/locale/en.json

@@ -15,6 +15,8 @@
   },
   "MoreInfo": {
     "More Information": "More Information",
+    "Others": "Others",
+    "related": "related",
     "Version Information": "Version Information"
   },
   "Bring All to Front": "Bring All to Front",

src/locale/fr-FR.json

@@ -15,6 +15,8 @@
   },
   "MoreInfo": {
     "More Information": "Plus d’informations",
+    "Others": "Autres",
+    "related": "en relation",
     "Version Information": "Information sur la version"
   },
   "Bring All to Front": "Amener tous au front",

src/locale/fr.json

@@ -15,6 +15,8 @@
   },
   "MoreInfo": {
     "More Information": "Plus d’informations",
+    "Others": "Autres",
+    "related": "en relation",
     "Version Information": "Information sur la version"
   },
   "Bring All to Front": "Amener tous au front",

src/locale/ja-JP.json

@@ -15,6 +15,8 @@
   },
   "MoreInfo": {
     "More Information": "詳しくは",
+    "Others": "その他",
+    "related": "関連した",
     "Version Information": "バージョン情報"
   },
   "Bring All to Front": "すべて前面に表示",

src/locale/ja.json

@@ -15,6 +15,8 @@
   },
   "MoreInfo": {
     "More Information": "詳しくは",
+    "Others": "その他",
+    "related": "関連した",
     "Version Information": "バージョン情報"
   },
   "Bring All to Front": "すべて前面に表示",

src/renderer/components/more-info.tsx

@@ -1,5 +1,8 @@
 import * as React from 'react';
 
+import { i18n } from '../../common/i18n-preload';
+
+const MORE_INFO_NAMESPACE = 'MoreInfo';
 /**
  * Window that display app version and copyright info
  */
@@ -11,13 +14,13 @@ export default class MoreInfo extends React.PureComponent {
     public render(): JSX.Element {
         return (
             <div className='MoreInfo'>
-                <span><b>Version Information</b></span>
+                <span><b>{i18n.t('Version Information', MORE_INFO_NAMESPACE)()}</b></span>
                 <div className='content'>
                     <h4>Electron</h4>
                     <span className='MoreInfo-electron'>{process.versions.electron || 'N/A'}</span>
                 </div>
                 <div className='content'>
-                    <h4>v8 related</h4>
+                    <h4>v8 {i18n.t('related', MORE_INFO_NAMESPACE)()}</h4>
                     <table>
                         <tbody>
                         <tr>
@@ -34,7 +37,7 @@ export default class MoreInfo extends React.PureComponent {
                     </table>
                 </div>
                 <div className='content'>
-                    <h4>Others</h4>
+                    <h4>{i18n.t('Others', MORE_INFO_NAMESPACE)()}</h4>
                     <table>
                         <tbody>
                         <tr>

src/renderer/preload-component.ts

@@ -51,6 +51,7 @@ const load = () => {
         case components.moreInfo:
             loadStyle(components.moreInfo);
             component = MoreInfo;
+            document.title = i18n.t('More Information', 'MoreInfo')();
             break;
         case components.screenPicker:
             loadStyle(components.screenPicker);
@@ -77,9 +78,9 @@ const load = () => {
     ReactDOM.render(element, document.getElementById('Root'));
 };
 
-document.addEventListener('DOMContentLoaded', load);
+ipcRenderer.on('page-load', (_event, data) => {
-
-ipcRenderer.on('set-locale-resource', (_event, data) => {
     const { locale, resource } = data;
     i18n.setResource(locale, resource);
+    // Renders component as soon as the page is ready
+    load();
 });