feat(ui): show live scan progress and ETA for cache refresh

Broadcast typed scan_progress messages over /ws/fetch-progress from the
manual refresh/rebuild paths of ModelScanner and RecipeScanner, and
render percent, processed/total, current file name and an EMA-smoothed
ETA in the loading overlay. Hardcoded refresh strings move to i18n
(common.scanProgress); WS connection failure falls back to the previous
static loading behavior.

static/js/api/recipeApi.js

@@ -1,7 +1,12 @@
 import { RecipeCard } from '../components/RecipeCard.js';
 import { state, getCurrentPageState } from '../state/index.js';
 import { showToast } from '../utils/uiHelpers.js';
+import { translate } from '../utils/i18nHelpers.js';
 import { captureScrollPosition, restoreScrollPosition } from '../utils/infiniteScroll.js';
+import { WS_ENDPOINTS } from './apiConfig.js';
+// Import from the dependency-light utils module, not baseModelApi.js, to
+// avoid the baseModelApi <-> modelApiFactory import cycle on this page.
+import { createScanEtaTracker } from '../utils/scanEtaUtils.js';
 
 const RECIPE_ENDPOINTS = {
     list: '/api/lm/recipes',
@@ -333,11 +338,53 @@ export async function syncChanges() {
 }
 
 export async function refreshRecipes(fullRebuild = true) {
-    const actionLabel = fullRebuild ? 'Rebuilding recipe cache' : 'Refreshing recipes';
-    const actionToast = fullRebuild ? 'Full rebuild' : 'Refresh';
+    const actionText = translate(
+        fullRebuild ? 'common.scanProgress.actionFullRebuild' : 'common.scanProgress.actionRefresh',
+        {},
+        fullRebuild ? 'Full rebuild' : 'Refresh'
+    );
+    const actionLowerText = translate(
+        fullRebuild ? 'common.scanProgress.actionRebuildLower' : 'common.scanProgress.actionRefreshLower',
+        {},
+        fullRebuild ? 'rebuild' : 'refresh'
+    );
+    const initialMessage = translate(
+        fullRebuild ? 'common.scanProgress.fullRebuilding' : 'common.scanProgress.refreshing',
+        { type: RECIPE_SIDEBAR_CONFIG.config.displayName },
+        `${fullRebuild ? 'Full rebuild' : 'Refreshing'} Recipes...`
+    );
+    const etaTracker = createScanEtaTracker();
+    let ws = null;
+
+    const handleScanProgress = (data) => {
+        if (typeof data.progress === 'number') {
+            state.loadingManager.setProgress(data.progress);
+        }
+        let statusText = translate(
+            `common.scanProgress.stages.${data.stage}`,
+            { total: data.total },
+            data.stage || ''
+        );
+        if (data.status === 'processing' && data.total > 0) {
+            statusText += ` (${data.processed}/${data.total})`;
+            if (data.current_name) {
+                statusText += ` ${data.current_name}`;
+            }
+            const etaText = etaTracker.update(data.processed, data.total);
+            if (etaText) {
+                statusText += ` | ${etaText}`;
+            }
+        }
+        state.loadingManager.setStatus(statusText);
+    };
 
     try {
-        state.loadingManager.show(`${actionLabel}...`, 0);
+        state.loadingManager.show(initialMessage, 0);
+
+        // Connect to the shared progress channel for live scan updates.
+        // Failure to connect must not block the refresh itself — fall back
+        // to the plain loading indicator.
+        ws = await connectScanProgressSocket(handleScanProgress);
 
         const url = new URL(RECIPE_ENDPOINTS.scan, window.location.origin);
         url.searchParams.append('full_rebuild', fullRebuild);
@@ -356,16 +403,64 @@ export async function refreshRecipes(fullRebuild = true) {
 
         await resetAndReload(false);
 
-        showToast('toast.api.refreshComplete', { action: actionToast }, 'success');
+        showToast('toast.api.refreshComplete', { action: actionText }, 'success');
     } catch (error) {
         console.error('Error refreshing recipes:', error);
-        showToast('toast.api.refreshFailed', { action: fullRebuild ? 'rebuild' : 'refresh', type: 'recipe' }, 'error');
+        showToast('toast.api.refreshFailed', { action: actionLowerText, type: 'recipe' }, 'error');
     } finally {
+        if (ws) {
+            ws.close();
+        }
         state.loadingManager.hide();
         state.loadingManager.restoreProgressBar();
     }
 }
 
+/**
+ * Connect to the shared fetch-progress WebSocket for recipe scan progress.
+ * Returns null when the connection cannot be established (silent fallback).
+ * @param {Function} onScanProgress - Handler for scan_progress messages
+ * @returns {Promise<WebSocket|null>}
+ */
+async function connectScanProgressSocket(onScanProgress) {
+    let socket = null;
+    try {
+        const wsProtocol = window.location.protocol === 'https:' ? 'wss://' : 'ws://';
+        socket = new WebSocket(`${wsProtocol}${window.location.host}${WS_ENDPOINTS.fetchProgress}`);
+
+        await new Promise((resolve, reject) => {
+            socket.onopen = resolve;
+            socket.onerror = reject;
+        });
+
+        socket.onmessage = (event) => {
+            let data;
+            try {
+                data = JSON.parse(event.data);
+            } catch (parseError) {
+                return;
+            }
+            // Only handle recipe scan progress; other operations share this
+            // channel and must be ignored.
+            if (data.type !== 'scan_progress' || data.model_type !== 'recipe') {
+                return;
+            }
+            onScanProgress(data);
+        };
+
+        return socket;
+    } catch (error) {
+        if (socket) {
+            try {
+                socket.close();
+            } catch (closeError) {
+                // Ignore close errors during fallback
+            }
+        }
+        return null;
+    }
+}
+
 /**
  * Load more recipes with pagination - updated to work with VirtualScroller
  * @param {boolean} resetPage - Whether to reset to the first page