From b8818a9becf9f7778318c0da719fd316f2c2e451 Mon Sep 17 00:00:00 2001
From: MasterDraco <masterdraco@gmail.com>
Date: Mon, 10 Mar 2025 17:35:58 +0000
Subject: [PATCH] Fix browser compatibility and update button persistence
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Replaced AbortSignal.timeout() with AbortController for broader browser support
- Fixed promise chaining for proper cleanup of timeout handlers
- Added localStorage persistence for update information
- Made update button display more reliable with forced display styles
- Added ID to version elements for easier targeting
- Improved version number synchronization across UI elements

🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
---
 public/index.html          |  2 +-
 public/js/system-status.js | 62 +++++++++++++++++++++++++++++++++-----
 2 files changed, 56 insertions(+), 8 deletions(-)

diff --git a/public/index.html b/public/index.html
index 18ca109..3b73db7 100644
--- a/public/index.html
+++ b/public/index.html
@@ -658,7 +658,7 @@
                 </div>
                 
                 <div class="text-center mt-4">
-                    <p><strong>Transmission RSS Manager v2.0.10</strong></p>
+                    <p><strong id="about-version">Transmission RSS Manager v2.0.10</strong></p>
                     <p>© 2025 PowerData.dk - All Rights Reserved</p>
                     <p><a href="https://powerdata.dk" target="_blank">Visit PowerData.dk</a></p>
                 </div>
diff --git a/public/js/system-status.js b/public/js/system-status.js
index fce6125..fe93106 100644
--- a/public/js/system-status.js
+++ b/public/js/system-status.js
@@ -33,8 +33,8 @@ function initSystemStatus() {
           }
 
           // Update version in about modal too if it exists
-          const aboutVersionElement = document.querySelector('.text-center.mt-4 strong');
-          if (aboutVersionElement && aboutVersionElement.textContent.includes('Transmission RSS Manager v')) {
+          const aboutVersionElement = document.getElementById('about-version');
+          if (aboutVersionElement) {
             aboutVersionElement.textContent = 'Transmission RSS Manager v' + data.data.version;
           }
           
@@ -55,9 +55,23 @@ function initSystemStatus() {
   }
   
   // Track update check status
-  let updateAvailable = false;
+  let updateAvailable = localStorage.getItem('updateAvailable') === 'true';
   let updateCheckInProgress = false;
   
+  // If we have stored update info, restore it
+  if (updateAvailable) {
+    const currentVersion = localStorage.getItem('currentVersion');
+    const remoteVersion = localStorage.getItem('remoteVersion');
+    
+    if (currentVersion && remoteVersion) {
+      updateStatusElement.innerHTML = '<i class="fas fa-exclamation-circle text-warning"></i> Update available';
+      updateAvailableDiv.classList.remove('d-none');
+      updateAvailableDiv.style.display = 'block'; // Force display
+      updateAvailableDiv.querySelector('span').textContent = 
+        `A new version is available: ${currentVersion} → ${remoteVersion}`;
+    }
+  }
+  
   // Check for updates
   function checkForUpdates() {
     // Don't hide update button if an update is available and we're just refreshing
@@ -79,13 +93,26 @@ function initSystemStatus() {
       showNotification('Update check timed out. Please try again later.', 'warning');
     }, 10000); // 10 second timeout
     
+    // Create a timeout controller
+    const controller = new AbortController();
+    const timeoutId2 = setTimeout(() => controller.abort(), 15000);
+
     fetch(url, {
       headers: authHeaders(),
-      // Add a fetch timeout as well
-      signal: AbortSignal.timeout(15000) // 15 second timeout (available in modern browsers)
+      // Add a fetch timeout using abort controller
+      signal: controller.signal // 15 second timeout
     })
       .then(response => {
+        clearTimeout(timeoutId2);
         clearTimeout(timeoutId);
+        return response;
+      })
+      .catch(error => {
+        clearTimeout(timeoutId2);
+        clearTimeout(timeoutId);
+        throw error;
+      })
+      .then(response => {
         // Better error checking
         if (!response.ok) {
           return response.json().then(data => {
@@ -101,18 +128,27 @@ function initSystemStatus() {
       })
       .then(data => {
         updateCheckInProgress = false;
-        clearTimeout(timeoutId);
         
         if (data.status === 'success') {
           if (data.data && data.data.updateAvailable) {
             updateAvailable = true;
             updateStatusElement.innerHTML = '<i class="fas fa-exclamation-circle text-warning"></i> Update available';
+            
+            // Make update button visible immediately
             updateAvailableDiv.classList.remove('d-none');
+            updateAvailableDiv.style.display = 'block'; // Force display
+            
             updateAvailableDiv.querySelector('span').textContent = 
               `A new version is available: ${data.data.currentVersion} → ${data.data.remoteVersion}`;
+              
+            // Store update info in localStorage to persist across refreshes
+            localStorage.setItem('updateAvailable', 'true');
+            localStorage.setItem('currentVersion', data.data.currentVersion);
+            localStorage.setItem('remoteVersion', data.data.remoteVersion);
           } else {
             updateAvailable = false;
             updateStatusElement.innerHTML = '<i class="fas fa-check-circle text-success"></i> Up to date';
+            localStorage.removeItem('updateAvailable');
           }
         } else {
           // Error status but with a response
@@ -157,14 +193,26 @@ function initSystemStatus() {
       showNotification('Update process timed out. Please try again or check server logs.', 'warning');
     }, 60000); // 60 second timeout for the entire update process
     
+    // Create a timeout controller
+    const updateController = new AbortController();
+    const updateTimeoutId2 = setTimeout(() => updateController.abort(), 45000);
+
     fetch('/api/system/update', {
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',
         ...authHeaders()
       },
-      signal: AbortSignal.timeout(45000) // 45 second timeout
+      signal: updateController.signal // 45 second timeout
     })
+      .then(response => {
+        clearTimeout(updateTimeoutId2);
+        return response;
+      })
+      .catch(error => {
+        clearTimeout(updateTimeoutId2);
+        throw error;
+      })
       .then(response => {
         // Better error checking
         if (!response.ok) {