Fixed language switch problem

lib/SvelteUi/app/src/App.svelte

@@ -1,6 +1,7 @@
 <script>
   import { Router, Route, navigate } from "svelte-navigator";
   import { getSysinfo, sysinfoStore, dataStore } from './lib/DataStores.js';
+  import { translationsStore, getTranslations } from "./lib/TranslationService.js";
   import Favicon from './assets/favicon.svg'; // Need this for the build
   import Header from './lib/Header.svelte';
   import Dashboard from './lib/Dashboard.svelte';
@@ -16,6 +17,11 @@
   let basepath = document.getElementsByTagName('base')[0].getAttribute("href");
   if(!basepath) basepath = "/";
 
+  let translations = {};
+  translationsStore.subscribe(update => {
+    translations = update;
+  });
+
   let sysinfo = {};
   sysinfoStore.subscribe(update => {
     sysinfo = update;
@@ -42,6 +48,10 @@
             document.documentElement.classList.remove('dark')
         }
     }
+
+    if(sysinfo.ui.lang && sysinfo.ui.lang != translations?.language?.code) {
+      getTranslations(sysinfo.ui.lang);
+    }
   });
   getSysinfo();
   let data = {};

lib/SvelteUi/app/src/app.postcss

@@ -6,7 +6,7 @@
   @apply bg-violet-600 p-1 rounded-md mx-2 dark:bg-violet-900
 }
 
-.gh-logo {
+.logo {
   width: 2rem;
   height: 2rem;
 }

lib/SvelteUi/app/src/lib/ConfigurationPanel.svelte

@@ -177,11 +177,6 @@
                 s.net.gw = formData.get('ng');
                 s.net.dns1 = formData.get('nd');
             }
-            return s;
-        });
-
-        sysinfoStore.update(s => {
-            s.booting = res.reboot;
             s.ui = configuration.u;
             return s;
         });
@@ -258,6 +253,7 @@
         if(configuration.u.lang == 'hub') {
             const response = await fetchWithTimeout("http://hub.amsleser.no/hub/language/list.json");
             languages = (await response.json())
+            configuration.u.lang = translations.language.code;
         }
     }
 

lib/SvelteUi/app/src/lib/Header.svelte

@@ -72,7 +72,7 @@
         {/if}
       <div class="flex-auto p-2 flex flex-row-reverse flex-wrap">
           <div class="flex-none">
-            <a class="float-right" href='https://github.com/UtilitechAS/amsreader-firmware' target='_blank' rel="noreferrer" aria-label="GitHub"><img class="gh-logo" src={(basepath + FavIco).replace('//','/')} alt="GitHub repo"/></a>
+            <a class="float-right" href='https://github.com/UtilitechAS/amsreader-firmware' target='_blank' rel="noreferrer" aria-label="GitHub"><img class="logo" src={(basepath + FavIco).replace('//','/')} alt="GitHub repo"/></a>
           </div>
           <div class="flex-none my-auto px-2">
             <Clock timestamp={ data.c ? new Date(data.c * 1000) : new Date(0) } offset={sysinfo.clock_offset} fullTimeColor="text-red-500" />

lib/SvelteUi/app/src/lib/TranslationService.js

@@ -3,8 +3,8 @@ import { fetchWithTimeout } from './DataStores';
 
 let translations = false;
 export const translationsStore = writable(translations);
-async function getTranslations() {
-    const response = await fetchWithTimeout("translations.json");
+export async function getTranslations(lang) {
+    const response = await fetchWithTimeout("translations.json" + (lang ? "?lang=" + lang : ""));
     translations = (await response.json())
     translationsStore.set(translations);
 };

lib/SvelteUi/src/AmsWebServer.cpp

@@ -1174,6 +1174,7 @@ void AmsWebServer::translationsJson() {
 			lang = String(ui.language);
 		}
 	}
+	if(debugger->isActive(RemoteDebug::DEBUG)) debugger->printf_P(PSTR("Sending translation file for language: %s\n"), lang.c_str());
 
 	snprintf_P(buf, BufferSize, PSTR("/translations-%s.json"), lang.c_str());
 	if(!LittleFS.exists(buf)) {
@@ -1181,6 +1182,7 @@ void AmsWebServer::translationsJson() {
 		notFound();
 		return;
 	}
+	if(debugger->isActive(RemoteDebug::DEBUG)) debugger->printf_P(PSTR("Language file %s\n"), buf);
 
 //	server.sendHeader(HEADER_CACHE_CONTROL, CACHE_1DA);
 	server.sendHeader(HEADER_CACHE_CONTROL, CACHE_CONTROL_NO_CACHE);