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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@in-the-loop-labs/pair-review",
-  "version": "2.4.3",
+  "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.3",
+  "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.3",
+  "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 */
 }
 
 /* --------------------------------------------------------------------------

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;
   }
@@ -4784,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')];