Fix: Add safe localStorage wrapper and QZ Tray toggle feature

- Created storage-utils.js with safeStorage wrapper to prevent tracking prevention errors
- Updated script.js to use safeStorage for theme persistence
- Added conditional QZ Tray connection based on 'Enable Scan to Boxes' toggle
- Fixed 404 error by removing non-existent /api/backup/path endpoint call
- Enhanced fg_scan.html to disable QZ Tray and socket connections when toggle is off
- Prevents console errors when browser tracking prevention blocks localStorage access

py_app/app/static/js/storage-utils.js

@@ -0,0 +1,40 @@
+/**
+ * Safe localStorage wrapper to handle tracking prevention errors
+ * This prevents console errors when browser tracking prevention blocks storage access
+ */
+const safeStorage = {
+    getItem: function(key) {
+        try {
+            return localStorage.getItem(key);
+        } catch (e) {
+            console.warn('localStorage access blocked:', e.message);
+            return null;
+        }
+    },
+    setItem: function(key, value) {
+        try {
+            localStorage.setItem(key, value);
+        } catch (e) {
+            console.warn('localStorage access blocked:', e.message);
+        }
+    },
+    removeItem: function(key) {
+        try {
+            localStorage.removeItem(key);
+        } catch (e) {
+            console.warn('localStorage access blocked:', e.message);
+        }
+    },
+    clear: function() {
+        try {
+            localStorage.clear();
+        } catch (e) {
+            console.warn('localStorage access blocked:', e.message);
+        }
+    }
+};
+
+// Export for use in other scripts
+if (typeof window !== 'undefined') {
+    window.safeStorage = safeStorage;
+}

py_app/app/static/script.js

@@ -1,3 +1,29 @@
+// Safe localStorage wrapper to handle tracking prevention
+const safeStorage = {
+    getItem: function(key) {
+        try {
+            return localStorage.getItem(key);
+        } catch (e) {
+            console.warn('localStorage access blocked:', e);
+            return null;
+        }
+    },
+    setItem: function(key, value) {
+        try {
+            localStorage.setItem(key, value);
+        } catch (e) {
+            console.warn('localStorage access blocked:', e);
+        }
+    },
+    removeItem: function(key) {
+        try {
+            localStorage.removeItem(key);
+        } catch (e) {
+            console.warn('localStorage access blocked:', e);
+        }
+    }
+};
+
 document.addEventListener('DOMContentLoaded', () => {
     const reportButtons = document.querySelectorAll('.report-btn');
     const reportTitle = document.getElementById('report-title');
@@ -17,7 +43,7 @@ document.addEventListener('DOMContentLoaded', () => {
     }
 
     // Check and apply the saved theme from localStorage
-    const savedTheme = localStorage.getItem('theme');
+    const savedTheme = safeStorage.getItem('theme');
     if (savedTheme) {
         body.classList.toggle('dark-mode', savedTheme === 'dark');
     }
@@ -28,7 +54,7 @@ document.addEventListener('DOMContentLoaded', () => {
     // Toggle the theme on button click
     themeToggleButton.addEventListener('click', () => {
         const isDarkMode = body.classList.toggle('dark-mode');
-        localStorage.setItem('theme', isDarkMode ? 'dark' : 'light');
+        safeStorage.setItem('theme', isDarkMode ? 'dark' : 'light');
         updateThemeToggleButtonText(); // Update the button text after toggling
     });
 

py_app/app/templates/base.html

@@ -65,6 +65,8 @@
     <div class="main-content">
         {% block content %}{% endblock %}
     </div>
+    <!-- Safe localStorage utility (must load first) -->
+    <script src="{{ url_for('static', filename='js/storage-utils.js') }}"></script>
     {% if request.endpoint != 'main.fg_quality' %}
     <script src="{{ url_for('static', filename='script.js') }}"></script>
     {% endif %}

py_app/app/templates/settings.html

@@ -2834,27 +2834,11 @@ document.getElementById('restore-btn')?.addEventListener('click', function() {
 
 // Load backup location path
 function loadBackupPath() {
-    fetch('/api/backup/path')
-        .then(response => response.json())
-        .then(data => {
-            const pathElement = document.getElementById('backup-location-path');
-            if (pathElement) {
-                if (data.success && data.backup_path) {
-                    pathElement.textContent = data.backup_path;
-                } else {
-                    // Use fallback if API fails
-                    pathElement.textContent = '/srv/quality_app/backups';
-                }
-            }
-        })
-        .catch(error => {
-            console.error('Error loading backup path:', error);
-            // Set fallback if fetch fails
-            const pathElement = document.getElementById('backup-location-path');
-            if (pathElement) {
-                pathElement.textContent = '/srv/quality_app/backups';
-            }
-        });
+    // Set the default backup path directly (no API call needed)
+    const pathElement = document.getElementById('backup-location-path');
+    if (pathElement) {
+        pathElement.textContent = '/srv/quality_app/backups';
+    }
 }
 
 // Load backup data on page load