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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@in-the-loop-labs/pair-review",
-  "version": "2.3.0",
+  "version": "2.3.1",
   "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.0",
+  "version": "2.3.1",
   "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.0",
+  "version": "2.3.1",
   "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/js/components/ChatPanel.js

@@ -28,7 +28,7 @@ class ChatPanel {
     this._contextItemId = null;   // suggestion ID or comment ID from context
     this._contextLineMeta = null;  // { file, line_start, line_end } — set when opened with line context
     this._pendingActionContext = null;  // { type, itemId } — set by action button handlers, consumed by sendMessage
-    this._resizeConfig = { min: 300, default: 400, storageKey: 'chat-panel-width' };
+    this._resizeConfig = ChatPanel.RESIZE_CONFIG;
     this._analysisContextRemoved = false;
     this._sessionAnalysisRunId = null; // tracks which AI run ID's context is loaded in the current session
     this._openPromise = null; // concurrency guard for open()
@@ -3007,6 +3007,9 @@ class ChatPanel {
   }
 }
 
+/** Resize configuration for the chat panel, exposed as a static for cross-module use. */
+ChatPanel.RESIZE_CONFIG = { min: 300, default: 400, cssVar: '--chat-panel-width', storageKey: 'chat-panel-width' };
+
 // Make ChatPanel available globally
 window.ChatPanel = ChatPanel;
 

package/public/js/components/PanelGroup.js

@@ -60,11 +60,13 @@ class PanelGroup {
     window.chatPanel = this.chatPanel;
 
     // Create a full-height group resize handle for vertical layouts.
-    // Uses data-panel="ai-panel" so the existing PanelResizer picks it up automatically.
+    // Uses data-panel="panel-group" so PanelResizer updates both --ai-panel-width
+    // and --chat-panel-width in tandem (needed because the group CSS uses
+    // `width: max(--ai-panel-width, --chat-panel-width)`).
     if (this.groupEl) {
       this._groupResizeHandle = document.createElement('div');
       this._groupResizeHandle.className = 'panel-group-resize-handle resize-handle resize-handle-left';
-      this._groupResizeHandle.dataset.panel = 'ai-panel';
+      this._groupResizeHandle.dataset.panel = 'panel-group';
       this.groupEl.insertBefore(this._groupResizeHandle, this.groupEl.firstChild);
     }
 

package/public/js/modules/panel-resizer.js

@@ -26,6 +26,30 @@ window.PanelResizer = (function() {
     // Note: chat-panel resize is handled by ChatPanel itself (see ChatPanel._bindResizeEvents)
   };
 
+  // panel-group is a virtual panel used by the vertical-layout group resize handle.
+  // In vertical mode the group width is `max(--ai-panel-width, --chat-panel-width)`,
+  // so dragging the group handle must update BOTH CSS vars in tandem.
+  //
+  // Built lazily because ChatPanel.RESIZE_CONFIG is defined after this IIFE runs.
+  let _panelGroupConfig = null;
+  function getPanelGroupConfig() {
+    if (!_panelGroupConfig) {
+      const aiCfg = CONFIG['ai-panel'];
+      // ChatPanel.RESIZE_CONFIG is the canonical source for chat-panel sizing.
+      const chatCfg = window.ChatPanel?.RESIZE_CONFIG
+        ?? { cssVar: '--chat-panel-width', storageKey: 'chat-panel-width', default: 400, min: 300 };
+      const panels = [
+        { cssVar: aiCfg.cssVar, storageKey: aiCfg.storageKey, default: aiCfg.default },
+        { cssVar: chatCfg.cssVar, storageKey: chatCfg.storageKey, default: chatCfg.default }
+      ];
+      _panelGroupConfig = {
+        min: Math.max(aiCfg.min, chatCfg.min),
+        panels
+      };
+    }
+    return _panelGroupConfig;
+  }
+
   /**
    * Compute the effective max width for a panel.
    * For panels with a static max, returns that value.
@@ -39,6 +63,39 @@ window.PanelResizer = (function() {
     return window.innerWidth - sidebarWidth - 100;
   }
 
+  /**
+   * Get the current panel-group width (the max of its sub-panel CSS vars).
+   * This matches the CSS `max()` expression used in vertical layouts.
+   * @returns {number} Current group width in pixels
+   */
+  function getPanelGroupWidth() {
+    let maxWidth = 0;
+    for (const p of getPanelGroupConfig().panels) {
+      const val = parseInt(
+        getComputedStyle(document.documentElement).getPropertyValue(p.cssVar), 10
+      ) || p.default;
+      if (val > maxWidth) maxWidth = val;
+    }
+    return maxWidth;
+  }
+
+  /**
+   * Set the panel-group width by updating ALL sub-panel CSS vars in tandem.
+   * @param {number} width - Desired width in pixels
+   * @param {boolean} save - Whether to persist to localStorage
+   */
+  function setPanelGroupWidth(width, save = true) {
+    const effectiveMax = getEffectiveMax('ai-panel'); // same viewport constraint
+    const clamped = Math.max(getPanelGroupConfig().min, Math.min(effectiveMax, width));
+
+    for (const p of getPanelGroupConfig().panels) {
+      document.documentElement.style.setProperty(p.cssVar, `${clamped}px`);
+      if (save) {
+        localStorage.setItem(p.storageKey, clamped.toString());
+      }
+    }
+  }
+
   // State
   let isDragging = false;
   let currentPanel = null;
@@ -127,6 +184,20 @@ window.PanelResizer = (function() {
     if (!handle) return;
 
     const panelName = handle.dataset.panel;
+
+    // panel-group: virtual panel — start width is the max of the sub-panels
+    if (panelName === 'panel-group') {
+      isDragging = true;
+      currentPanel = panelName;
+      startX = e.clientX;
+      startWidth = getPanelGroupWidth();
+
+      handle.classList.add('dragging');
+      document.body.classList.add('resizing');
+      e.preventDefault();
+      return;
+    }
+
     const panelEl = panelName === 'sidebar'
       ? document.getElementById('files-sidebar')
       : panelName === 'chat-panel'
@@ -157,6 +228,14 @@ window.PanelResizer = (function() {
   function onMouseMove(e) {
     if (!isDragging || !currentPanel) return;
 
+    // panel-group: update both sub-panel CSS vars in tandem
+    if (currentPanel === 'panel-group') {
+      const delta = startX - e.clientX; // right-side panel: left = wider
+      const newWidth = startWidth + delta;
+      setPanelGroupWidth(newWidth, false);
+      return;
+    }
+
     const config = CONFIG[currentPanel];
     if (!config) return;
 
@@ -182,7 +261,11 @@ window.PanelResizer = (function() {
     if (!isDragging) return;
 
     // Save final width
-    if (currentPanel) {
+    if (currentPanel === 'panel-group') {
+      // Persist both sub-panel widths
+      const finalWidth = getPanelGroupWidth();
+      setPanelGroupWidth(finalWidth, true);
+    } else if (currentPanel) {
       const finalWidth = getPanelWidth(currentPanel);
       const config = CONFIG[currentPanel];
       if (config) {

package/public/js/pr.js

@@ -1400,6 +1400,15 @@ class PRManager {
       }
     } else {
       this.viewedFiles.delete(filePath);
+      // Auto-expand when unchecking viewed (match GitHub behavior)
+      if (wrapper && wrapper.classList.contains('collapsed')) {
+        wrapper.classList.remove('collapsed');
+        this.collapsedFiles.delete(filePath);
+        const header = wrapper.querySelector('.d2h-file-header');
+        if (header) {
+          window.DiffRenderer.updateFileHeaderState(header, true);
+        }
+      }
     }
 
     // Persist viewed state