From 3b803a8d53aaa8ed35dd2f8d782ae27523da4f61 Mon Sep 17 00:00:00 2001
From: Justin <38869875+justinlampley@users.noreply.github.com>
Date: Fri, 23 Jun 2023 19:27:22 -0400
Subject: [PATCH] Fetch locales through http requests to the backend server

---
 package.json                |  6 +++++-
 src/api/index.ts            |  2 ++
 src/api/src/config/index.ts |  1 +
 src/i18n/index.ts           |  7 ++++++-
 src/main.dev.ts             | 12 ++++++++++--
 5 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index c08d8cba7..edb6b2b08 100644
--- a/package.json
+++ b/package.json
@@ -144,7 +144,11 @@
     },
     "extraResources": [
       "./assets/**",
-      "./devices/**"
+      "./devices/**",
+      {
+        "from": "./src/i18n",
+        "to": "i18n"
+      }
     ],
     "publish": {
       "provider": "github",
diff --git a/src/api/index.ts b/src/api/index.ts
index cfd2a16e5..d7921fdc3 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -180,6 +180,8 @@ export default class ApiServer {
     await this.buildContainer(config, logger);
     this.app = express();
 
+    this.app.use('/locales', express.static(config.localesPath));
+
     this.httpServer = createServer(this.app);
     /*
           I know, crazy. It is 45 minutes, but on slower network connection it might take a while to download
diff --git a/src/api/src/config/index.ts b/src/api/src/config/index.ts
index 463d3a781..e738d489b 100644
--- a/src/api/src/config/index.ts
+++ b/src/api/src/config/index.ts
@@ -18,6 +18,7 @@ export interface IConfig {
   targetsStoragePath: string;
   userDefinesStoragePath: string;
   userDataPath: string;
+  localesPath: string;
 }
 
 export const ConfigToken = new Token<IConfig>('CONFIG_TOKEN');
diff --git a/src/i18n/index.ts b/src/i18n/index.ts
index c45b223e2..c9d290f77 100644
--- a/src/i18n/index.ts
+++ b/src/i18n/index.ts
@@ -3,6 +3,11 @@ import { initReactI18next } from 'react-i18next';
 import LanguageDetector from 'i18next-browser-languagedetector'; // For auto-detecting language
 import Backend from 'i18next-http-backend'; // For loading translations from backend
 
+const searchParams = new URLSearchParams(window.location.search.slice(1));
+const loadPath = `${
+  searchParams.get('base_url') ?? 'http://localhost:3500/'
+}/locales/{{lng}}/translation.json`;
+
 i18n
   .use(Backend)
   .use(LanguageDetector)
@@ -10,7 +15,7 @@ i18n
   .init({
     fallbackLng: 'en',
     backend: {
-      loadPath: './i18n/{{lng}}/translation.json',
+      loadPath,
     },
     debug:
       process.env.NODE_ENV === 'development' ||
diff --git a/src/main.dev.ts b/src/main.dev.ts
index 15acab98d..67431ee0d 100644
--- a/src/main.dev.ts
+++ b/src/main.dev.ts
@@ -308,6 +308,12 @@ const createWindow = async () => {
     ? path.join(process.resourcesPath, 'devices')
     : path.join(__dirname, '../devices');
 
+  const localesPath = app.isPackaged
+    ? path.join(process.resourcesPath, 'i18n')
+    : path.join(__dirname, 'i18n');
+
+  logger.log('localesPath', { localesPath });
+
   logger.log('local api server PATH', {
     PATH,
   });
@@ -332,6 +338,7 @@ const createWindow = async () => {
       targetsStoragePath,
       userDefinesStoragePath,
       userDataPath: app.getPath('userData'),
+      localesPath,
     },
     logger,
     port
@@ -364,10 +371,11 @@ const createWindow = async () => {
     }
   });
 
-  const apiUrl = `http://localhost:${port}/graphql`;
+  const baseUrl = `http://localhost:${port}`;
+  const apiUrl = `${baseUrl}/graphql`;
   const subscriptionsUrl = `ws://localhost:${port}/graphql`;
   mainWindow.loadURL(
-    `file://${__dirname}/index.html?api_url=${apiUrl}&subscriptions_url=${subscriptionsUrl}`
+    `file://${__dirname}/index.html?base_url=${baseUrl}&api_url=${apiUrl}&subscriptions_url=${subscriptionsUrl}`
   );
 
   // TODO: Use 'ready-to-show' event