wip: local portal changes (backup before disk cleanup)

invoice-extractor/static/app.js

@@ -28,7 +28,7 @@
     try {
       const fd = new FormData();
       fd.append("file", file);
-      const r = await fetch("/api/upload", { method: "POST", body: fd });
+      const r = await fetch("api/upload", { method: "POST", body: fd });
       if (!r.ok) throw new Error((await r.json()).detail || r.statusText);
       const json = await r.json();
       state.jobId = json.job_id;
@@ -329,12 +329,12 @@
   $("export-btn").addEventListener("click", async () => {
     if (!state.jobId) return;
     // Persist edits server-side before downloading
-    await fetch(`/api/save/${state.jobId}`, {
+    await fetch(`api/save/${state.jobId}`, {
       method: "POST",
       headers: {"Content-Type": "application/json"},
       body: JSON.stringify({data: state.data}),
     }).catch(() => {});
-    window.location.href = `/api/export/${state.jobId}`;
+    window.location.href = `api/export/${state.jobId}`;
   });
 
   $("restart-btn").addEventListener("click", () => {

invoice-extractor/static/index.html

@@ -4,40 +4,77 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Extrakce faktur | Colsys AI</title>
+  <base href="/apps/faktury/">
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&display=swap">
-  <link rel="stylesheet" href="/static/styles.css">
-  <link rel="stylesheet" href="/static/extra.css">
+  <link rel="stylesheet" href="static/styles.css">
+  <link rel="stylesheet" href="static/extra.css">
   <script>
+    // Theme bootstrap — read source-of-truth in this order:
+    //   ?theme= URL  →  portal_theme cookie  →  app_theme localStorage  →  OS
+    // The cookie is set by the portal landing on every resolvedTheme change,
+    // so it always reflects the portal's current state.
     (function () {
       var t = null;
       try {
         var p = new URL(window.location.href).searchParams.get("theme");
         if (p === "dark" || p === "light") t = p;
       } catch (e) {}
-      if (!t) { try { t = localStorage.getItem("app_theme"); } catch (e) {} }
       if (!t) {
         var m = document.cookie.match(/(?:^|;\s*)portal_theme=([^;]+)/);
         if (m) t = decodeURIComponent(m[1]);
       }
+      if (!t) { try { t = localStorage.getItem("app_theme"); } catch (e) {} }
+      if (!t && typeof matchMedia !== "undefined") {
+        try {
+          t = matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+        } catch (e) {}
+      }
       if (t === "dark" || t === "light") {
         document.documentElement.classList.add(t);
         try { localStorage.setItem("app_theme", t); } catch (e) {}
       }
     })();
+    // bfcache rehydration — re-sync the class when the page is restored
+    // (e.g. user toggled theme on the portal, then hit Back).
+    // Same as pageshow, but fires when the user switches tabs.
+    // Covers: portal tab toggles theme → user comes back to app tab.
+    document.addEventListener("visibilitychange", function () {
+      if (document.visibilityState !== "visible") return;
+      var m = document.cookie.match(/(?:^|;\s*)portal_theme=([^;]+)/);
+      if (!m) return;
+      var t = decodeURIComponent(m[1]);
+      if (t !== "dark" && t !== "light") return;
+      var cls = document.documentElement.classList;
+      if (cls.contains(t)) return;
+      cls.remove(t === "dark" ? "light" : "dark");
+      cls.add(t);
+      try { localStorage.setItem("app_theme", t); } catch (e) {}
+    });
+    window.addEventListener("pageshow", function () {
+      var m = document.cookie.match(/(?:^|;\s*)portal_theme=([^;]+)/);
+      if (!m) return;
+      var t = decodeURIComponent(m[1]);
+      if (t !== "dark" && t !== "light") return;
+      var cls = document.documentElement.classList;
+      if (cls.contains(t)) return;
+      cls.remove(t === "dark" ? "light" : "dark");
+      cls.add(t);
+      try { localStorage.setItem("app_theme", t); } catch (e) {}
+    });
   </script>
 </head>
 <body>
 
 <header class="header">
   <div class="header-inner">
-    <a href="https://ai.klas.chat" class="brand">
+    <a href="/" class="brand">
       <span class="brand-icon">C</span>
       <span class="brand-name">Colsys <span class="brand-ai">AI</span></span>
     </a>
     <span class="header-crumb">Extrakce faktur</span>
-    <a href="https://ai.klas.chat" class="back-link" title="Zpět na portál">
+    <a href="/" class="back-link" title="Zpět na portál">
       <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
         <path d="m15 18-6-6 6-6"/>
       </svg>
@@ -101,6 +138,6 @@
 
 </main>
 
-<script src="/static/app.js"></script>
+<script src="static/app.js"></script>
 </body>
 </html>