From f6b07623951a1df09212d8ae9f7406af82062e24 Mon Sep 17 00:00:00 2001
From: Eduardo Robles Elvira <edu@sequentech.io>
Date: Thu, 25 Jan 2024 19:41:07 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9E=20default=20translation=20appears?=
 =?UTF-8?q?=20when=20switching=20language=20for=20the=20first=20time?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Parent issue: https://github.com/sequentech/common-ui/pull/375
---
 app.js                                     | 30 +++++++-
 avBooth/booth-directive/booth-directive.js | 80 ++++++++++++++--------
 2 files changed, 80 insertions(+), 30 deletions(-)

diff --git a/app.js b/app.js
index f89b5b46..e4aab056 100755
--- a/app.js
+++ b/app.js
@@ -61,7 +61,35 @@ angular
           cookieName: 'lang',
           detectLngQS: 'lang',
           lngWhitelist: ['en', 'es', 'gl', 'ca'],
-          resGetPath: '/booth/locales/__lng__.json',
+          ns: {namespaces: ['override', 'locales'], defaultNs: 'override'},
+          fallbackNS: 'locales',
+          resGetPath: '/booth/__ns__/__lng__.json',
+          customLoad: function (lngValue, nsValue, options, loadComplete) {
+            if (nsValue === 'locales') {
+              var url = '/booth/' + nsValue + '/' + lngValue + '.json';
+              var req = new XMLHttpRequest();
+              // Configure it: GET-request for the URL /your/api/endpoint
+              req.open('GET', url, true);
+              req.onload = function() {
+                if (req.status >= 200 && req.status < 300) {
+                    var data = JSON.parse(req.responseText);
+                    var error = null;
+                    loadComplete(/*err*/ null, data);
+                } else {
+                    loadComplete(/*err*/ "Error loading locale at url=" + url, null);
+                }
+              };
+              req.send("");
+            } else if (nsValue === 'override') {
+              if (window.i18nOverride) {
+                loadComplete(/*err*/ null, window.i18nOverride[lngValue]);
+              } else {
+                loadComplete(/*err*/ "Error loading overrides, not found", null);
+              }
+            } else {
+              console.log("unhandled customLoad case for i18next");
+            }
+          },
           defaultLoadingValue: '' // ng-i18next option, *NOT* directly supported by i18next
         },
         ConfigServiceProvider.i18nextInitOptions
diff --git a/avBooth/booth-directive/booth-directive.js b/avBooth/booth-directive/booth-directive.js
index 4868f25c..57b28376 100644
--- a/avBooth/booth-directive/booth-directive.js
+++ b/avBooth/booth-directive/booth-directive.js
@@ -71,36 +71,58 @@ angular.module('avBooth')
 
       // This is used to enable custom css overriding
       scope.allowCustomElectionThemeCss = ConfigService.allowCustomElectionThemeCss;
+      scope.alreadyReloaded = null;
 
-      function reloadTranslations(force, ms) {
-        setTimeout(
-          function () {
-            var election = (
-              scope.state === stateEnum.electionChooserScreen
-            ) ? scope.parentElection : scope.election;
-
-            // reset $window.i18nOverride
-            var overrides = (
-              election &&
-              election.presentation &&
-              election.presentation.i18n_override
-            ) ? election.presentation.i18n_override : null;
-
-            var languagesConf = (
-              election &&
-              election.presentation &&
-              election.presentation.i18n_languages_conf
-            ) ? election.presentation.i18n_languages_conf : null;
-
-            $i18next.options.useLocalStorage = true;
-            I18nOverride(
-              /* overrides = */ overrides,
-              /* force = */ force,
-              /* languagesConf = */ languagesConf
-            );
-          },
-          ms || 0
-        );
+      function reloadTranslations(force) {
+        function reloadInner() {
+          var election = (
+            scope.state === stateEnum.electionChooserScreen
+          ) ? scope.parentElection : scope.election;
+
+          if (scope.alreadyReloaded === election.id) {
+            $i18next.reInit();
+            return;
+          } else {
+            scope.alreadyReloaded = election.id;
+          }
+
+          // reset $window.i18nOverride
+          var overrides = (
+            election &&
+            election.presentation &&
+            election.presentation.i18n_override
+          ) ? election.presentation.i18n_override : null;
+
+          var languagesConf = (
+            election &&
+            election.presentation &&
+            election.presentation.i18n_languages_conf
+          ) ? election.presentation.i18n_languages_conf : null;
+
+          $i18next.options.useLocalStorage = true;
+          I18nOverride(
+            /* overrides = */ overrides,
+            /* force = */ force,
+            /* languagesConf = */ languagesConf
+          );
+        }
+        function timeoutWrap() {
+          console.log("timeoutWrap");
+          var election = (
+            scope.state === stateEnum.electionChooserScreen
+          ) ? scope.parentElection : scope.election;
+
+          if (election && scope.alreadyReloaded === election.id) {
+            return;
+          }
+          if (!election) {
+            console.log("timeoutWrap: delaying..");
+            setTimeout(timeoutWrap, 200);
+          } else {
+            reloadInner();
+          }
+        }
+        timeoutWrap();
       }
 
       function updateWidth() {