Poprawka botto bar i wersje językowe

public/assets/js/modules/orders.js

@@ -1,5 +1,5 @@
 import { endpoints, loaderMinMs } from "./config.js";
-import { getLang, t } from "./i18n.js";
+import { getLang, onLangChange, t } from "./i18n.js";
 import { runPendingProtectedAction, updateNavAccessState } from "./access.js";
 import {
   refreshGuestPendingActions,
@@ -31,6 +31,19 @@ const SIX_MONTHS_MS = 180 * 24 * 60 * 60 * 1000;
 const LOADER_MIN_MS = loaderMinMs;
 const loadStartTime = Date.now();
 
+/** @type {Array} */
+let lastBillsForUi = [];
+let hasRenderedOrders = false;
+
+function escapeHtml(value) {
+  return String(value ?? "")
+    .replace(/&/g, "&")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/"/g, "&quot;")
+    .replace(/'/g, "&#39;");
+}
+
 function getLoaderMsgs() {
   return [t("loader.msg1"), t("loader.msg2"), t("loader.msg3"), t("loader.msg4")];
 }
@@ -56,6 +69,20 @@ if (getTableParam()) {
   tableLabel.textContent = formatTableLabel(getTableParam());
 }
 
+onLangChange(() => {
+  if (tableLabel && getTableParam()) {
+    tableLabel.textContent = formatTableLabel(getTableParam());
+  }
+
+  if (loaderMsg && loadingScreen && !loadingScreen.classList.contains("hidden")) {
+    loaderMsg.textContent = getLoaderMsgs()[msgIdx];
+  }
+
+  if (hasRenderedOrders) {
+    updateUI(lastBillsForUi, { manageLoader: false });
+  }
+});
+
 /** Storage key must follow current hash (fallback: table), not a frozen empty tableParam at init. */
 export function getOrderStorageKey() {
   const key = (getHashParam() || getTableParam() || "unknown").toLowerCase();
@@ -70,7 +97,7 @@ export function hideLoader() {
     clearInterval(msgInterval);
     const bottomNav = document.getElementById("bottomNav");
     if (bottomNav) {
-      bottomNav.style.display = "";
+      bottomNav.hidden = false;
     }
     updateNavAccessState();
     if (getPendingProtectedAction() && getAppAccessLevel() === "full") {
@@ -94,11 +121,15 @@ export async function resolveTableLabel() {
   }
 }
 
-export function updateUI(bills) {
-  // Hide loader after minimum display time
-  hideLoader();
+export function updateUI(bills, { manageLoader = true } = {}) {
+  lastBillsForUi = Array.isArray(bills) ? bills : [];
+  hasRenderedOrders = true;
 
-  const allArticles = bills.flatMap((b) => (Array.isArray(b?.Articles) ? b.Articles : []));
+  if (manageLoader) {
+    hideLoader();
+  }
+
+  const allArticles = lastBillsForUi.flatMap((b) => (Array.isArray(b?.Articles) ? b.Articles : []));
   const items = mergeWithPersistedItems(allArticles);
   renderGlobalHistory();
 
@@ -108,7 +139,7 @@ export function updateUI(bills) {
   }
 
   renderItems(items);
-  updateStatus(bills, items);
+  updateStatus(lastBillsForUi, items);
 }
 
 function showEmptyState() {
@@ -235,14 +266,14 @@ export function renderGlobalHistory() {
     div.className = "item-card archived ready";
     div.innerHTML = `
           <div class="item-info">
-            <span class="item-name">${entry.name}</span>
-            <span class="item-meta">${t("history.entry_meta", {
+            <span class="item-name">${escapeHtml(entry.name)}</span>
+            <span class="item-meta">${escapeHtml(t("history.entry_meta", {
               table: formatTableLabel(entry.sourceTable || "?"),
               date: dt.toLocaleDateString(lang),
               time: dt.toLocaleTimeString(lang, { hour: "2-digit", minute: "2-digit" }),
-            })}</span>
+            }))}</span>
           </div>
-          <div class="item-qty">x${entry.qty}</div>
+          <div class="item-qty">x${escapeHtml(entry.qty)}</div>
         `;
     historyList.appendChild(div);
   });
@@ -326,10 +357,10 @@ function renderItems(items) {
 
     div.innerHTML = `
           <div class="item-info">
-            <span class="item-name">${item.name}</span>
-            <span class="item-meta">${meta}</span>
+            <span class="item-name">${escapeHtml(item.name)}</span>
+            <span class="item-meta">${escapeHtml(meta)}</span>
           </div>
-          <div class="item-qty">x${item.qty}</div>
+          <div class="item-qty">x${escapeHtml(item.qty)}</div>
         `;
     itemsList.appendChild(div);
   });