@in-the-loop-labs/pair-review 1.6.0 → 1.6.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@in-the-loop-labs/pair-review",
-  "version": "1.6.0",
+  "version": "1.6.2",
   "description": "Your AI-powered code review partner - Close the feedback loop with AI coding agents",
   "main": "src/server.js",
   "bin": {

package/plugin/.claude-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "pair-review",
-  "version": "1.6.0",
+  "version": "1.6.2",
   "description": "pair-review app integration — Open PRs and local changes in the pair-review web UI, run server-side AI analysis, and address review feedback. Requires the pair-review MCP server.",
   "author": {
     "name": "in-the-loop-labs",

package/plugin-code-critic/.claude-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "code-critic",
-  "version": "1.6.0",
+  "version": "1.6.2",
   "description": "AI-powered code review analysis — Run three-level AI analysis and implement-review-fix loops directly in your coding agent. Works standalone, no server required.",
   "author": {
     "name": "in-the-loop-labs",

package/public/css/pr.css

@@ -2481,7 +2481,7 @@ tr.newly-expanded .d2h-code-line-ctn {
   background-color: var(--color-bg-secondary);
 }
 
-/* Progress Modal Styles */
+/* Modal Styles */
 .modal-overlay {
   position: fixed;
   top: 0;
@@ -2556,102 +2556,6 @@ tr.newly-expanded .d2h-code-line-ctn {
   overflow-y: auto;
 }
 
-.progress-levels {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-}
-
-.progress-level {
-  display: flex;
-  align-items: flex-start;
-  gap: 12px;
-}
-
-.level-icon {
-  width: 20px;
-  height: 20px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  margin-top: 2px;
-}
-
-.level-icon .icon {
-  font-size: 14px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 16px;
-  height: 16px;
-}
-
-.level-icon .icon.pending {
-  color: #656d76;
-}
-
-.level-icon .icon.active {
-  color: var(--ai-primary, #d97706);
-}
-
-.level-icon .icon.completed {
-  color: #1a7f37;
-}
-
-.level-icon .icon.error {
-  color: #cf222e;
-}
-
-.level-icon .icon.cancelled {
-  color: #9e6a03;
-}
-
-.level-content {
-  flex: 1;
-  min-width: 0;
-}
-
-.level-title {
-  font-size: 14px;
-  font-weight: 600;
-  color: var(--color-text-primary, #24292f);
-  margin-bottom: 4px;
-}
-
-.level-status {
-  font-size: 13px;
-  color: var(--color-text-secondary, #656d76);
-  margin-bottom: 6px;
-}
-
-.level-stream-snippet {
-  font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
-  font-size: 12px;
-  color: var(--color-text-tertiary, #8b949e);
-  background: var(--color-bg-subtle, #f6f8fa);
-  border-radius: 4px;
-  padding: 3px 6px;
-  margin-top: 4px;
-  max-width: 100%;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.level-files {
-  display: flex;
-  gap: 16px;
-  font-size: 13px;
-}
-
-.files-analyzed {
-  color: #1a7f37;
-}
-
-.files-remaining {
-  color: #656d76;
-}
-
 .modal-footer {
   padding: 16px 24px 24px 24px;
   display: flex;
@@ -5069,6 +4973,12 @@ tr.line-range-start .d2h-code-line-ctn {
   border: 1px solid #bf8700;
 }
 
+.toast-info {
+  background-color: #0969da;
+  color: white;
+  border: 1px solid #0550ae;
+}
+
 .toast-content {
   display: flex;
   align-items: center;
@@ -5111,6 +5021,11 @@ tr.line-range-start .d2h-code-line-ctn {
   border-color: #d29922;
 }
 
+[data-theme="dark"] .toast-info {
+  background-color: #1f6feb;
+  border-color: #58a6ff;
+}
+
 /* Loading spinner for buttons */
 .loading-spinner-small {
   width: 16px;

package/public/js/components/AdvancedConfigTab.js

@@ -628,6 +628,7 @@ class AdvancedConfigTab {
 
     // Dirty state tracking via event delegation
     panel.addEventListener('change', (e) => {
+      if (e.target.id === 'council-selector') return; // council selector has its own clean/dirty logic
       if (e.target.matches('select, input[type="checkbox"]') || e.target.classList.contains('adv-timeout')) {
         this._markDirty();
       }

package/public/js/components/CouncilProgressModal.js

@@ -7,8 +7,7 @@
  *   - Voice participants as child rows under each level
  *   - Consolidation section at the bottom
  *
- * Replaces ProgressModal when a council analysis is running.
- * The existing ProgressModal remains for single-model analysis.
+ * Handles both council and single-model analysis modes.
  */
 class CouncilProgressModal {
   constructor() {
@@ -673,6 +672,17 @@ class CouncilProgressModal {
 
     // Derive the parent header state from children
     this._refreshConsolidationHeader(iconEl, statusEl, state);
+
+    // Show stream event text in the snippet element (mirrors _updateSingleModelLevel logic)
+    const snippetEl = section.querySelector('.council-level-snippet');
+    if (snippetEl) {
+      if (state === 'running' && level4Status.streamEvent?.text) {
+        snippetEl.textContent = level4Status.streamEvent.text;
+        snippetEl.style.display = 'block';
+      } else if (state !== 'running') {
+        snippetEl.style.display = 'none';
+      }
+    }
   }
 
   /**
@@ -1128,6 +1138,7 @@ class CouncilProgressModal {
           <span class="council-level-title">Cross-Reviewer Consolidation</span>
           <span class="council-level-status pending">Pending</span>
         </div>
+        <div class="council-level-snippet" style="display: none;"></div>
       </div>
     `;
 
@@ -1188,6 +1199,7 @@ class CouncilProgressModal {
           <span class="council-level-title">Consolidation</span>
           <span class="council-level-status pending">Pending</span>
         </div>
+        <div class="council-level-snippet" style="display: none;"></div>
       </div>
     `;
 
@@ -1327,6 +1339,7 @@ class CouncilProgressModal {
             <span class="council-level-title">Consolidation</span>
             <span class="council-level-status pending">Pending</span>
           </div>
+          <div class="council-level-snippet" style="display: none;"></div>
         </div>
       `;
     }
@@ -1338,6 +1351,7 @@ class CouncilProgressModal {
           <span class="council-level-title">Consolidation</span>
           <span class="council-level-status pending">Pending</span>
         </div>
+        <div class="council-level-snippet" style="display: none;"></div>
         <div class="council-level-children">
     `;
 

package/public/js/components/StatusIndicator.js

@@ -235,8 +235,8 @@ class StatusIndicator {
    * Reopen modal from status indicator
    */
   reopenModal() {
-    if (this.currentAnalysisId && window.progressModal) {
-      window.progressModal.reopenFromBackground();
+    if (this.currentAnalysisId && window.councilProgressModal) {
+      window.councilProgressModal.reopenFromBackground();
     }
   }
 

package/public/js/components/Toast.js

@@ -1,7 +1,7 @@
 // SPDX-License-Identifier: GPL-3.0-or-later
 /**
  * Toast Notification Component
- * Shows temporary success/error messages at the top of the page
+ * Shows temporary success/error/warning/info messages at the top of the page
  */
 class Toast {
   constructor() {
@@ -101,6 +101,27 @@ class Toast {
     this.showToast(toast, duration);
   }
 
+  /**
+   * Show an info toast
+   * @param {string} message - The message to display
+   * @param {number} duration - Duration in ms (default: 5000)
+   */
+  showInfo(message, duration = 5000) {
+    const toast = document.createElement('div');
+    toast.className = 'toast toast-info';
+
+    toast.innerHTML = `
+      <div class="toast-content">
+        <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" class="toast-icon">
+          <path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.5 7.75A.75.75 0 0 1 7.25 7h1a.75.75 0 0 1 .75.75v2.75h.25a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1 0-1.5h.25v-2h-.25a.75.75 0 0 1-.75-.75ZM8 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"></path>
+        </svg>
+        <span class="toast-message">${message}</span>
+      </div>
+    `;
+
+    this.showToast(toast, duration);
+  }
+
   /**
    * Show a toast element
    * @param {HTMLElement} toast - The toast element

package/public/js/components/VoiceCentricConfigTab.js

@@ -547,6 +547,7 @@ class VoiceCentricConfigTab {
 
     // Dirty state tracking
     panel.addEventListener('change', (e) => {
+      if (e.target.id === 'vc-council-selector') return; // council selector has its own clean/dirty logic
       if (e.target.matches('select, input[type="checkbox"]') || e.target.classList.contains('vc-timeout')) {
         this._markDirty();
       }
@@ -859,11 +860,11 @@ class VoiceCentricConfigTab {
     const orchCustomInstructions = orchInstrInput?.value?.trim() || undefined;
     const consolidation = orchRow ? {
       provider: orchRow.querySelector('.voice-provider')?.value || 'claude',
-      model: orchRow.querySelector('.voice-model')?.value || 'sonnet',
+      model: orchRow.querySelector('.voice-model')?.value || 'sonnet-4.6',
       tier: orchRow.querySelector('.voice-tier')?.value || 'balanced',
       timeout: orchTimeout,
       ...(orchCustomInstructions ? { customInstructions: orchCustomInstructions } : {})
-    } : { provider: 'claude', model: 'sonnet', tier: 'balanced', timeout: VoiceCentricConfigTab.DEFAULT_TIMEOUT };
+    } : { provider: 'claude', model: 'sonnet-4.6', tier: 'balanced', timeout: VoiceCentricConfigTab.DEFAULT_TIMEOUT };
 
     return { voices, levels, consolidation };
   }

package/public/js/local.js

@@ -308,7 +308,7 @@ class LocalManager {
       const STALE_TIMEOUT = 2000;
 
       if (manager.isAnalyzing) {
-        manager.reopenProgressModal();
+        manager.reopenModal();
         return;
       }
 
@@ -450,18 +450,17 @@ class LocalManager {
           manager.setButtonAnalyzing(data.analysisId);
 
           // Show the appropriate progress modal
-          if (data.status?.isCouncil && window.councilProgressModal && data.status?.councilConfig) {
+          if (window.councilProgressModal) {
             window.councilProgressModal.setLocalMode(reviewId);
             window.councilProgressModal.show(
               data.analysisId,
-              data.status.councilConfig,
+              data.status?.isCouncil ? data.status.councilConfig : null,
               null,
-              { configType: data.status.configType || 'advanced' }
+              {
+                configType: data.status?.isCouncil ? (data.status.configType || 'advanced') : 'single',
+                enabledLevels: data.status?.enabledLevels || [1, 2, 3]
+              }
             );
-          } else if (window.progressModal) {
-            // Update the SSE endpoint for progress modal
-            self.patchProgressModalForLocal();
-            window.progressModal.show(data.analysisId);
           }
         }
       } catch (error) {
@@ -1030,58 +1029,6 @@ class LocalManager {
     console.log('PRManager patched for local mode');
   }
 
-  /**
-   * Patch ProgressModal to use local SSE endpoint
-   */
-  patchProgressModalForLocal() {
-    const modal = window.progressModal;
-    if (!modal) return;
-
-    const reviewId = this.reviewId;
-    const originalStartMonitoring = modal.startProgressMonitoring.bind(modal);
-
-    modal.startProgressMonitoring = function() {
-      if (modal.eventSource) {
-        modal.eventSource.close();
-      }
-
-      if (!modal.currentAnalysisId) return;
-
-      // Use local SSE endpoint
-      modal.eventSource = new EventSource(`/api/local/${reviewId}/ai-suggestions/status`);
-
-      modal.eventSource.onopen = () => {
-        console.log('Connected to local progress stream');
-      };
-
-      modal.eventSource.onmessage = (event) => {
-        try {
-          const data = JSON.parse(event.data);
-
-          if (data.type === 'connected') {
-            console.log('Local SSE connection established');
-            return;
-          }
-
-          if (data.type === 'progress') {
-            modal.updateProgress(data);
-
-            if (data.status === 'completed' || data.status === 'failed' || data.status === 'cancelled') {
-              modal.stopProgressMonitoring();
-            }
-          }
-        } catch (error) {
-          console.error('Error parsing SSE data:', error);
-        }
-      };
-
-      modal.eventSource.onerror = (error) => {
-        console.error('SSE connection error:', error);
-        modal.fallbackToPolling();
-      };
-    };
-  }
-
   /**
    * Start local AI analysis
    */
@@ -1158,12 +1105,6 @@ class LocalManager {
             enabledLevels: config.enabledLevels || [1, 2, 3]
           }
         );
-      } else {
-        // Fallback to old progress modal if unified modal not available
-        this.patchProgressModalForLocal();
-        if (window.progressModal) {
-          window.progressModal.show(result.analysisId);
-        }
       }
 
     } catch (error) {
@@ -1847,7 +1788,7 @@ class LocalManager {
 
     // Map levels to dot phases
     const phaseMap = {
-      4: 'orchestration', // Orchestration/finalization is level 4 in ProgressModal
+      4: 'orchestration', // Orchestration/finalization is level 4 in progress modal
       1: 'level1',
       2: 'level2',
       3: 'level3'

package/public/js/modules/analysis-history.js

@@ -848,8 +848,10 @@ class AnalysisHistoryManager {
       // Claude models
       'haiku': 'fast',
       'sonnet': 'balanced',
+      'sonnet-4.5': 'balanced',
+      'sonnet-4.6': 'balanced',
       'opus': 'thorough',
-      'opus-4.5': 'balanced',
+      'opus-4.5': 'thorough',
       'opus-4.6-low': 'balanced',
       'opus-4.6-medium': 'balanced',
       'opus-4.6-1m': 'balanced',

package/public/js/pr.js

@@ -3331,7 +3331,7 @@ class PRManager {
 
     // Map levels to dot phases
     const phaseMap = {
-      4: 'orchestration', // Orchestration/finalization is level 4 in ProgressModal
+      4: 'orchestration', // Orchestration/finalization is level 4 in progress modal
       1: 'level1',
       2: 'level2',
       3: 'level3'
@@ -3399,18 +3399,17 @@ class PRManager {
         this.setButtonAnalyzing(data.analysisId);
 
         // Show the appropriate progress modal
-        if (data.status?.isCouncil && window.councilProgressModal && data.status?.councilConfig) {
+        if (window.councilProgressModal) {
           window.councilProgressModal.setPRMode();
           window.councilProgressModal.show(
             data.analysisId,
-            data.status.councilConfig,
+            data.status?.isCouncil ? data.status.councilConfig : null,
             null,
-            { configType: data.status.configType || 'advanced' }
+            {
+              configType: data.status?.isCouncil ? (data.status.configType || 'advanced') : 'single',
+              enabledLevels: data.status?.enabledLevels || [1, 2, 3]
+            }
           );
-        } else if (window.progressModal) {
-          window.progressModal.show(data.analysisId);
-        } else {
-          console.warn('Progress modal not yet initialized');
         }
       }
     } catch (error) {
@@ -3422,17 +3421,12 @@ class PRManager {
   /**
    * Reopen progress modal when button is clicked during analysis
    */
-  reopenProgressModal() {
+  reopenModal() {
     if (!this.currentAnalysisId) return;
 
-    // If the council modal was used for this analysis, reopen it
+    // Reopen the progress modal if it was tracking this analysis
     if (window.councilProgressModal && window.councilProgressModal.currentAnalysisId === this.currentAnalysisId) {
       window.councilProgressModal.reopenFromBackground();
-      return;
-    }
-
-    if (window.progressModal) {
-      window.progressModal.show(this.currentAnalysisId);
     }
   }
 
@@ -3490,7 +3484,7 @@ class PRManager {
   async triggerAIAnalysis() {
     // If analysis is already running, just reopen the progress modal
     if (this.isAnalyzing) {
-      this.reopenProgressModal();
+      this.reopenModal();
       return;
     }
 
@@ -3729,9 +3723,6 @@ class PRManager {
             enabledLevels: config.enabledLevels || [1, 2, 3]
           }
         );
-      } else if (window.progressModal) {
-        // Fallback to old progress modal if unified modal not available
-        window.progressModal.show(result.analysisId);
       }
 
     } catch (error) {

package/public/local.html

@@ -486,7 +486,6 @@
     <script src="/js/components/Toast.js"></script>
     <script src="/js/components/ConfirmDialog.js"></script>
     <script src="/js/components/TextInputDialog.js"></script>
-    <script src="/js/components/ProgressModal.js"></script>
     <script src="/js/components/AnalysisConfigModal.js"></script>
     <script src="/js/components/TimeoutSelect.js"></script>
     <script src="/js/components/VoiceCentricConfigTab.js"></script>

package/public/pr.html

@@ -309,7 +309,6 @@
     <script src="/js/components/Toast.js"></script>
     <script src="/js/components/ConfirmDialog.js"></script>
     <script src="/js/components/TextInputDialog.js"></script>
-    <script src="/js/components/ProgressModal.js"></script>
     <script src="/js/components/AnalysisConfigModal.js"></script>
     <script src="/js/components/TimeoutSelect.js"></script>
     <script src="/js/components/VoiceCentricConfigTab.js"></script>

package/src/ai/analyzer.js

@@ -3561,8 +3561,8 @@ File-level suggestions should NOT have a line number. They apply to the entire f
       }
     }
 
-    // Fallback to claude/sonnet
-    return { provider: 'claude', model: 'sonnet', tier: 'balanced' };
+    // Fallback to claude/sonnet-4.6
+    return { provider: 'claude', model: 'sonnet-4.6', tier: 'balanced' };
   }
 
   /**
@@ -3581,7 +3581,7 @@ File-level suggestions should NOT have a line number. They apply to the entire f
         tier: voices[0].tier || 'balanced'
       };
     }
-    return { provider: 'claude', model: 'sonnet', tier: 'balanced' };
+    return { provider: 'claude', model: 'sonnet-4.6', tier: 'balanced' };
   }
 
   /**

package/src/ai/claude-provider.js

@@ -30,24 +30,25 @@ const CLAUDE_MODELS = [
     badgeClass: 'badge-speed'
   },
   {
-    id: 'sonnet',
+    id: 'sonnet-4.5',
+    cli_model: 'claude-sonnet-4.5',
     name: 'Sonnet 4.5',
     tier: 'balanced',
+    tagline: 'Previous Gen',
+    description: 'Sonnet 4.5 — previous generation balanced model',
+    badge: 'Previous Gen',
+    badgeClass: 'badge-balanced'
+  },
+  {
+    id: 'sonnet-4.6',
+    cli_model: 'claude-sonnet-4-6',
+    name: 'Sonnet 4.6',
+    tier: 'balanced',
     tagline: 'Best Balance',
     description: 'Recommended for most reviews',
     badge: 'Standard',
     badgeClass: 'badge-recommended'
   },
-  {
-    id: 'opus-4.5',
-    cli_model: 'claude-opus-4-5-20251101',
-    name: 'Opus 4.5',
-    tier: 'balanced',
-    tagline: 'Deep Thinker',
-    description: 'Extended thinking for complex analysis',
-    badge: 'Previous Gen',
-    badgeClass: 'badge-power'
-  },
   {
     id: 'opus-4.6-low',
     cli_model: 'opus',
@@ -91,6 +92,16 @@ const CLAUDE_MODELS = [
     description: 'Opus 4.6 high effort with 1M token context window',
     badge: 'More Context',
     badgeClass: 'badge-power'
+  },
+  {
+    id: 'opus-4.5',
+    cli_model: 'claude-opus-4-5-20251101',
+    name: 'Opus 4.5',
+    tier: 'thorough',
+    tagline: 'Deep Thinker',
+    description: 'Extended thinking for complex analysis',
+    badge: 'Previous Gen',
+    badgeClass: 'badge-power'
   }
 ];
 

package/src/ai/stream-parser.js

@@ -3,7 +3,7 @@
  * Stream Parser - Side-channel parser for real-time AI streaming events
  *
  * Reads stdout data incrementally from provider processes and emits normalized
- * events for display in the ProgressModal. This is a read-only side channel;
+ * events for display in the progress modal. This is a read-only side channel;
  * the existing stdout buffering and final JSON extraction remain untouched.
  *
  * Normalized event shape:

package/src/routes/shared.js

@@ -379,7 +379,7 @@ function createProgressCallback(analysisId) {
       currentStatus.levels[4] = {
         status: derivedStatus,
         progress: progressUpdate.progress || (consolidationMatch ? 'Consolidating...' : 'Finalizing results...'),
-        streamEvent: undefined,
+        streamEvent: existing.streamEvent,
         consolidationStep: step,
         steps,
         voices: existingVoices

package/public/js/components/ProgressModal.js

@@ -1,705 +0,0 @@
-// SPDX-License-Identifier: GPL-3.0-or-later
-/**
- * AI Analysis Progress Modal Component
- * Displays three-level progress structure and handles background execution
- */
-class ProgressModal {
-  constructor() {
-    this.modal = null;
-    this.isVisible = false;
-    this.currentAnalysisId = null;
-    this.eventSource = null;
-    this.statusCheckInterval = null;
-    this.isRunningInBackground = false;
-
-    this.createModal();
-    this.setupEventListeners();
-  }
-
-  /**
-   * Create the modal DOM structure
-   */
-  createModal() {
-    // Remove existing modal if it exists
-    const existing = document.getElementById('progress-modal');
-    if (existing) {
-      existing.remove();
-    }
-
-    // Create modal container
-    const modalContainer = document.createElement('div');
-    modalContainer.id = 'progress-modal';
-    modalContainer.className = 'modal-overlay';
-    modalContainer.style.display = 'none';
-    
-    modalContainer.innerHTML = `
-      <div class="modal-backdrop" onclick="progressModal.hide()"></div>
-      <div class="modal-container">
-        <div class="modal-header">
-          <h3>AI Review Analysis</h3>
-          <button class="modal-close-btn" onclick="progressModal.hide()" title="Close">
-            <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
-              <path d="M3.72 3.72a.75.75 0 011.06 0L8 6.94l3.22-3.22a.75.75 0 111.06 1.06L9.06 8l3.22 3.22a.75.75 0 11-1.06 1.06L8 9.06l-3.22 3.22a.75.75 0 01-1.06-1.06L6.94 8 3.72 4.78a.75.75 0 010-1.06z"/>
-            </svg>
-          </button>
-        </div>
-        
-        <div class="modal-body">
-          <div class="progress-levels">
-            <div class="progress-level" id="level-1">
-              <div class="level-icon">
-                <span class="icon pending">○</span>
-              </div>
-              <div class="level-content">
-                <div class="level-title">Level 1: Analyzing diff</div>
-                <div class="level-status">Preparing to start...</div>
-                <div class="progress-bar-container" style="display: none;">
-                  <div class="barbershop-progress-bar">
-                    <div class="barbershop-stripes"></div>
-                  </div>
-                </div>
-                <div class="level-stream-snippet" style="display: none;"></div>
-              </div>
-            </div>
-
-            <div class="progress-level" id="level-2">
-              <div class="level-icon">
-                <span class="icon pending">○</span>
-              </div>
-              <div class="level-content">
-                <div class="level-title">Level 2: File context</div>
-                <div class="level-status">Pending</div>
-                <div class="progress-bar-container" style="display: none;">
-                  <div class="barbershop-progress-bar">
-                    <div class="barbershop-stripes"></div>
-                  </div>
-                </div>
-                <div class="level-stream-snippet" style="display: none;"></div>
-              </div>
-            </div>
-
-            <div class="progress-level" id="level-3">
-              <div class="level-icon">
-                <span class="icon pending">○</span>
-              </div>
-              <div class="level-content">
-                <div class="level-title">Level 3: Codebase context</div>
-                <div class="level-status">Pending</div>
-                <div class="progress-bar-container" style="display: none;">
-                  <div class="barbershop-progress-bar">
-                    <div class="barbershop-stripes"></div>
-                  </div>
-                </div>
-                <div class="level-stream-snippet" style="display: none;"></div>
-              </div>
-            </div>
-
-            <div class="progress-level" id="level-4">
-              <div class="level-icon">
-                <span class="icon pending">○</span>
-              </div>
-              <div class="level-content">
-                <div class="level-title">Finalizing Results</div>
-                <div class="level-status">Pending</div>
-                <div class="progress-bar-container" style="display: none;">
-                  <div class="barbershop-progress-bar">
-                    <div class="barbershop-stripes"></div>
-                  </div>
-                </div>
-                <div class="level-stream-snippet" style="display: none;"></div>
-              </div>
-            </div>
-          </div>
-        </div>
-        
-        <div class="modal-footer">
-          <button class="btn btn-secondary" id="run-background-btn" onclick="progressModal.runInBackground()">
-            Run in Background
-          </button>
-          <button class="btn btn-danger" id="cancel-btn" onclick="progressModal.cancel()">
-            Cancel
-          </button>
-        </div>
-      </div>
-    `;
-
-    document.body.appendChild(modalContainer);
-    this.modal = modalContainer;
-  }
-
-  /**
-   * Setup event listeners
-   */
-  setupEventListeners() {
-    // Close modal on Escape key
-    document.addEventListener('keydown', (e) => {
-      if (e.key === 'Escape' && this.isVisible) {
-        this.hide();
-      }
-    });
-  }
-
-  /**
-   * Show the modal
-   * @param {string} analysisId - Analysis ID to track
-   */
-  show(analysisId) {
-    this.currentAnalysisId = analysisId;
-    this.isVisible = true;
-    this.modal.style.display = 'flex';
-    
-    // Reset progress state
-    this.resetProgress();
-    
-    // Start monitoring progress
-    this.startProgressMonitoring();
-  }
-
-  /**
-   * Hide the modal
-   */
-  hide() {
-    this.isVisible = false;
-    this.modal.style.display = 'none';
-    
-    // Don't stop monitoring if running in background
-    if (!this.isRunningInBackground) {
-      this.stopProgressMonitoring();
-    }
-  }
-
-  /**
-   * Run analysis in background
-   */
-  runInBackground() {
-    this.isRunningInBackground = true;
-    this.hide();
-
-    // Button already shows analyzing state, no need for separate status indicator
-    // The button was set to analyzing state when analysis started
-  }
-
-  /**
-   * Cancel the analysis
-   */
-  async cancel() {
-    if (!this.currentAnalysisId) {
-      this.hide();
-      return;
-    }
-
-    try {
-      // Make cancel request to backend
-      const response = await fetch(`/api/analyze/cancel/${this.currentAnalysisId}`, {
-        method: 'POST'
-      });
-
-      if (response.ok) {
-        this.updateStatus('Analysis cancelled');
-      }
-    } catch (error) {
-      console.warn('Cancel not available on server:', error.message);
-    }
-
-    this.stopProgressMonitoring();
-    this.hide();
-
-    // Reset button
-    if (window.prManager) {
-      window.prManager.resetButton();
-    }
-
-    // Reset AI panel to non-loading state
-    if (window.aiPanel?.setAnalysisState) {
-      window.aiPanel.setAnalysisState('unknown');
-    }
-  }
-
-  /**
-   * Reset progress to initial state
-   */
-  resetProgress() {
-    // Reset levels 1-3 to running state
-    for (let i = 1; i <= 3; i++) {
-      const level = document.getElementById(`level-${i}`);
-      if (level) {
-        const icon = level.querySelector('.icon');
-        const status = level.querySelector('.level-status');
-        const progressContainer = level.querySelector('.progress-bar-container');
-        const snippetEl = level.querySelector('.level-stream-snippet');
-
-        icon.className = 'icon active';
-        icon.textContent = '▶';
-        status.textContent = 'Starting...';
-        status.style.display = 'none';
-
-        // Show progress bar immediately for levels 1-3
-        if (progressContainer) {
-          progressContainer.style.display = 'block';
-        }
-
-        // Clear stream snippet
-        if (snippetEl) {
-          snippetEl.style.display = 'none';
-          snippetEl.textContent = '';
-        }
-      }
-    }
-
-    // Level 4 (orchestration) starts as pending
-    const level4 = document.getElementById('level-4');
-    if (level4) {
-      const icon = level4.querySelector('.icon');
-      const status = level4.querySelector('.level-status');
-      const progressContainer = level4.querySelector('.progress-bar-container');
-      const snippetEl = level4.querySelector('.level-stream-snippet');
-
-      icon.className = 'icon pending';
-      icon.textContent = '○';
-      status.textContent = 'Pending';
-      status.style.display = 'block';
-
-      if (progressContainer) {
-        progressContainer.style.display = 'none';
-      }
-
-      if (snippetEl) {
-        snippetEl.style.display = 'none';
-        snippetEl.textContent = '';
-      }
-    }
-
-    // Reset footer buttons to initial state
-    const runBackgroundBtn = document.getElementById('run-background-btn');
-    const cancelBtn = document.getElementById('cancel-btn');
-
-    if (runBackgroundBtn) {
-      runBackgroundBtn.textContent = 'Run in Background';
-      runBackgroundBtn.disabled = false;
-    }
-    if (cancelBtn) {
-      cancelBtn.textContent = 'Cancel';
-    }
-
-    // Reset background running state
-    this.isRunningInBackground = false;
-  }
-
-  /**
-   * Start monitoring progress via Server-Sent Events (SSE)
-   */
-  startProgressMonitoring() {
-    if (this.eventSource) {
-      this.eventSource.close();
-    }
-
-    if (!this.currentAnalysisId) return;
-
-    // Connect to SSE endpoint
-    this.eventSource = new EventSource(`/api/pr/${this.currentAnalysisId}/ai-suggestions/status`);
-    
-    this.eventSource.onopen = () => {
-      console.log('Connected to progress stream');
-    };
-
-    this.eventSource.onmessage = (event) => {
-      try {
-        const data = JSON.parse(event.data);
-        
-        if (data.type === 'connected') {
-          console.log('SSE connection established');
-          return;
-        }
-        
-        if (data.type === 'progress') {
-          this.updateProgress(data);
-
-          // Stop monitoring if analysis is complete, failed, or cancelled
-          if (data.status === 'completed' || data.status === 'failed' || data.status === 'cancelled') {
-            this.stopProgressMonitoring();
-          }
-        }
-      } catch (error) {
-        console.error('Error parsing SSE data:', error);
-      }
-    };
-
-    this.eventSource.onerror = (error) => {
-      console.error('SSE connection error:', error);
-      // Fallback to polling if SSE fails
-      this.fallbackToPolling();
-    };
-  }
-
-  /**
-   * Fallback to polling if SSE fails
-   */
-  fallbackToPolling() {
-    if (this.eventSource) {
-      this.eventSource.close();
-      this.eventSource = null;
-    }
-
-    if (this.statusCheckInterval) {
-      clearInterval(this.statusCheckInterval);
-    }
-
-    this.statusCheckInterval = setInterval(async () => {
-      if (!this.currentAnalysisId) return;
-      
-      try {
-        const response = await fetch(`/api/analyze/status/${this.currentAnalysisId}`);
-        if (!response.ok) {
-          throw new Error('Failed to fetch status');
-        }
-        
-        const status = await response.json();
-        this.updateProgress(status);
-
-        // Stop monitoring if analysis is complete, failed, or cancelled
-        if (status.status === 'completed' || status.status === 'failed' || status.status === 'cancelled') {
-          this.stopProgressMonitoring();
-        }
-      } catch (error) {
-        console.error('Error checking analysis status:', error);
-      }
-    }, 1000); // Check every second
-  }
-
-  /**
-   * Stop progress monitoring
-   */
-  stopProgressMonitoring() {
-    if (this.statusCheckInterval) {
-      clearInterval(this.statusCheckInterval);
-      this.statusCheckInterval = null;
-    }
-    
-    if (this.eventSource) {
-      this.eventSource.close();
-      this.eventSource = null;
-    }
-  }
-
-  /**
-   * Update progress based on status
-   * @param {Object} status - Status object from server
-   */
-  updateProgress(status) {
-    // Validate status structure before accessing properties
-    if (!status.levels || typeof status.levels !== 'object') {
-      console.warn('Invalid status structure - missing or malformed levels object:', status);
-      return;
-    }
-
-    // Update each level's progress independently from the levels object
-    for (let level = 1; level <= 4; level++) {
-      const levelStatus = status.levels[level];
-      if (levelStatus) {
-        this.updateLevelProgress(level, levelStatus);
-      }
-    }
-
-    // Update overall progress message
-    this.updateStatus(status.progress || 'Running...');
-
-    // Handle completion, failure, or cancellation
-    if (status.status === 'completed') {
-      this.handleCompletion(status);
-    } else if (status.status === 'failed') {
-      this.handleFailure(status);
-    } else if (status.status === 'cancelled') {
-      this.handleCancellation(status);
-    }
-  }
-
-  /**
-   * Mark a level as completed
-   * @param {number} level - Level number to mark as completed
-   */
-  markLevelAsCompleted(level) {
-    const levelElement = document.getElementById(`level-${level}`);
-    if (!levelElement) return;
-    
-    const icon = levelElement.querySelector('.icon');
-    const statusText = levelElement.querySelector('.level-status');
-    const progressContainer = levelElement.querySelector('.progress-bar-container');
-    
-    icon.className = 'icon completed';
-    icon.textContent = '✓';
-    statusText.textContent = 'Completed';
-    statusText.style.display = 'block';
-    
-    // Hide progress bar for completed levels
-    if (progressContainer) {
-      progressContainer.style.display = 'none';
-    }
-  }
-
-  /**
-   * Update a specific level's progress
-   * @param {number} level - Level number (1, 2, or 3)
-   * @param {Object} levelStatus - Level status object with { status, progress }
-   */
-  updateLevelProgress(level, levelStatus) {
-    const levelElement = document.getElementById(`level-${level}`);
-    if (!levelElement) return;
-
-    const icon = levelElement.querySelector('.icon');
-    const statusText = levelElement.querySelector('.level-status');
-    const progressContainer = levelElement.querySelector('.progress-bar-container');
-    const snippetEl = levelElement.querySelector('.level-stream-snippet');
-
-    // Default: clear snippet. Only the running+streamEvent branch re-shows it.
-    if (snippetEl) {
-      snippetEl.style.display = 'none';
-      snippetEl.textContent = '';
-    }
-
-    // Update icon and status based on current state
-    if (levelStatus.status === 'running') {
-      icon.className = 'icon active';
-      icon.textContent = '▶';
-
-      // Show progress bar and hide status text for running levels
-      statusText.style.display = 'none';
-      if (progressContainer) {
-        progressContainer.style.display = 'block';
-      }
-
-      // Show stream snippet if present
-      if (snippetEl && levelStatus.streamEvent) {
-        snippetEl.textContent = levelStatus.streamEvent.text;
-        snippetEl.style.display = 'block';
-      }
-
-    } else if (levelStatus.status === 'completed') {
-      icon.className = 'icon completed';
-      icon.textContent = '✓';
-      statusText.textContent = 'Completed';
-      statusText.style.display = 'block';
-
-      if (progressContainer) {
-        progressContainer.style.display = 'none';
-      }
-
-    } else if (levelStatus.status === 'failed') {
-      icon.className = 'icon error';
-      icon.textContent = '❌';
-      statusText.textContent = 'Failed';
-      statusText.style.display = 'block';
-
-      if (progressContainer) {
-        progressContainer.style.display = 'none';
-      }
-
-    } else if (levelStatus.status === 'cancelled') {
-      icon.className = 'icon cancelled';
-      icon.textContent = '⊘';
-      statusText.textContent = 'Cancelled';
-      statusText.style.display = 'block';
-
-      if (progressContainer) {
-        progressContainer.style.display = 'none';
-      }
-
-    } else {
-      // For pending or other states
-      console.warn('Unexpected level status:', levelStatus.status, 'for level', level);
-      icon.className = 'icon pending';
-      icon.textContent = '○';
-      statusText.textContent = levelStatus.progress || 'Pending';
-      statusText.style.display = 'block';
-
-      if (progressContainer) {
-        progressContainer.style.display = 'none';
-      }
-    }
-
-    // Update toolbar progress dots (check both PR and local managers)
-    const manager = window.prManager || window.localManager;
-    if (manager?.updateProgressDot) {
-      manager.updateProgressDot(level, levelStatus.status);
-    }
-  }
-
-  /**
-   * Update general status message
-   * @param {string} message - Status message
-   */
-  updateStatus(message) {
-    // Could add a general status area if needed
-    console.log('Progress:', message);
-  }
-
-  /**
-   * Handle analysis completion
-   * @param {Object} status - Final status object
-   */
-  handleCompletion(status) {
-    // Levels are already marked as completed by updateProgress
-    // Just update the UI buttons
-
-    const completedLevel = status.completedLevel || status.level || 3;
-
-    // Update button to show completion
-    const runBackgroundBtn = document.getElementById('run-background-btn');
-    const cancelBtn = document.getElementById('cancel-btn');
-
-    if (runBackgroundBtn) {
-      runBackgroundBtn.textContent = `Analysis Complete`;
-      runBackgroundBtn.disabled = true;
-    }
-    if (cancelBtn) {
-      cancelBtn.textContent = 'Close';
-    }
-
-    // Update button to show completion
-    if (window.prManager) {
-      window.prManager.setButtonComplete();
-    }
-
-    // CRITICAL FIX: Automatically reload AI suggestions when analysis completes
-    console.log('Analysis completed, reloading AI suggestions...');
-
-    // Support both PR mode (prManager) and Local mode (localManager)
-    const manager = window.prManager || window.localManager;
-
-    if (manager && typeof manager.loadAISuggestions === 'function') {
-      // Determine whether to switch to the new run:
-      // - If modal is visible, user was waiting for results -> switch immediately
-      // - If modal is hidden (running in background), user was viewing older results -> don't switch
-      const shouldSwitchToNew = this.isVisible;
-
-      // First, refresh the analysis history manager to include the new run
-      const refreshHistory = async () => {
-        if (manager.analysisHistoryManager) {
-          console.log('Refreshing analysis history, switchToNew:', shouldSwitchToNew);
-          const result = await manager.analysisHistoryManager.refresh({ switchToNew: shouldSwitchToNew });
-          // Return whether the manager actually switched to the new run
-          // This can differ from shouldSwitchToNew when it's the first-ever run
-          // (first run always switches regardless of shouldSwitchToNew)
-          return result.didSwitch;
-        }
-        // No history manager, so we'll load suggestions directly
-        return true;
-      };
-
-      refreshHistory()
-        .then((didSwitch) => {
-          // Load suggestions if we switched to the new run
-          // Note: didSwitch may be true even if shouldSwitchToNew was false
-          // (e.g., first-ever analysis run always switches because there's no previous selection)
-          if (didSwitch) {
-            return manager.loadAISuggestions();
-          }
-          // Otherwise, just return - the user will load when they select the new run
-          console.log('New analysis available - user will see indicator on dropdown');
-          return Promise.resolve();
-        })
-        .then(() => {
-          console.log('AI suggestions reloaded successfully');
-          // Only auto-close after suggestions have loaded successfully
-          if (this.isVisible) {
-            setTimeout(() => {
-              this.hide();
-            }, 2000); // Reduced to 2 seconds since loading is complete
-          }
-        })
-        .catch(error => {
-          console.error('Error reloading AI suggestions:', error);
-          // Still auto-close even if loading failed, but give more time for user to see error
-          if (this.isVisible) {
-            setTimeout(() => {
-              this.hide();
-            }, 5000);
-          }
-        });
-    } else {
-      console.warn('Manager not available for automatic suggestion reload');
-      // Auto-close after 3 seconds if no manager available
-      if (this.isVisible) {
-        setTimeout(() => {
-          this.hide();
-        }, 3000);
-      }
-    }
-  }
-
-  /**
-   * Handle analysis failure
-   * @param {Object} status - Error status object
-   */
-  handleFailure(status) {
-    // Levels are already marked as failed by updateProgress
-    // Just update the UI buttons
-
-    // Update buttons
-    const runBackgroundBtn = document.getElementById('run-background-btn');
-    const cancelBtn = document.getElementById('cancel-btn');
-
-    if (runBackgroundBtn) {
-      runBackgroundBtn.textContent = 'Analysis Failed';
-      runBackgroundBtn.disabled = true;
-    }
-    if (cancelBtn) {
-      cancelBtn.textContent = 'Close';
-    }
-
-    // Reset button on failure
-    if (window.prManager) {
-      window.prManager.resetButton();
-    }
-  }
-
-  /**
-   * Handle analysis cancellation (via SSE status)
-   * @param {Object} status - Cancellation status object
-   */
-  handleCancellation(status) {
-    // Update buttons to show cancelled state
-    const runBackgroundBtn = document.getElementById('run-background-btn');
-    const cancelBtn = document.getElementById('cancel-btn');
-
-    if (runBackgroundBtn) {
-      runBackgroundBtn.textContent = 'Analysis Cancelled';
-      runBackgroundBtn.disabled = true;
-    }
-    if (cancelBtn) {
-      cancelBtn.textContent = 'Close';
-    }
-
-    // Reset the analyze button and AI panel state
-    if (window.prManager) {
-      window.prManager.resetButton();
-    }
-
-    // Reset AI panel to non-loading state
-    if (window.aiPanel?.setAnalysisState) {
-      window.aiPanel.setAnalysisState('unknown');
-    }
-
-    // Hide modal after a brief delay
-    if (this.isVisible) {
-      setTimeout(() => {
-        this.hide();
-      }, 1500);
-    }
-  }
-
-  /**
-   * Reopen modal from background
-   */
-  reopenFromBackground() {
-    this.isRunningInBackground = false;
-    this.show(this.currentAnalysisId);
-    
-    // Hide status indicator
-    if (window.statusIndicator) {
-      window.statusIndicator.hide();
-    }
-  }
-}
-
-// Initialize global instance
-window.progressModal = new ProgressModal();