fixed SPA

web/automation.js

@@ -1,4 +1,6 @@
 (function () {
+  let active = false;
+  let initialized = false;
   const API_URL = (() => {
     if (window.API_URL) return window.API_URL;
     try {
@@ -455,6 +457,7 @@
   }
 
   async function loadRequests() {
+    if (!active) return;
     if (!state.loading) {
       setStatus(listStatus, 'Lade Automationen...');
     }
@@ -511,6 +514,7 @@
   }
 
   function updateRelativeTimes() {
+    if (!active) return;
     renderHero();
     if (!requestTableBody || !state.requests.length) return;
     const byId = new Map(state.requests.map((req) => [String(req.id), req]));
@@ -1105,9 +1109,16 @@
   }
 
   function handleSseMessage(payload) {
+    if (!active) return;
     if (!payload || !payload.type) return;
+    const { type, request_id: requestId } = payload;
     switch (payload.type) {
       case 'automation-run':
+        loadRequests();
+        if (requestId && state.selectedId && String(requestId) === String(state.selectedId)) {
+          loadRuns(state.selectedId);
+        }
+        break;
       case 'automation-upsert':
         loadRequests();
         break;
@@ -1117,6 +1128,7 @@
   }
 
   function startSse() {
+    if (!active) return;
     if (sse || typeof EventSource === 'undefined') return;
     try {
       sse = new EventSource(`${API_URL}/events`, { withCredentials: true });
@@ -1143,19 +1155,33 @@
     });
   }
 
-  function init() {
-    applyPresetDisabling();
-    resetForm();
-    loadRequests();
+  function ensureRelativeTimer() {
     if (!relativeTimer) {
       updateRelativeTimes();
       relativeTimer = setInterval(updateRelativeTimes, 60000);
-      document.addEventListener('visibilitychange', () => {
-        if (!document.hidden) {
-          updateRelativeTimes();
-        }
-      });
     }
+  }
+
+  function cleanup(options = {}) {
+    const { keepActive = false } = options;
+    if (!keepActive) {
+      active = false;
+    }
+    if (relativeTimer) {
+      clearInterval(relativeTimer);
+      relativeTimer = null;
+    }
+    if (sse) {
+      sse.close();
+      sse = null;
+    }
+  }
+
+  function init() {
+    if (initialized) return;
+    applyPresetDisabling();
+    resetForm();
+    ensureRelativeTimer();
 
     form.addEventListener('submit', handleSubmit);
     intervalPreset.addEventListener('change', applyPresetDisabling);
@@ -1217,8 +1243,32 @@
         }
       }
     });
-    startSse();
+    document.addEventListener('visibilitychange', () => {
+      if (document.hidden) {
+        cleanup({ keepActive: true });
+      } else {
+        if (active) {
+          ensureRelativeTimer();
+          startSse();
+        }
+      }
+    });
+    window.addEventListener('beforeunload', cleanup);
+    window.addEventListener('pagehide', cleanup);
+    window.addEventListener('unload', cleanup);
+    initialized = true;
   }
 
-  init();
+  function activate() {
+    init();
+    active = true;
+    ensureRelativeTimer();
+    startSse();
+    loadRequests();
+  }
+
+  window.AutomationPage = {
+    activate,
+    deactivate: cleanup
+  };
 })();