.

Author: hydropix

src/api/blueprints/config_routes.py

@@ -47,12 +47,18 @@ def get_config_path():
     logger.setLevel(logging.DEBUG)
 
 
-def create_config_blueprint():
-    """Create and configure the config blueprint"""
+def create_config_blueprint(server_session_id=None):
+    """Create and configure the config blueprint
+
+    Args:
+        server_session_id: Server session ID from state manager (optional, generates new if not provided)
+    """
     bp = Blueprint('config', __name__)
 
-    # Store server startup time to detect restarts
-    startup_time = int(time.time())
+    # Store server startup time/session ID to detect restarts
+    # Use provided session_id from state_manager if available, otherwise generate new
+    # Ensure it's an integer for consistency with health check response
+    startup_time = int(server_session_id) if server_session_id else int(time.time())
 
     @bp.route('/')
     def serve_interface():
@@ -73,7 +79,8 @@ def health_check():
             "translate_module": "loaded",
             "ollama_default_endpoint": DEFAULT_OLLAMA_API_ENDPOINT,
             "supported_formats": ["txt", "epub", "srt"],
-            "startup_time": startup_time  # Used to detect server restarts
+            "startup_time": startup_time,  # Used to detect server restarts
+            "session_id": startup_time  # Alias for compatibility with LifecycleManager
         })
 
     @bp.route('/api/models', methods=['GET', 'POST'])

src/api/routes.py

@@ -35,7 +35,8 @@ def configure_routes(app, state_manager, output_dir, start_translation_job, sock
     """
 
     # Register config and health check routes
-    config_bp = create_config_blueprint()
+    # Pass server_session_id from state_manager to ensure consistency
+    config_bp = create_config_blueprint(server_session_id=state_manager.server_session_id)
     app.register_blueprint(config_bp)
 
     # Register translation management routes

src/api/translation_state.py

@@ -11,8 +11,9 @@
 
 
 def generate_server_session_id() -> str:
-    """Generate a unique session ID for this server instance."""
-    return str(uuid.uuid4())
+    """Generate a unique session ID for this server instance using timestamp."""
+    import time
+    return str(int(time.time()))
 
 
 class TranslationStateManager:

src/web/static/js/core/settings-manager.js

@@ -10,7 +10,29 @@ import { ApiClient } from './api-client.js';
 import { DomHelpers } from '../ui/dom-helpers.js';
 import { MessageLogger } from '../ui/message-logger.js';
 
-const STORAGE_KEY = 'tbl_user_preferences';
+// Storage configuration with versioning
+const STORAGE_VERSION = 1;
+const STORAGE_KEY_PREFIX = 'tbl_user_preferences';
+const STORAGE_KEY = `${STORAGE_KEY_PREFIX}_v${STORAGE_VERSION}`;
+
+/**
+ * Validate user preferences structure
+ * @param {any} data - Data to validate
+ * @returns {boolean} True if valid
+ */
+function validatePreferences(data) {
+    if (!data || typeof data !== 'object') return false;
+
+    // Check version
+    if (!('version' in data)) return false;
+
+    // Validate types for known fields (non-exhaustive, just critical ones)
+    if ('ttsEnabled' in data && typeof data.ttsEnabled !== 'boolean') return false;
+    if ('textCleanup' in data && typeof data.textCleanup !== 'boolean') return false;
+    if ('refineTranslation' in data && typeof data.refineTranslation !== 'boolean') return false;
+
+    return true;
+}
 
 /**
  * Flag to prevent localStorage from overriding .env default model
@@ -58,6 +80,9 @@ export const SettingsManager = {
      * Initialize settings manager - load saved preferences and setup auto-save
      */
     initialize() {
+        // Clean up old storage versions
+        this.cleanupOldStorageVersions();
+
         this.loadLocalPreferences();
         // Setup auto-save listeners after a short delay to avoid triggering during initial load
         setTimeout(() => {
@@ -66,6 +91,41 @@ export const SettingsManager = {
         }, 500);
     },
 
+    /**
+     * Clean up old localStorage versions
+     */
+    cleanupOldStorageVersions() {
+        try {
+            // Remove old non-versioned key
+            const oldKey = 'tbl_user_preferences';
+            if (localStorage.getItem(oldKey)) {
+                // Migrate data from old key before removing
+                const oldData = localStorage.getItem(oldKey);
+                if (oldData) {
+                    try {
+                        const parsed = JSON.parse(oldData);
+                        // Add version and save to new key
+                        parsed.version = STORAGE_VERSION;
+                        localStorage.setItem(STORAGE_KEY, JSON.stringify(parsed));
+                    } catch (e) {
+                        console.warn('Could not migrate old preferences:', e);
+                    }
+                }
+                localStorage.removeItem(oldKey);
+            }
+
+            // Remove any other versions (future-proofing)
+            for (let i = 0; i < STORAGE_VERSION; i++) {
+                const oldVersionKey = `${STORAGE_KEY_PREFIX}_v${i}`;
+                if (localStorage.getItem(oldVersionKey)) {
+                    localStorage.removeItem(oldVersionKey);
+                }
+            }
+        } catch (error) {
+            console.warn('Failed to cleanup old storage versions:', error);
+        }
+    },
+
     /**
      * Setup event listeners for auto-save on all settings elements
      * @private
@@ -140,8 +200,30 @@ export const SettingsManager = {
     getLocalPreferences() {
         try {
             const stored = localStorage.getItem(STORAGE_KEY);
-            return stored ? JSON.parse(stored) : {};
-        } catch {
+
+            if (!stored) return {};
+
+            const parsed = JSON.parse(stored);
+
+            // Validate structure
+            if (!validatePreferences(parsed)) {
+                console.warn('Invalid preferences structure, resetting to defaults');
+                localStorage.removeItem(STORAGE_KEY);
+                return {};
+            }
+
+            // Check version compatibility
+            if (parsed.version !== STORAGE_VERSION) {
+                console.warn(`Preferences version mismatch (found ${parsed.version}, expected ${STORAGE_VERSION})`);
+                // Could implement migration here in the future
+                localStorage.removeItem(STORAGE_KEY);
+                return {};
+            }
+
+            return parsed;
+        } catch (error) {
+            console.error('Failed to load preferences from localStorage:', error);
+            MessageLogger.addLog('⚠️ Could not load saved preferences');
             return {};
         }
     },
@@ -153,10 +235,23 @@ export const SettingsManager = {
     saveLocalPreferences(prefs) {
         try {
             const current = this.getLocalPreferences();
-            const updated = { ...current, ...prefs };
+            const updated = {
+                ...current,
+                ...prefs,
+                version: STORAGE_VERSION,
+                timestamp: Date.now()
+            };
+
             localStorage.setItem(STORAGE_KEY, JSON.stringify(updated));
-        } catch {
-            // Preference save failed silently
+        } catch (error) {
+            console.error('Failed to save preferences to localStorage:', error);
+
+            // Check if it's a quota exceeded error
+            if (error.name === 'QuotaExceededError') {
+                MessageLogger.addLog('⚠️ Browser storage full, could not save preferences');
+            } else {
+                MessageLogger.addLog('⚠️ Failed to save preferences');
+            }
         }
     },
 

src/web/static/js/index.js

@@ -377,7 +377,7 @@ function wireModuleEvents() {
 /**
  * Initialize all modules in proper order
  */
-function initializeModules() {
+async function initializeModules() {
 
     // 1. Core infrastructure
     initializeState();
@@ -399,7 +399,9 @@ function initializeModules() {
     FileManager.initialize();
 
     // 5. Translation modules
-    TranslationTracker.initialize();
+    // IMPORTANT: await TranslationTracker.initialize() because it's now async
+    // It needs to check server session before restoring state
+    await TranslationTracker.initialize();
     ProgressManager.reset();
     ResumeManager.initialize();
 
@@ -828,10 +830,14 @@ if (typeof window !== 'undefined') {
  * Start application when DOM is ready
  */
 if (document.readyState === 'loading') {
-    document.addEventListener('DOMContentLoaded', initializeModules);
+    document.addEventListener('DOMContentLoaded', async () => {
+        await initializeModules();
+    });
 } else {
-    // DOM already loaded
-    initializeModules();
+    // DOM already loaded - initialize immediately
+    (async () => {
+        await initializeModules();
+    })();
 }
 
 // ========================================

src/web/static/js/translation/batch-controller.js

@@ -123,6 +123,17 @@ export const BatchController = {
      * Start batch translation
      */
     async startBatchTranslation() {
+        // Wait for TranslationTracker to be fully initialized
+        if (!TranslationTracker.isInitialized || !TranslationTracker.isInitialized()) {
+            console.warn('TranslationTracker not yet initialized, waiting...');
+            // Wait a bit and try again
+            await new Promise(resolve => setTimeout(resolve, 100));
+            if (!TranslationTracker.isInitialized || !TranslationTracker.isInitialized()) {
+                MessageLogger.showMessage('⚠️ System still initializing, please wait...', 'warning');
+                return;
+            }
+        }
+
         const isBatchActive = StateManager.getState('translation.isBatchActive') || false;
         const filesToProcess = StateManager.getState('files.toProcess') || [];
 
@@ -295,6 +306,25 @@ export const BatchController = {
             fileToTranslate.translationId = data.translation_id;
             updateFileStatusInList(fileToTranslate.name, 'Submitted', data.translation_id);
 
+            // Show progress section immediately (don't wait for WebSocket)
+            // Use requestAnimationFrame to ensure immediate DOM update
+            DomHelpers.show('progressSection');
+            DomHelpers.show('interruptBtn');
+
+            // Force immediate DOM render
+            requestAnimationFrame(() => {
+                const progressSection = DomHelpers.getElement('progressSection');
+                if (progressSection) {
+                    progressSection.style.display = 'block';
+                }
+            });
+
+            // Update title immediately
+            this.updateTranslationTitle(fileToTranslate);
+
+            // Show initial message
+            MessageLogger.addLog(`⏳ Translation submitted for ${fileToTranslate.name}...`);
+
             // Remove file from processing list immediately when translation starts
             this.removeFileFromProcessingList(fileToTranslate.name);