@in-the-loop-labs/pair-review 2.3.1 → 2.3.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@in-the-loop-labs/pair-review",
-  "version": "2.3.1",
+  "version": "2.3.3",
   "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": "2.3.1",
+  "version": "2.3.3",
   "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": "2.3.1",
+  "version": "2.3.3",
   "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

@@ -2106,6 +2106,7 @@ tr.newly-expanded .d2h-code-line-ctn {
   position: relative;
   display: flex;
   align-items: center;
+  flex-shrink: 0;
 }
 
 .btn-reasoning-toggle {
@@ -2439,7 +2440,7 @@ tr.newly-expanded .d2h-code-line-ctn {
   text-overflow: ellipsis;
   white-space: nowrap;
   color: var(--color-text-secondary);
-  max-width: 400px;
+  min-width: 0;
   font-size: 13px;
 }
 
@@ -4006,12 +4007,15 @@ tr.line-range-start .d2h-code-line-ctn {
   margin-bottom: 4px;
   padding-bottom: 4px;
   border-bottom: 1px solid rgba(139, 92, 246, 0.1);
+  min-width: 0;
 }
 
 .user-comment-header-left {
   display: flex;
   align-items: center;
   gap: 8px;
+  min-width: 0;
+  overflow: hidden;
 }
 
 .user-comment-line-info {
@@ -4088,6 +4092,9 @@ tr.line-range-start .d2h-code-line-ctn {
   font-size: 12px;
   font-style: italic;
   margin-left: 6px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 /* Eye icon toggle button */
@@ -4156,6 +4163,7 @@ tr.line-range-start .d2h-code-line-ctn {
   align-items: center;
   gap: 4px;
   margin-left: auto;
+  flex-shrink: 0;
 }
 
 /* Hide edit/delete buttons when in editing mode */

package/public/js/components/AIPanel.js

@@ -207,6 +207,45 @@ class AIPanel {
         }
     }
 
+    /**
+     * Get the localStorage key for the collapsed state (per-review)
+     * @returns {string|null} Storage key or null if no PR context
+     */
+    _getCollapsedStorageKey() {
+        if (!this.currentPRKey) return null;
+        return `pair-review-panel-collapsed_${this.currentPRKey}`;
+    }
+
+    /**
+     * Save the collapsed state to localStorage (per-review)
+     */
+    _saveCollapsedState() {
+        const key = this._getCollapsedStorageKey();
+        if (key) {
+            localStorage.setItem(key, this.isCollapsed ? 'true' : 'false');
+        }
+    }
+
+    /**
+     * Restore the collapsed state from localStorage, or collapse for new reviews.
+     * If the user had the panel expanded for this review, expand it.
+     * Otherwise (new review or previously collapsed), collapse it.
+     */
+    _restoreOrCollapsePanel() {
+        const key = this._getCollapsedStorageKey();
+        if (key) {
+            const stored = localStorage.getItem(key);
+            if (stored === 'false') {
+                this.expand();
+            } else {
+                // 'true' or no saved state (new review) → collapse
+                this.collapse();
+            }
+        } else {
+            this.collapse();
+        }
+    }
+
     /**
      * Get the localStorage key for the filter state (per-review)
      * @returns {string|null} Storage key or null if no PR context
@@ -275,6 +314,7 @@ class AIPanel {
         // Set CSS variable to 0 so width calculations don't reserve space
         document.documentElement.style.setProperty('--ai-panel-width', '0px');
         window.panelGroup?._onReviewVisibilityChanged(false);
+        this._saveCollapsedState();
     }
 
     expand() {
@@ -285,6 +325,7 @@ class AIPanel {
         // Restore CSS variable from saved width or default
         document.documentElement.style.setProperty('--ai-panel-width', `${this.getEffectivePanelWidth()}px`);
         window.panelGroup?._onReviewVisibilityChanged(true);
+        this._saveCollapsedState();
     }
 
     /**
@@ -296,6 +337,7 @@ class AIPanel {
      */
     setPR(owner, repo, number) {
         this.currentPRKey = `${owner}/${repo}#${number}`;
+        this._restoreOrCollapsePanel();
         this.restoreSegmentSelection();
         this.restoreFilterState();
     }
@@ -327,6 +369,10 @@ class AIPanel {
      */
     setAnalysisState(state) {
         this.analysisState = state;
+        // Auto-expand panel when analysis starts
+        if (state === 'loading' && this.isCollapsed) {
+            this.expand();
+        }
         // Re-render if currently showing empty state
         if (this.findings.length === 0 && this.selectedSegment === 'ai') {
             this.renderFindings();
@@ -1737,3 +1783,8 @@ class AIPanel {
 document.addEventListener('DOMContentLoaded', () => {
     window.aiPanel = new AIPanel();
 });
+
+// Export for testing
+if (typeof module !== 'undefined' && module.exports) {
+    module.exports = { AIPanel };
+}

package/public/js/components/PanelGroup.js

@@ -41,6 +41,7 @@ class PanelGroup {
     this._reviewVisible = !document.getElementById('ai-panel')?.classList.contains('collapsed');
     this._chatVisible = false;
     this._popoverVisible = false;
+    this._currentPRKey = null; // Set via setPR() for per-review chat persistence
 
     // Read persisted layout
     const savedLayout = localStorage.getItem(PanelGroup.STORAGE_KEY);
@@ -79,20 +80,17 @@ class PanelGroup {
     // Apply initial layout
     this._applyLayout(this._layout);
 
-    // Restore chat visibility from last session (only if chat is available)
-    const chatState = document.documentElement.getAttribute('data-chat');
-    if (chatState === 'available') {
-      this._restoreChatFromStorage();
-    } else {
-      // Chat not available yet — zero out CSS variable so max-width calcs are correct.
-      document.documentElement.style.setProperty('--chat-panel-width', '0px');
-    }
+    // Chat starts hidden; per-review state restored when setPR() is called.
+    document.documentElement.style.setProperty('--chat-panel-width', '0px');
 
     // Listen for late chat-state transitions (config fetch may complete after constructor)
     window.addEventListener('chat-state-changed', (e) => {
       const state = e.detail?.state;
       if (state === 'available') {
-        this._restoreChatFromStorage();
+        // Only restore if PR context is already set (setPR was called before chat became available)
+        if (this._currentPRKey) {
+          this._restoreChatFromStorage();
+        }
       } else if (state === 'unavailable' && this.chatToggleBtn) {
         this.chatToggleBtn.title = 'Install and configure Pi to enable chat';
       }
@@ -422,10 +420,34 @@ class PanelGroup {
   }
 
   /**
-   * Restore chat visibility from localStorage (called when chat becomes available)
+   * Set the current PR for per-review chat visibility persistence.
+   * Call this when a PR/review loads (after aiPanel.setPR).
+   * @param {string} prKey - e.g. "owner/repo#123" or "local/local#2"
+   */
+  setPR(prKey) {
+    this._currentPRKey = prKey;
+    // Now that we know the review context, restore chat state if chat is available
+    if (this._isChatAvailable()) {
+      this._restoreChatFromStorage();
+    }
+  }
+
+  /**
+   * Get the per-review localStorage key for chat visibility.
+   * @returns {string|null} Storage key or null if no PR context
+   */
+  _getChatVisibleStorageKey() {
+    if (!this._currentPRKey) return null;
+    return `${PanelGroup.CHAT_VISIBLE_KEY}_${this._currentPRKey}`;
+  }
+
+  /**
+   * Restore chat visibility from localStorage (per-review).
+   * For new reviews (no saved state), chat stays hidden.
    */
   _restoreChatFromStorage() {
-    const savedChatVisible = localStorage.getItem(PanelGroup.CHAT_VISIBLE_KEY);
+    const key = this._getChatVisibleStorageKey();
+    const savedChatVisible = key ? localStorage.getItem(key) : null;
     if (savedChatVisible === 'true') {
       this._chatVisible = true;
       this.chatPanel.open({ suppressFocus: true });
@@ -478,8 +500,11 @@ class PanelGroup {
       this.chatToggleBtn.classList.toggle('active', visible);
     }
 
-    // Persist chat visibility
-    localStorage.setItem(PanelGroup.CHAT_VISIBLE_KEY, visible ? 'true' : 'false');
+    // Persist chat visibility (per-review)
+    const chatKey = this._getChatVisibleStorageKey();
+    if (chatKey) {
+      localStorage.setItem(chatKey, visible ? 'true' : 'false');
+    }
 
     // Clear inline flex heights so the remaining panel fills the space
     if (this._layout.startsWith('v-')) {

package/public/js/local.js

@@ -374,6 +374,7 @@ class LocalManager {
         if (data.running && data.analysisId) {
           manager.currentAnalysisId = data.analysisId;
           manager.isAnalyzing = true;
+          window.aiPanel?.setAnalysisState('loading');
           manager.setButtonAnalyzing(data.analysisId);
 
           // Show the appropriate progress modal
@@ -791,10 +792,11 @@ class LocalManager {
         window.aiPanel = new window.AIPanel();
       }
 
-      // Set local context for AI Panel (restores filter state from localStorage)
+      // Set local context for AI Panel and Panel Group (restores per-review state from localStorage)
       if (window.aiPanel?.setPR) {
         window.aiPanel.setPR('local', reviewData.repository, this.reviewId);
       }
+      window.panelGroup?.setPR(`local/${reviewData.repository}#${this.reviewId}`);
 
       // Load saved comments using the restored filter state from AI Panel
       const includeDismissed = window.aiPanel?.showDismissedComments || false;

package/public/js/modules/comment-manager.js

@@ -594,12 +594,14 @@ class CommentManager {
     const commentHTML = `
       <div class="${commentClasses}">
         <div class="user-comment-header">
-          <span class="comment-origin-icon">
-            ${commentIcon}
-          </span>
-          <span class="user-comment-line-info">${lineInfo}</span>
-          ${expandedContextIndicator}
-          ${metadataHTML}
+          <div class="user-comment-header-left">
+            <span class="comment-origin-icon">
+              ${commentIcon}
+            </span>
+            <span class="user-comment-line-info">${lineInfo}</span>
+            ${expandedContextIndicator}
+            ${metadataHTML}
+          </div>
           <div class="user-comment-actions">
             <button class="btn-chat-comment" title="Chat about comment" data-chat-comment-id="${comment.id}" data-chat-file="${escapeHtml(comment.file || '')}" data-chat-line-start="${comment.line_start ?? ''}" data-chat-line-end="${comment.line_end || comment.line_start || ''}" data-chat-parent-id="${comment.parent_id || ''}">
               <svg viewBox="0 0 16 16" fill="currentColor"><path d="M1.75 1h8.5c.966 0 1.75.784 1.75 1.75v5.5A1.75 1.75 0 0 1 10.25 10H7.061l-2.574 2.573A1.458 1.458 0 0 1 2 11.543V10h-.25A1.75 1.75 0 0 1 0 8.25v-5.5C0 1.784.784 1 1.75 1ZM1.5 2.75v5.5c0 .138.112.25.25.25h1a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h3.5a.25.25 0 0 0 .25-.25v-5.5a.25.25 0 0 0-.25-.25h-8.5a.25.25 0 0 0-.25.25Zm13 2a.25.25 0 0 0-.25-.25h-.5a.75.75 0 0 1 0-1.5h.5c.966 0 1.75.784 1.75 1.75v5.5A1.75 1.75 0 0 1 14.25 12H14v1.543a1.458 1.458 0 0 1-2.487 1.03L9.22 12.28a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215l2.22 2.22v-2.19a.75.75 0 0 1 .75-.75h1a.25.25 0 0 0 .25-.25Z"/></svg>
@@ -666,12 +668,14 @@ class CommentManager {
     const commentHTML = `
       <div class="user-comment editing-mode ${comment.parent_id ? 'adopted-comment comment-ai-origin' : 'comment-user-origin'}">
         <div class="user-comment-header">
-          <span class="comment-origin-icon">
-            ${commentIcon}
-          </span>
-          <span class="user-comment-line-info">${lineInfo}</span>
-          ${comment.type === 'praise' ? `<span class="adopted-praise-badge" title="Nice Work"><svg viewBox="0 0 16 16" width="12" height="12"><path d="M8 .25a.75.75 0 01.673.418l1.882 3.815 4.21.612a.75.75 0 01.416 1.279l-3.046 2.97.719 4.192a.75.75 0 01-1.088.791L8 12.347l-3.766 1.98a.75.75 0 01-1.088-.79l.72-4.194L.818 6.374a.75.75 0 01.416-1.28l4.21-.611L7.327.668A.75.75 0 018 .25z"/></svg>Nice Work</span>` : ''}
-          ${comment.title ? `<span class="adopted-title">${escapeHtml(comment.title)}</span>` : ''}
+          <div class="user-comment-header-left">
+            <span class="comment-origin-icon">
+              ${commentIcon}
+            </span>
+            <span class="user-comment-line-info">${lineInfo}</span>
+            ${comment.type === 'praise' ? `<span class="adopted-praise-badge" title="Nice Work"><svg viewBox="0 0 16 16" width="12" height="12"><path d="M8 .25a.75.75 0 01.673.418l1.882 3.815 4.21.612a.75.75 0 01.416 1.279l-3.046 2.97.719 4.192a.75.75 0 01-1.088.791L8 12.347l-3.766 1.98a.75.75 0 01-1.088-.79l.72-4.194L.818 6.374a.75.75 0 01.416-1.28l4.21-.611L7.327.668A.75.75 0 018 .25z"/></svg>Nice Work</span>` : ''}
+            ${comment.title ? `<span class="adopted-title">${escapeHtml(comment.title)}</span>` : ''}
+          </div>
         </div>
         <!-- Hidden body div for saving - pre-populate with markdown rendered content and store original -->
         <div class="user-comment-body" style="display: none;" data-original-markdown="${window.escapeHtmlAttribute(comment.body)}">${window.renderMarkdown ? window.renderMarkdown(comment.body) : escapeHtml(comment.body)}</div>

package/public/js/modules/file-comment-manager.js

@@ -377,12 +377,14 @@ class FileCommentManager {
     // Use same structure as line-level user comments
     card.innerHTML = `
       <div class="user-comment-header">
-        <span class="comment-origin-icon">
-          ${commentIcon}
-        </span>
-        <span class="file-comment-badge" title="Comment applies to the entire file">File comment</span>
-        ${praiseBadge}
-        ${titleHtml}
+        <div class="user-comment-header-left">
+          <span class="comment-origin-icon">
+            ${commentIcon}
+          </span>
+          <span class="file-comment-badge" title="Comment applies to the entire file">File comment</span>
+          ${praiseBadge}
+          ${titleHtml}
+        </div>
         <div class="user-comment-actions">
           <button class="btn-chat-comment" title="Chat about comment" data-chat-comment-id="${comment.id}" data-chat-file="${this.escapeHtml(comment.file || '')}" data-chat-parent-id="${comment.parent_id || ''}">
             <svg viewBox="0 0 16 16" fill="currentColor"><path d="M1.75 1h8.5c.966 0 1.75.784 1.75 1.75v5.5A1.75 1.75 0 0 1 10.25 10H7.061l-2.574 2.573A1.458 1.458 0 0 1 2 11.543V10h-.25A1.75 1.75 0 0 1 0 8.25v-5.5C0 1.784.784 1 1.75 1ZM1.5 2.75v5.5c0 .138.112.25.25.25h1a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h3.5a.25.25 0 0 0 .25-.25v-5.5a.25.25 0 0 0-.25-.25h-8.5a.25.25 0 0 0-.25.25Zm13 2a.25.25 0 0 0-.25-.25h-.5a.75.75 0 0 1 0-1.5h.5c.966 0 1.75.784 1.75 1.75v5.5A1.75 1.75 0 0 1 14.25 12H14v1.543a1.458 1.458 0 0 1-2.487 1.03L9.22 12.28a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215l2.22 2.22v-2.19a.75.75 0 0 1 .75-.75h1a.25.25 0 0 0 .25-.25Z"/></svg>

package/public/js/pr.js

@@ -368,6 +368,9 @@ class PRManager {
 
   /**
    * Auto-trigger analysis if ?analyze=true is present in the URL.
+   * Skips refresh if data was just loaded fresh by loadPR (to avoid redundant fetches).
+   * Otherwise, refreshes PR data first to ensure we analyze the latest code.
+   * If refresh fails, proceeds with existing data rather than failing entirely.
    * Cleans up the query parameter afterwards regardless of success or failure.
    * @param {string} owner - Repository owner
    * @param {string} repo - Repository name
@@ -378,6 +381,21 @@ class PRManager {
     if (autoAnalyze === 'true' && !this.isAnalyzing) {
       this._autoAnalyzeRequested = true;
       try {
+        // Skip refresh if we just loaded fresh data (loadPR sets _justLoaded = true).
+        // Otherwise, refresh to ensure we have the latest PR data in case the worktree
+        // already existed but the PR has new commits since last load.
+        if (this._justLoaded) {
+          this._justLoaded = false;
+        } else {
+          try {
+            await this.refreshPR();
+          } catch (e) {
+            // If refresh fails, proceed with existing data - this is intentional.
+            // We'd rather analyze stale data than fail entirely.
+            console.warn('Pre-analysis refresh failed, proceeding with existing data', e);
+          }
+        }
+
         await this.startAnalysis(owner, repo, prNumber, null, {});
       } finally {
         this._autoAnalyzeRequested = false;
@@ -426,11 +444,12 @@ class PRManager {
         window.aiPanel = new window.AIPanel();
       }
 
-      // Set PR context for AI Panel (for PR-specific localStorage keys)
-      // This restores the filter state from localStorage
+      // Set PR context for AI Panel and Panel Group (for per-review localStorage keys)
+      // This restores the filter state and chat visibility from localStorage
       if (window.aiPanel?.setPR) {
         window.aiPanel.setPR(owner, repo, number);
       }
+      window.panelGroup?.setPR(`${owner}/${repo}#${number}`);
 
       // Load saved comments using the restored filter state from AI Panel
       // If AI Panel has showDismissedComments=true (restored from localStorage), use that
@@ -470,6 +489,8 @@ class PRManager {
       this.showError(error.message);
     } finally {
       this.setLoading(false);
+      // Mark that we just loaded fresh data - used by _maybeAutoAnalyze to skip redundant refresh
+      this._justLoaded = true;
     }
   }
 

package/public/local.html

@@ -404,7 +404,7 @@
             <!-- Right Panel Group (AI Panel + Chat) -->
             <div class="right-panel-group" id="right-panel-group">
                 <!-- AI Analysis Panel (Right) -->
-                <aside class="ai-panel" id="ai-panel">
+                <aside class="ai-panel collapsed" id="ai-panel">
                     <div class="resize-handle resize-handle-left" data-panel="ai-panel"></div>
                     <div class="ai-panel-header">
                         <div class="ai-panel-title">

package/public/pr.html

@@ -227,7 +227,7 @@
             <!-- Right Panel Group (AI Panel + Chat) -->
             <div class="right-panel-group" id="right-panel-group">
                 <!-- AI Analysis Panel (Right) -->
-                <aside class="ai-panel" id="ai-panel">
+                <aside class="ai-panel collapsed" id="ai-panel">
                     <div class="resize-handle resize-handle-left" data-panel="ai-panel"></div>
                     <div class="ai-panel-header">
                         <div class="ai-panel-title">