fix: corrections UI — indicateur voute, couleurs, statut IA, spinner éditeur

1. Suppression du badge vault-context-pill doublon en mobile
2. Couleurs dynamiques indicateur header:
   - Bleu pour 'All' (.vault-ctx-all)
   - Mauve/violet pour les vaults (.vault-ctx-vault)
   - Jaune/ambre pour les répertoires (.vault-ctx-dir)
3. Statut IA: vérifie la présence du toolbar AI dans le DOM
   au lieu d'appeler /api/ai/status (qui ne fonctionnait pas)
4. Indicateur de traitement AI dans l'éditeur (spinner + badge
   'AI...' dans le header de l'editor modal) au lieu du flash
   blanc sur le badge sync

frontend/js/ai.js

@@ -368,6 +368,10 @@ export async function createAIToolbar(container, getEditorView) {
       return;
     }
     showToast('⏳ AI: traitement en cours...', 'info');
+
+    // Show processing indicator in the editor header
+    _showProcessingIndicator(true);
+
     // Dispatch AI processing start event
     document.dispatchEvent(new CustomEvent('ai-processing-start', { detail: { endpoint, mode } }));
     try {
@@ -384,10 +388,30 @@ export async function createAIToolbar(container, getEditorView) {
         showToast('AI: ' + msg, 'error');
       }
     } finally {
+      _showProcessingIndicator(false);
       // Dispatch AI processing end event
       document.dispatchEvent(new CustomEvent('ai-processing-end'));
     }
   }
+
+  // ── In-editor processing indicator ──
+  function _showProcessingIndicator(show) {
+    let el = document.getElementById('ai-processing-indicator');
+    if (show) {
+      if (!el) {
+        el = document.createElement('span');
+        el.id = 'ai-processing-indicator';
+        el.className = 'ai-processing-indicator';
+        el.innerHTML = '<span class="ai-spinner"></span> AI...';
+        el.title = 'Traitement AI en cours';
+        const header = document.querySelector('#editor-modal .editor-header');
+        if (header) header.appendChild(el);
+      }
+      el.style.display = 'inline-flex';
+    } else if (el) {
+      el.style.display = 'none';
+    }
+  }
   // ── Keyboard shortcut Ctrl+J for inline completion ──
   document.addEventListener('keydown', (e) => {
     if (e.ctrlKey && e.key === 'j') {

frontend/js/sidebar.js

@@ -72,6 +72,16 @@ function syncVaultSelectors() {
   if (contextText) {
     contextText.textContent = state.selectedContextVault === "all" ? "All" : state.selectedContextVault;
   }
+  // Apply color class to the indicator
+  const indicator = document.getElementById("vault-context-indicator");
+  if (indicator) {
+    indicator.classList.remove("vault-ctx-all", "vault-ctx-vault", "vault-ctx-dir");
+    if (state.selectedContextVault === "all") {
+      indicator.classList.add("vault-ctx-all");
+    } else {
+      indicator.classList.add("vault-ctx-vault");
+    }
+  }
 }
 
 /**

frontend/js/sync.js

@@ -339,15 +339,15 @@ function _renderSyncPanel(panel) {
 let _aiProcessing = false;
 let _aiConfigured = null; // null = unknown, true/false
 
-/** Check if AI is configured by calling the status endpoint. */
-async function _checkAIStatus() {
-  try {
-    const resp = await api('/api/ai/status');
-    console.log('[AI Status] API response:', resp);
-    _aiConfigured = !!(resp && resp.configured);
-  } catch (e) {
-    console.error('[AI Status] API call failed:', e);
-    _aiConfigured = false;
+/** Check if AI is configured by looking for the AI toolbar in the DOM.
+ *  The toolbar is only rendered when the AI API responds successfully. */
+function _checkAIStatus() {
+  const container = document.getElementById('ai-toolbar-container');
+  if (container && container.children.length > 0) {
+    _aiConfigured = true;
+  } else if (_aiConfigured === null) {
+    // Keep unknown state until we have evidence
+    _aiConfigured = null;
   }
 }
 
@@ -404,7 +404,10 @@ function _updateAIStatusInPanel() {
   }
 }
 
-/** Flash the sync badge white during AI processing. */
+/** Flash the sync badge white during AI processing.
+ *  NOTE: now handled via CSS class on #sync-badge.
+ *  The visual flash in the editor itself is handled by ai.js
+ *  which adds a processing indicator inline. */
 function _setBadgeAIProcessing(active) {
   const badge = document.getElementById('sync-badge');
   if (!badge) return;
@@ -435,7 +438,8 @@ function _initAIStatus() {
   if (badge) {
     const origClick = badge.onclick;
     badge.addEventListener('click', () => {
-      _checkAIStatus().then(() => _updateAIStatusInPanel());
+      _checkAIStatus();
+      _updateAIStatusInPanel();
     }, { once: false });
   }
 }