@in-the-loop-labs/pair-review 2.4.2 → 2.4.4

package/package.json

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

@@ -1188,8 +1188,7 @@
   background: var(--color-bg-primary);
   border: 1px solid var(--color-border-primary);
   border-radius: 8px;
-  overflow-x: auto;
-  overflow-y: visible;
+  overflow: visible; /* Must be visible so sticky file headers work relative to .diff-view */
   position: relative;
   min-width: 0;
   padding-bottom: 1px;
@@ -1335,7 +1334,7 @@
 /* Diff styling improvements */
 .d2h-file-wrapper[data-file-name] {
   margin-bottom: 24px;
-  overflow-x: auto; /* Allow horizontal scroll for long code lines */
+  overflow-x: visible; /* Must be visible for sticky file headers to work */
   max-width: 100%;
 }
 
@@ -1348,6 +1347,9 @@
   border-bottom: 1px solid var(--color-border-primary);
   font-weight: 600;
   font-size: 14px;
+  position: sticky;
+  top: var(--toolbar-height, 0px);
+  z-index: 4;
 }
 
 .d2h-file-name {
@@ -1540,7 +1542,8 @@
   color: #f85149;
 }
 
-/* Hide diff table when collapsed */
+/* Hide diff content when collapsed */
+.d2h-file-wrapper.collapsed .d2h-file-body,
 .d2h-file-wrapper.collapsed .d2h-diff-table {
   display: none;
 }
@@ -1560,6 +1563,12 @@
   cursor: pointer;
 }
 
+/* Scrollable wrapper for diff tables — provides per-file horizontal scroll
+   now that .d2h-file-wrapper and .diff-container use overflow:visible for sticky headers */
+.d2h-file-body {
+  overflow-x: auto;
+}
+
 .d2h-diff-table {
   width: 100%;
   border-collapse: collapse;
@@ -6288,6 +6297,9 @@ body:not([data-theme="dark"]) .theme-icon-light {
   background: var(--color-bg-primary);
   border-bottom: 1px solid var(--color-border-primary);
   flex-shrink: 0;
+  position: sticky;
+  top: 0;
+  z-index: 5;
 }
 
 .diff-toolbar .sidebar-toggle-collapsed {
@@ -6759,11 +6771,10 @@ body:not([data-theme="dark"]) .theme-icon-light {
 }
 
 .main-layout .diff-container {
-  flex: 1;
+  flex: 1 0 auto; /* Grow to fill, but don't shrink below content so .diff-view scrolls */
   min-width: 0; /* Prevent flex item from expanding beyond container */
   padding: 16px;
-  overflow-y: auto;
-  overflow-x: auto; /* Allow scroll as fallback for unbreakable content */
+  overflow: visible; /* Must be visible so sticky file headers work relative to .diff-view */
 }
 
 /* --------------------------------------------------------------------------
@@ -12277,9 +12288,12 @@ body.resizing * {
   font-size: 14px;
 }
 
-/* Override flex: 1 so the file name doesn't push the badge away */
+/* Don't grow (keeps badge next to text), shrink for long paths, clip from the left so the filename stays visible */
 .context-file-header .d2h-file-name {
-  flex: none;
+  flex: 0 1 auto;
+  direction: rtl;
+  unicode-bidi: plaintext;
+  text-overflow: ellipsis;
 }
 
 /* Push viewed checkbox (and everything after it) to the right */

package/public/js/index.js

@@ -402,11 +402,6 @@
       state.fetchedAt = data.fetched_at;
 
       renderCollectionTable(container, state, collection);
-
-      // Auto-refresh on first load if cache is empty
-      if (state.prs.length === 0 && !state.fetchedAt) {
-        refreshCollectionPrs(collection, containerId, state);
-      }
     } catch (error) {
       console.error('Error loading ' + collection + ':', error);
       container.innerHTML =
@@ -1164,11 +1159,11 @@
     if (collectionRow && !event.target.closest('a')) {
       var prUrl = collectionRow.dataset.prUrl;
       if (prUrl) {
-        // Switch to PR tab to show loading state
+        // Switch to PR tab to show loading state (do NOT persist to
+        // localStorage – the user's intentional tab choice should be preserved)
         var tabBar = document.getElementById('unified-tab-bar');
         var prTabBtn = tabBar.querySelector('[data-tab="pr-tab"]');
         switchTab(tabBar, prTabBtn);
-        localStorage.setItem(TAB_STORAGE_KEY, 'pr-tab');
 
         // Populate input and submit the form programmatically
         var input = document.getElementById('pr-url-input');
@@ -1204,19 +1199,25 @@
     const unifiedTabBtn = event.target.closest('#unified-tab-bar .tab-btn');
     if (unifiedTabBtn) {
       const tabBar = document.getElementById('unified-tab-bar');
-      switchTab(tabBar, unifiedTabBtn, function (tabId) {
+      switchTab(tabBar, unifiedTabBtn, async function (tabId) {
         // Persist tab choice
         localStorage.setItem(TAB_STORAGE_KEY, tabId);
         // Lazy-load local reviews on first switch
         if (tabId === 'local-tab' && !localReviewsPagination.loaded) {
           loadLocalReviews();
         }
-        // Lazy-load GitHub collection tabs on first switch
-        if (tabId === 'review-requests-tab' && !reviewRequestsState.loaded) {
-          loadCollectionPrs('review-requests', 'review-requests-container', reviewRequestsState);
+        // Load cached data on first switch, then always refresh from GitHub
+        if (tabId === 'review-requests-tab') {
+          if (!reviewRequestsState.loaded) {
+            await loadCollectionPrs('review-requests', 'review-requests-container', reviewRequestsState);
+          }
+          refreshCollectionPrs('review-requests', 'review-requests-container', reviewRequestsState);
         }
-        if (tabId === 'my-prs-tab' && !myPrsState.loaded) {
-          loadCollectionPrs('my-prs', 'my-prs-container', myPrsState);
+        if (tabId === 'my-prs-tab') {
+          if (!myPrsState.loaded) {
+            await loadCollectionPrs('my-prs', 'my-prs-container', myPrsState);
+          }
+          refreshCollectionPrs('my-prs', 'my-prs-container', myPrsState);
         }
       });
       return;
@@ -1248,12 +1249,14 @@
       loadLocalReviews();
     }
 
-    // If a GitHub collection tab is active, load it immediately
+    // If a GitHub collection tab is active, load cached data then refresh from GitHub
     if (savedTab === 'review-requests-tab') {
-      loadCollectionPrs('review-requests', 'review-requests-container', reviewRequestsState);
+      loadCollectionPrs('review-requests', 'review-requests-container', reviewRequestsState)
+        .then(function () { refreshCollectionPrs('review-requests', 'review-requests-container', reviewRequestsState); });
     }
     if (savedTab === 'my-prs-tab') {
-      loadCollectionPrs('my-prs', 'my-prs-container', myPrsState);
+      loadCollectionPrs('my-prs', 'my-prs-container', myPrsState)
+        .then(function () { refreshCollectionPrs('my-prs', 'my-prs-container', myPrsState); });
     }
 
     // Set up start review form handler

package/public/js/pr.js

@@ -180,6 +180,9 @@ class PRManager {
     this.initAnalysisConfigModal();
     this.initKeyboardShortcuts();
 
+    // Track toolbar height for sticky file headers (they sit below the sticky toolbar)
+    this._initToolbarHeightTracking();
+
     // Initialize diff options dropdown (gear icon for whitespace toggle).
     // Must happen before init() so the persisted hideWhitespace state is
     // applied before the first loadAndDisplayFiles() call.
@@ -238,6 +241,27 @@ class PRManager {
     };
   }
 
+  /**
+   * Keep --toolbar-height CSS variable in sync with the actual toolbar size
+   * so sticky file headers can position themselves below the sticky toolbar.
+   */
+  _initToolbarHeightTracking() {
+    const toolbar = document.querySelector('.diff-toolbar');
+    if (!toolbar) return;
+
+    const update = () => {
+      document.documentElement.style.setProperty(
+        '--toolbar-height', toolbar.offsetHeight + 'px'
+      );
+    };
+    update();
+
+    // Re-measure when toolbar resizes (e.g. analysis dots appear/disappear)
+    if (typeof ResizeObserver !== 'undefined') {
+      new ResizeObserver(update).observe(toolbar);
+    }
+  }
+
   /**
    * Set up event handlers
    */
@@ -1182,7 +1206,13 @@ class PRManager {
     }
 
     table.appendChild(tbody);
-    wrapper.appendChild(table);
+
+    // Wrap table in a scrollable container for horizontal scroll of long code lines
+    // (parent elements use overflow:visible to support sticky file headers)
+    const fileBody = document.createElement('div');
+    fileBody.className = 'd2h-file-body';
+    fileBody.appendChild(table);
+    wrapper.appendChild(fileBody);
 
     return wrapper;
   }
@@ -4480,7 +4510,16 @@ class PRManager {
     const tbody = document.createElement('tbody');
     tbody.className = 'd2h-diff-tbody context-chunk';
     tbody.dataset.contextId = contextFile.id;
-    tbody.dataset.lineStart = contextFile.line_start;
+
+    // Compute effective display range, shifting for end-of-file
+    const clampedEnd = Math.min(contextFile.line_end, data.lines.length);
+    const intendedSize = contextFile.line_end - contextFile.line_start + 1;
+    let effectiveStart = contextFile.line_start;
+    const actualSize = clampedEnd - effectiveStart + 1;
+    if (actualSize < intendedSize && effectiveStart > 1) {
+      effectiveStart = Math.max(1, effectiveStart - (intendedSize - actualSize));
+    }
+    tbody.dataset.lineStart = effectiveStart;
 
     // Chunk header row with range label and per-chunk dismiss button
     const headerRow = document.createElement('tr');
@@ -4493,8 +4532,7 @@ class PRManager {
     contentTd.colSpan = 3;
     const rangeLabel = document.createElement('span');
     rangeLabel.className = 'context-range-label';
-    const lineEnd = Math.min(contextFile.line_end, data.lines.length);
-    rangeLabel.textContent = `Lines ${contextFile.line_start}\u2013${lineEnd}`;
+    rangeLabel.textContent = `Lines ${effectiveStart}\u2013${clampedEnd}`;
     contentTd.appendChild(rangeLabel);
     const chunkDismiss = document.createElement('button');
     chunkDismiss.className = 'context-chunk-dismiss';
@@ -4508,25 +4546,22 @@ class PRManager {
     headerRow.appendChild(contentTd);
     tbody.appendChild(headerRow);
 
-    const lineStart = contextFile.line_start;
-    const clampedEnd = Math.min(contextFile.line_end, data.lines.length);
-
     // Add expand-up gap row if there are lines above the context range
-    if (lineStart > 1) {
-      const gapAboveSize = lineStart - 1;
+    if (effectiveStart > 1) {
+      const gapAboveSize = effectiveStart - 1;
       const gapAbove = window.HunkParser.createGapRowElement(
         contextFile.file,
-        1,              // startLine (old coords)
-        lineStart - 1,  // endLine (old coords)
+        1,                  // startLine (old coords)
+        effectiveStart - 1, // endLine (old coords)
         gapAboveSize,
         'above',
         this.expandGapContext.bind(this),
-        1               // startLineNew (same as old for context files — no diff offset)
+        1                   // startLineNew (same as old for context files — no diff offset)
       );
       tbody.appendChild(gapAbove);
     }
 
-    for (let i = lineStart; i <= clampedEnd; i++) {
+    for (let i = effectiveStart; i <= clampedEnd; i++) {
       const lineData = {
         type: 'context',
         oldNumber: i,
@@ -4779,7 +4814,11 @@ class PRManager {
     table.className = 'd2h-diff-table';
     const tbody = this._buildContextChunkTbody(data, contextFile);
     table.appendChild(tbody);
-    wrapper.appendChild(table);
+
+    const fileBody = document.createElement('div');
+    fileBody.className = 'd2h-file-body';
+    fileBody.appendChild(table);
+    wrapper.appendChild(fileBody);
 
     // Insert in sorted path order among existing file wrappers
     const allWrappers = [...diffContainer.querySelectorAll('.d2h-file-wrapper')];
@@ -4874,8 +4913,9 @@ class PRManager {
       lineStartVal = 1;
       lineEndVal = 100;
     } else if (lineEnd == null) {
-      lineStartVal = lineStart;
-      lineEndVal = lineStart + 49;
+      // Center a ~21-line window around the target line (±10 lines)
+      lineStartVal = Math.max(1, lineStart - 10);
+      lineEndVal = lineStartVal + 20;
     } else {
       lineStartVal = lineStart;
       lineEndVal = Math.min(lineEnd, lineStart + 499);

package/src/chat/claude-code-bridge.js

@@ -465,6 +465,14 @@ class ClaudeCodeBridge extends EventEmitter {
             toolName: name,
             status: 'start',
           });
+        } else if (event.content_block && event.content_block.type === 'text') {
+          // When a new text block starts and we already have accumulated text
+          // from a previous block, inject paragraph separation so the markdown
+          // renderer doesn't smash the blocks together (e.g., "diff.The").
+          if (this._accumulatedText) {
+            this._accumulatedText += '\n\n';
+            this.emit('delta', { text: '\n\n' });
+          }
         }
         break;