@in-the-loop-labs/pair-review 3.0.2 → 3.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -8,10 +8,13 @@ const pkg = require('../package.json');
8
8
  const args = process.argv.slice(2);
9
9
  const isMCP = args.includes('--mcp');
10
10
 
11
- // Check for updates and notify user (skip in MCP mode to avoid stdout pollution)
11
+ // Check for updates and notify user (skip in MCP mode and when config suppresses it)
12
12
  if (!isMCP) {
13
- const updateNotifier = require('update-notifier');
14
- updateNotifier({ pkg }).notify();
13
+ const { shouldSkipUpdateNotifier } = require('../src/config');
14
+ if (!shouldSkipUpdateNotifier()) {
15
+ const updateNotifier = require('update-notifier');
16
+ updateNotifier({ pkg }).notify();
17
+ }
15
18
  }
16
19
 
17
20
  async function main() {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@in-the-loop-labs/pair-review",
3
- "version": "3.0.2",
3
+ "version": "3.0.4",
4
4
  "description": "Your AI-powered code review partner - Close the feedback loop with AI coding agents",
5
5
  "main": "src/server.js",
6
6
  "bin": {
@@ -77,6 +77,7 @@
77
77
  "@playwright/test": "^1.57.0",
78
78
  "@vitest/coverage-v8": "^4.0.16",
79
79
  "highlight.js": "^11.11.1",
80
+ "jsdom": "^29.0.1",
80
81
  "supertest": "^7.1.4",
81
82
  "vitest": "^4.0.16"
82
83
  }
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pair-review",
3
- "version": "3.0.2",
3
+ "version": "3.0.4",
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.",
5
5
  "author": {
6
6
  "name": "in-the-loop-labs",
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "code-critic",
3
- "version": "3.0.2",
3
+ "version": "3.0.4",
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.",
5
5
  "author": {
6
6
  "name": "in-the-loop-labs",
package/public/css/pr.css CHANGED
@@ -1616,9 +1616,13 @@
1616
1616
  }
1617
1617
 
1618
1618
  /* Scrollable wrapper for diff tables — provides per-file horizontal scroll
1619
- now that .d2h-file-wrapper and .diff-container use overflow:visible for sticky headers */
1619
+ now that .d2h-file-wrapper and .diff-container use overflow:visible for sticky headers.
1620
+ overflow-y must be explicitly hidden: CSS spec coerces it to 'auto' when overflow-x
1621
+ is non-visible, which creates an accidental vertical scroll trap that eats wheel events
1622
+ at the boundary instead of propagating them to .diff-view. */
1620
1623
  .d2h-file-body {
1621
1624
  overflow-x: auto;
1625
+ overflow-y: hidden;
1622
1626
  }
1623
1627
 
1624
1628
  .d2h-diff-table {
@@ -5964,6 +5968,7 @@ body::before {
5964
5968
  .header-center {
5965
5969
  flex: 1;
5966
5970
  min-width: 0;
5971
+ overflow: hidden;
5967
5972
  text-align: center;
5968
5973
  }
5969
5974
 
@@ -10876,6 +10881,15 @@ body.resizing * {
10876
10881
  /* File-level AI suggestions now use the same classes as line-level (.ai-suggestion-*)
10877
10882
  No custom button styles needed - they inherit from .ai-action classes defined earlier */
10878
10883
 
10884
+ /* File-level AI suggestions: override line-level viewport-based max-width.
10885
+ Line-level suggestions use calc(100vw - sidebar - panels) because they sit in table cells.
10886
+ File-level suggestions sit inside .file-comments-container which is already correctly sized,
10887
+ so they just need to fill their container. */
10888
+ .file-comment-card.ai-suggestion {
10889
+ max-width: 100%;
10890
+ margin: 0; /* Container handles spacing via gap; don't center with auto margins */
10891
+ }
10892
+
10879
10893
  /* File-level AI suggestion collapsed state - uses same classes as line-level */
10880
10894
  .file-comment-card.ai-suggestion.collapsed {
10881
10895
  background: var(--color-bg-secondary, #f6f8fa);
@@ -371,7 +371,7 @@ class ReviewModal {
371
371
  */
372
372
  updateCommentCount() {
373
373
  // Count both line-level comments (.user-comment-row) and file-level comments (.file-comment-card.user-comment)
374
- const lineComments = document.querySelectorAll('.user-comment-row').length;
374
+ const lineComments = document.querySelectorAll('.user-comment-row:not(.suggestion-edit-pending)').length;
375
375
  const fileComments = document.querySelectorAll('.file-comment-card.user-comment').length;
376
376
  const userComments = lineComments + fileComments;
377
377
  const countElement = this.modal.querySelector('.review-comment-count');
@@ -470,7 +470,7 @@ class ReviewModal {
470
470
  const reviewEvent = selectedOption ? selectedOption.value : 'COMMENT';
471
471
  // Count BOTH line-level (.user-comment-row) and file-level (.file-comment-card.user-comment) comments
472
472
  // This must match the counting logic in updateCommentCount() for consistency
473
- const lineComments = document.querySelectorAll('.user-comment-row').length;
473
+ const lineComments = document.querySelectorAll('.user-comment-row:not(.suggestion-edit-pending)').length;
474
474
  const fileComments = document.querySelectorAll('.file-comment-card.user-comment').length;
475
475
  const commentCount = lineComments + fileComments;
476
476
 
@@ -580,12 +580,8 @@ class CommentManager {
580
580
 
581
581
  // Choose icon based on comment origin (AI-adopted vs user-originated)
582
582
  const commentIcon = comment.parent_id
583
- ? `<svg class="octicon octicon-comment-ai" viewBox="0 0 16 16" width="16" height="16">
584
- <path d="M7.75 1a.75.75 0 0 1 0 1.5h-5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h2c.199 0 .39.079.53.22.141.14.22.331.22.53v2.19l2.72-2.72a.747.747 0 0 1 .53-.22h4.5a.25.25 0 0 0 .25-.25v-2a.75.75 0 0 1 1.5 0v2c0 .464-.184.909-.513 1.237A1.746 1.746 0 0 1 13.25 12H9.06l-2.573 2.573A1.457 1.457 0 0 1 4 13.543V12H2.75A1.75 1.75 0 0 1 1 10.25v-7.5C1 1.784 1.784 1 2.75 1h5Zm4.519-.837a.248.248 0 0 1 .466 0l.238.648a3.726 3.726 0 0 0 2.218 2.219l.649.238a.249.249 0 0 1 0 .467l-.649.238a3.725 3.725 0 0 0-2.218 2.218l-.238.649a.248.248 0 0 1-.466 0l-.239-.649a3.725 3.725 0 0 0-2.218-2.218l-.649-.238a.249.249 0 0 1 0-.467l.649-.238A3.726 3.726 0 0 0 12.03.811l.239-.648Z"/>
585
- </svg>`
586
- : `<svg class="octicon octicon-person" viewBox="0 0 16 16" width="16" height="16">
587
- <path d="M10.561 8.073a6.005 6.005 0 0 1 3.432 5.142.75.75 0 1 1-1.498.07 4.5 4.5 0 0 0-8.99 0 .75.75 0 0 1-1.498-.07 6.004 6.004 0 0 1 3.431-5.142 3.999 3.999 0 1 1 5.123 0ZM10.5 5a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"/>
588
- </svg>`;
583
+ ? CommentManager.AI_ICON_SVG
584
+ : CommentManager.PERSON_ICON_SVG;
589
585
 
590
586
  // Build class list for comment styling
591
587
  const baseClasses = ['user-comment'];
@@ -634,56 +630,51 @@ class CommentManager {
634
630
  targetRow.parentNode.insertBefore(commentRow, targetRow.nextSibling);
635
631
  }
636
632
 
633
+ /** SVG icons for comment origin display */
634
+ static AI_ICON_SVG = `<svg class="octicon octicon-comment-ai" viewBox="0 0 16 16" width="16" height="16">
635
+ <path d="M7.75 1a.75.75 0 0 1 0 1.5h-5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h2c.199 0 .39.079.53.22.141.14.22.331.22.53v2.19l2.72-2.72a.747.747 0 0 1 .53-.22h4.5a.25.25 0 0 0 .25-.25v-2a.75.75 0 0 1 1.5 0v2c0 .464-.184.909-.513 1.237A1.746 1.746 0 0 1 13.25 12H9.06l-2.573 2.573A1.457 1.457 0 0 1 4 13.543V12H2.75A1.75 1.75 0 0 1 1 10.25v-7.5C1 1.784 1.784 1 2.75 1h5Zm4.519-.837a.248.248 0 0 1 .466 0l.238.648a3.726 3.726 0 0 0 2.218 2.219l.649.238a.249.249 0 0 1 0 .467l-.649.238a3.725 3.725 0 0 0-2.218 2.218l-.238.649a.248.248 0 0 1-.466 0l-.239-.649a3.725 3.725 0 0 0-2.218-2.218l-.649-.238a.249.249 0 0 1 0-.467l.649-.238A3.726 3.726 0 0 0 12.03.811l.239-.648Z"/>
636
+ </svg>`;
637
+
638
+ static PERSON_ICON_SVG = `<svg class="octicon octicon-person" viewBox="0 0 16 16" width="16" height="16">
639
+ <path d="M10.561 8.073a6.005 6.005 0 0 1 3.432 5.142.75.75 0 1 1-1.498.07 4.5 4.5 0 0 0-8.99 0 .75.75 0 0 1-1.498-.07 6.004 6.004 0 0 1 3.431-5.142 3.999 3.999 0 1 1 5.123 0ZM10.5 5a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"/>
640
+ </svg>`;
641
+
637
642
  /**
638
- * Display a user comment in edit mode (for adopted suggestions)
639
- * @param {Object} comment - Comment data
640
- * @param {HTMLElement} targetRow - Row to insert after
643
+ * Shared builder for comment/suggestion edit form rows.
644
+ * Builds the DOM, inserts after targetRow, wires common event handling
645
+ * (autoResize, emoji, suggestion button), and returns { formRow, textarea, saveBtn, cancelBtn }.
646
+ * Callers wire their own save/cancel logic on the returned elements.
647
+ * NOTE: similar edit form in pr.js editUserComment — keep in sync
648
+ * @private
641
649
  */
642
- displayUserCommentInEditMode(comment, targetRow) {
643
- const commentRow = document.createElement('tr');
644
- commentRow.className = 'user-comment-row';
645
- commentRow.dataset.commentId = comment.id;
646
- // Store file/line/side data for editing
647
- commentRow.dataset.file = comment.file;
648
- commentRow.dataset.lineStart = comment.line_start;
649
- commentRow.dataset.lineEnd = comment.line_end || comment.line_start;
650
- if (comment.side) {
651
- commentRow.dataset.side = comment.side;
652
- }
650
+ _buildEditFormRow(targetRow, {
651
+ rowClassName, rowDataset, iconHtml, originClass, lineInfo,
652
+ type, title, body, bodyHtml, textareaId, placeholder,
653
+ dataAttrs, saveLabel
654
+ }) {
655
+ const formRow = document.createElement('tr');
656
+ formRow.className = rowClassName;
657
+ Object.assign(formRow.dataset, rowDataset);
653
658
 
654
659
  const td = document.createElement('td');
655
660
  td.colSpan = 4;
656
661
  td.className = 'user-comment-cell';
657
662
 
658
- const lineInfo = comment.line_end && comment.line_end !== comment.line_start
659
- ? `Lines ${comment.line_start}-${comment.line_end}`
660
- : `Line ${comment.line_start}`;
661
-
662
663
  const escapeHtml = this.prManager?.escapeHtml?.bind(this.prManager) || ((s) => s);
663
664
 
664
- // Choose icon based on comment origin (AI-adopted vs user-originated)
665
- const commentIcon = comment.parent_id
666
- ? `<svg class="octicon octicon-comment-ai" viewBox="0 0 16 16" width="16" height="16">
667
- <path d="M7.75 1a.75.75 0 0 1 0 1.5h-5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h2c.199 0 .39.079.53.22.141.14.22.331.22.53v2.19l2.72-2.72a.747.747 0 0 1 .53-.22h4.5a.25.25 0 0 0 .25-.25v-2a.75.75 0 0 1 1.5 0v2c0 .464-.184.909-.513 1.237A1.746 1.746 0 0 1 13.25 12H9.06l-2.573 2.573A1.457 1.457 0 0 1 4 13.543V12H2.75A1.75 1.75 0 0 1 1 10.25v-7.5C1 1.784 1.784 1 2.75 1h5Zm4.519-.837a.248.248 0 0 1 .466 0l.238.648a3.726 3.726 0 0 0 2.218 2.219l.649.238a.249.249 0 0 1 0 .467l-.649.238a3.725 3.725 0 0 0-2.218 2.218l-.238.649a.248.248 0 0 1-.466 0l-.239-.649a3.725 3.725 0 0 0-2.218-2.218l-.649-.238a.249.249 0 0 1 0-.467l.649-.238A3.726 3.726 0 0 0 12.03.811l.239-.648Z"/>
668
- </svg>`
669
- : `<svg class="octicon octicon-person" viewBox="0 0 16 16" width="16" height="16">
670
- <path d="M10.561 8.073a6.005 6.005 0 0 1 3.432 5.142.75.75 0 1 1-1.498.07 4.5 4.5 0 0 0-8.99 0 .75.75 0 0 1-1.498-.07 6.004 6.004 0 0 1 3.431-5.142 3.999 3.999 0 1 1 5.123 0ZM10.5 5a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"/>
671
- </svg>`;
672
-
673
- const commentHTML = `
674
- <div class="user-comment editing-mode ${comment.parent_id ? 'adopted-comment comment-ai-origin' : 'comment-user-origin'}">
665
+ const html = `
666
+ <div class="user-comment editing-mode ${originClass}">
675
667
  <div class="user-comment-header">
676
668
  <div class="user-comment-header-left">
677
669
  <span class="comment-origin-icon">
678
- ${commentIcon}
670
+ ${iconHtml}
679
671
  </span>
680
672
  <span class="user-comment-line-info">${lineInfo}</span>
681
- ${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>` : ''}
682
- ${comment.title ? `<span class="adopted-title">${escapeHtml(comment.title)}</span>` : ''}
673
+ ${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>` : ''}
674
+ ${title ? `<span class="adopted-title">${escapeHtml(title)}</span>` : ''}
683
675
  </div>
684
676
  </div>
685
- <!-- Hidden body div for saving - pre-populate with markdown rendered content and store original -->
686
- <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>
677
+ ${bodyHtml || ''}
687
678
  <div class="user-comment-edit-form">
688
679
  <div class="comment-form-toolbar">
689
680
  <button type="button" class="btn btn-sm suggestion-btn" title="Insert a suggestion (Ctrl+G)">
@@ -691,71 +682,55 @@ class CommentManager {
691
682
  </button>
692
683
  </div>
693
684
  <textarea
694
- id="edit-comment-${comment.id}"
685
+ ${textareaId ? `id="${textareaId}"` : ''}
695
686
  class="comment-edit-textarea"
696
- placeholder="Enter your comment..."
697
- data-file="${comment.file}"
698
- data-line="${comment.line_start}"
699
- data-line-end="${comment.line_end || comment.line_start}"
700
- data-side="${comment.side || 'RIGHT'}"
701
- >${escapeHtml(comment.body)}</textarea>
687
+ placeholder="${placeholder}"
688
+ data-file="${window.escapeHtmlAttribute ? window.escapeHtmlAttribute(dataAttrs.file) : dataAttrs.file}"
689
+ data-line="${dataAttrs.line}"
690
+ data-line-end="${dataAttrs.lineEnd}"
691
+ data-side="${dataAttrs.side}"
692
+ >${escapeHtml(body)}</textarea>
702
693
  <div class="comment-edit-actions">
703
- <button class="btn btn-sm btn-primary save-edit-btn">
704
- Save
705
- </button>
706
- <button class="btn btn-sm btn-secondary cancel-edit-btn">
707
- Cancel
708
- </button>
694
+ <button class="btn btn-sm btn-primary save-edit-btn">${saveLabel}</button>
695
+ <button class="btn btn-sm btn-secondary cancel-edit-btn">Cancel</button>
709
696
  </div>
710
697
  </div>
711
698
  </div>
712
699
  `;
713
700
 
714
- td.innerHTML = commentHTML;
715
- commentRow.appendChild(td);
701
+ td.innerHTML = html;
702
+ formRow.appendChild(td);
716
703
 
717
- // Insert comment immediately after the target row (suggestion row)
718
704
  if (targetRow.nextSibling) {
719
- targetRow.parentNode.insertBefore(commentRow, targetRow.nextSibling);
705
+ targetRow.parentNode.insertBefore(formRow, targetRow.nextSibling);
720
706
  } else {
721
- targetRow.parentNode.appendChild(commentRow);
707
+ targetRow.parentNode.appendChild(formRow);
722
708
  }
723
709
 
724
- // Get references
725
- const editForm = td.querySelector('.user-comment-edit-form');
726
- const textarea = document.getElementById(`edit-comment-${comment.id}`);
727
- const suggestionBtn = editForm.querySelector('.suggestion-btn');
728
- const saveBtn = editForm.querySelector('.save-edit-btn');
729
- const cancelBtn = editForm.querySelector('.cancel-edit-btn');
710
+ const textarea = textareaId
711
+ ? document.getElementById(textareaId)
712
+ : formRow.querySelector('.comment-edit-textarea');
713
+ const suggestionBtn = formRow.querySelector('.suggestion-btn');
714
+ const saveBtn = formRow.querySelector('.save-edit-btn');
715
+ const cancelBtn = formRow.querySelector('.cancel-edit-btn');
730
716
 
731
717
  if (textarea) {
732
- // Auto-resize to fit content
733
718
  this.autoResizeTextarea(textarea);
734
-
735
719
  textarea.focus();
736
- // Position cursor at end of text instead of selecting all
737
720
  textarea.setSelectionRange(textarea.value.length, textarea.value.length);
738
721
 
739
- // Attach emoji picker for autocomplete
740
722
  if (window.emojiPicker) {
741
723
  window.emojiPicker.attach(textarea);
742
724
  }
743
725
 
744
- // Update suggestion button state based on content
745
726
  this.updateSuggestionButtonState(textarea, suggestionBtn);
746
727
 
747
- // Suggestion button handler
748
728
  suggestionBtn.addEventListener('click', () => {
749
729
  if (!suggestionBtn.disabled) {
750
730
  this.insertSuggestionBlock(textarea, suggestionBtn);
751
731
  }
752
732
  });
753
733
 
754
- // Save/cancel handlers - use prManager methods for consistency
755
- saveBtn.addEventListener('click', () => this.prManager?.saveEditedUserComment(comment.id));
756
- cancelBtn.addEventListener('click', () => this.prManager?.cancelEditUserComment(comment.id));
757
-
758
- // Auto-resize on input and update suggestion button state
759
734
  textarea.addEventListener('input', () => {
760
735
  this.autoResizeTextarea(textarea);
761
736
  this.updateSuggestionButtonState(textarea, suggestionBtn);
@@ -764,6 +739,105 @@ class CommentManager {
764
739
  // Keyboard shortcuts (Escape, Cmd/Ctrl+Enter) are handled by delegated
765
740
  // event listener in setupCommentFormDelegation() to avoid memory leaks
766
741
  }
742
+
743
+ return { formRow, textarea, saveBtn, cancelBtn };
744
+ }
745
+
746
+ /**
747
+ * Display a user comment in edit mode (for adopted suggestions)
748
+ * @param {Object} comment - Comment data
749
+ * @param {HTMLElement} targetRow - Row to insert after
750
+ */
751
+ displayUserCommentInEditMode(comment, targetRow) {
752
+ const lineInfo = comment.line_end && comment.line_end !== comment.line_start
753
+ ? `Lines ${comment.line_start}-${comment.line_end}`
754
+ : `Line ${comment.line_start}`;
755
+
756
+ const escapeHtml = this.prManager?.escapeHtml?.bind(this.prManager) || ((s) => s);
757
+ const bodyHtml = `<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>`;
758
+
759
+ const rowDataset = { commentId: comment.id, file: comment.file, lineStart: comment.line_start, lineEnd: comment.line_end || comment.line_start };
760
+ if (comment.side) rowDataset.side = comment.side;
761
+
762
+ const { saveBtn, cancelBtn } = this._buildEditFormRow(targetRow, {
763
+ rowClassName: 'user-comment-row',
764
+ rowDataset,
765
+ iconHtml: comment.parent_id ? CommentManager.AI_ICON_SVG : CommentManager.PERSON_ICON_SVG,
766
+ originClass: comment.parent_id ? 'adopted-comment comment-ai-origin' : 'comment-user-origin',
767
+ lineInfo,
768
+ type: comment.type,
769
+ title: comment.title,
770
+ body: comment.body,
771
+ bodyHtml,
772
+ textareaId: `edit-comment-${comment.id}`,
773
+ placeholder: 'Enter your comment...',
774
+ dataAttrs: {
775
+ file: comment.file,
776
+ line: comment.line_start,
777
+ lineEnd: comment.line_end || comment.line_start,
778
+ side: comment.side || 'RIGHT'
779
+ },
780
+ saveLabel: 'Save'
781
+ });
782
+
783
+ saveBtn.addEventListener('click', () => this.prManager?.saveEditedUserComment(comment.id));
784
+ cancelBtn.addEventListener('click', () => this.prManager?.cancelEditUserComment(comment.id));
785
+ }
786
+
787
+ /**
788
+ * Display an edit form for an AI suggestion that has NOT yet been adopted.
789
+ * Nothing is saved until the user clicks Save/Adopt.
790
+ * @param {Object} suggestion - { id, body, type, title, file, lineNumber, diffPosition, side }
791
+ * @param {HTMLElement} targetRow - The suggestion row to insert the form after
792
+ * @param {Function} onSave - Called with (editedText) when user clicks Save
793
+ * @param {Function} onCancel - Called when user clicks Cancel
794
+ */
795
+ displaySuggestionEditForm(suggestion, targetRow, onSave, onCancel) {
796
+ // Remove any existing pending edit form (prevents stale multi-form state)
797
+ const existing = document.querySelector('.suggestion-edit-pending');
798
+ if (existing) existing.remove();
799
+
800
+ const { formRow, saveBtn, cancelBtn } = this._buildEditFormRow(targetRow, {
801
+ rowClassName: 'user-comment-row suggestion-edit-pending',
802
+ rowDataset: { suggestionId: suggestion.id },
803
+ iconHtml: CommentManager.AI_ICON_SVG,
804
+ originClass: 'adopted-comment comment-ai-origin',
805
+ lineInfo: suggestion.lineEnd && suggestion.lineEnd !== suggestion.lineNumber
806
+ ? `Lines ${suggestion.lineNumber}-${suggestion.lineEnd}`
807
+ : `Line ${suggestion.lineNumber}`,
808
+ type: suggestion.type,
809
+ title: suggestion.title,
810
+ body: suggestion.body,
811
+ placeholder: 'Edit the suggestion...',
812
+ dataAttrs: {
813
+ file: suggestion.file,
814
+ line: suggestion.lineNumber,
815
+ lineEnd: suggestion.lineEnd || suggestion.lineNumber,
816
+ side: suggestion.side || 'RIGHT'
817
+ },
818
+ saveLabel: 'Save'
819
+ });
820
+
821
+ saveBtn.addEventListener('click', async () => {
822
+ const textarea = formRow.querySelector('.comment-edit-textarea');
823
+ const text = textarea?.value.trim();
824
+ if (text) {
825
+ saveBtn.disabled = true;
826
+ try {
827
+ await onSave(text);
828
+ formRow.remove();
829
+ } catch (err) {
830
+ saveBtn.disabled = false;
831
+ }
832
+ }
833
+ });
834
+
835
+ cancelBtn.addEventListener('click', () => {
836
+ formRow.remove();
837
+ onCancel();
838
+ });
839
+
840
+ return formRow;
767
841
  }
768
842
  }
769
843
 
@@ -17,7 +17,7 @@ class CommentMinimizer {
17
17
  /** Sparkles icon SVG (matches AI suggestion badge) */
18
18
  static SPARKLES_ICON = `<svg viewBox="0 0 16 16" width="14" height="14" fill="currentColor"><path d="M9.6 2.279a.426.426 0 0 1 .8 0l.407 1.112a6.386 6.386 0 0 0 3.802 3.802l1.112.407a.426.426 0 0 1 0 .8l-1.112.407a6.386 6.386 0 0 0-3.802 3.802l-.407 1.112a.426.426 0 0 1-.8 0l-.407-1.112a6.386 6.386 0 0 0-3.802-3.802L4.279 8.4a.426.426 0 0 1 0-.8l1.112-.407a6.386 6.386 0 0 0 3.802-3.802L9.6 2.279Zm-4.267 8.837a.178.178 0 0 1 .334 0l.169.464a2.662 2.662 0 0 0 1.584 1.584l.464.169a.178.178 0 0 1 0 .334l-.464.169a2.662 2.662 0 0 0-1.584 1.584l-.169.464a.178.178 0 0 1-.334 0l-.169-.464a2.662 2.662 0 0 0-1.584-1.584l-.464-.169a.178.178 0 0 1 0-.334l.464-.169a2.662 2.662 0 0 0 1.584-1.584l.169-.464ZM2.8.14a.213.213 0 0 1 .4 0l.203.556a3.2 3.2 0 0 0 1.901 1.901l.556.203a.213.213 0 0 1 0 .4l-.556.203a3.2 3.2 0 0 0-1.901 1.901L3.2 5.86a.213.213 0 0 1-.4 0l-.203-.556A3.2 3.2 0 0 0 .696 3.403L.14 3.2a.213.213 0 0 1 0-.4l.556-.203A3.2 3.2 0 0 0 2.597.696L2.8.14Z"/></svg>`;
19
19
 
20
- /** AI comment icon SVG — speech bubble with sparkles (for adopted AI suggestions) */
20
+ /** AI comment icon SVG — speech bubble with sparkles (matches CommentManager.AI_ICON_SVG, different size) */
21
21
  static AI_COMMENT_ICON = `<svg viewBox="0 0 16 16" width="14" height="14" fill="currentColor"><path d="M7.75 1a.75.75 0 0 1 0 1.5h-5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h2c.199 0 .39.079.53.22.141.14.22.331.22.53v2.19l2.72-2.72a.747.747 0 0 1 .53-.22h4.5a.25.25 0 0 0 .25-.25v-2a.75.75 0 0 1 1.5 0v2c0 .464-.184.909-.513 1.237A1.746 1.746 0 0 1 13.25 12H9.06l-2.573 2.573A1.457 1.457 0 0 1 4 13.543V12H2.75A1.75 1.75 0 0 1 1 10.25v-7.5C1 1.784 1.784 1 2.75 1h5Zm4.519-.837a.248.248 0 0 1 .466 0l.238.648a3.726 3.726 0 0 0 2.218 2.219l.649.238a.249.249 0 0 1 0 .467l-.649.238a3.725 3.725 0 0 0-2.218 2.218l-.238.649a.248.248 0 0 1-.466 0l-.239-.649a3.725 3.725 0 0 0-2.218-2.218l-.649-.238a.249.249 0 0 1 0-.467l.649-.238A3.726 3.726 0 0 0 12.03.811l.239-.648Z"/></svg>`;
22
22
 
23
23
  constructor() {
@@ -357,12 +357,8 @@ class FileCommentManager {
357
357
 
358
358
  // Choose icon based on comment origin (AI-adopted vs user-originated) - matches line-level
359
359
  const commentIcon = isAIOrigin
360
- ? `<svg class="octicon octicon-comment-ai" viewBox="0 0 16 16" width="16" height="16">
361
- <path d="M7.75 1a.75.75 0 0 1 0 1.5h-5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h2c.199 0 .39.079.53.22.141.14.22.331.22.53v2.19l2.72-2.72a.747.747 0 0 1 .53-.22h4.5a.25.25 0 0 0 .25-.25v-2a.75.75 0 0 1 1.5 0v2c0 .464-.184.909-.513 1.237A1.746 1.746 0 0 1 13.25 12H9.06l-2.573 2.573A1.457 1.457 0 0 1 4 13.543V12H2.75A1.75 1.75 0 0 1 1 10.25v-7.5C1 1.784 1.784 1 2.75 1h5Zm4.519-.837a.248.248 0 0 1 .466 0l.238.648a3.726 3.726 0 0 0 2.218 2.219l.649.238a.249.249 0 0 1 0 .467l-.649.238a3.725 3.725 0 0 0-2.218 2.218l-.238.649a.248.248 0 0 1-.466 0l-.239-.649a3.725 3.725 0 0 0-2.218-2.218l-.649-.238a.249.249 0 0 1 0-.467l.649-.238A3.726 3.726 0 0 0 12.03.811l.239-.648Z"/>
362
- </svg>`
363
- : `<svg class="octicon octicon-person" viewBox="0 0 16 16" width="16" height="16">
364
- <path d="M10.561 8.073a6.005 6.005 0 0 1 3.432 5.142.75.75 0 1 1-1.498.07 4.5 4.5 0 0 0-8.99 0 .75.75 0 0 1-1.498-.07 6.004 6.004 0 0 1 3.431-5.142 3.999 3.999 0 1 1 5.123 0ZM10.5 5a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"/>
365
- </svg>`;
360
+ ? window.CommentManager.AI_ICON_SVG
361
+ : window.CommentManager.PERSON_ICON_SVG;
366
362
 
367
363
  // Praise badge for "Nice Work" comments - matches line-level
368
364
  const praiseBadge = comment.type === 'praise'
@@ -746,7 +742,7 @@ class FileCommentManager {
746
742
  data-file="${window.escapeHtmlAttribute(suggestion.file)}"
747
743
  >${this.escapeHtml(suggestion.formattedBody || suggestion.body)}</textarea>
748
744
  <div class="file-comment-form-footer">
749
- <button class="file-comment-form-btn submit submit-btn">Adopt</button>
745
+ <button class="file-comment-form-btn submit submit-btn">Save</button>
750
746
  <button class="file-comment-form-btn cancel cancel-btn">Cancel</button>
751
747
  </div>
752
748
  `;
@@ -433,6 +433,7 @@ class SuggestionManager {
433
433
  // Store original markdown body for adopt functionality
434
434
  // Use JSON.stringify to preserve newlines and special characters
435
435
  suggestionDiv.dataset.originalBody = JSON.stringify(suggestion.body || '');
436
+ suggestionDiv.dataset.formattedBody = JSON.stringify(suggestion.formattedBody || '');
436
437
 
437
438
  // Store target info on the suggestion div for reliable retrieval in getFileAndLineInfo
438
439
  // This avoids fragile DOM traversal that fails when gap rows are between suggestion and target
@@ -445,6 +446,9 @@ class SuggestionManager {
445
446
  suggestionDiv.dataset.isFileLevel = targetInfo.isFileLevel ? 'true' : 'false';
446
447
  }
447
448
 
449
+ // Store line_end from the suggestion itself (may differ from targetInfo.lineNumber for multi-line suggestions)
450
+ suggestionDiv.dataset.lineEnd = suggestion.line_end !== undefined ? String(suggestion.line_end) : (targetInfo?.lineNumber !== undefined ? String(targetInfo.lineNumber) : '');
451
+
448
452
  // Convert suggestion.id to number for comparison since parent_id might be a number
449
453
  const suggestionIdNum = parseInt(suggestion.id);
450
454
 
@@ -526,7 +530,7 @@ class SuggestionManager {
526
530
  <svg viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z"></path></svg>
527
531
  Adopt
528
532
  </button>
529
- <button class="ai-action ai-action-edit" onclick="prManager.adoptAndEditSuggestion(${suggestion.id})">
533
+ <button class="ai-action ai-action-edit" onclick="prManager.editAndAdoptSuggestion(${suggestion.id})">
530
534
  <svg viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M11.013 1.427a1.75 1.75 0 012.474 0l1.086 1.086a1.75 1.75 0 010 2.474l-8.61 8.61c-.21.21-.47.364-.756.445l-3.251.93a.75.75 0 01-.927-.928l.929-3.25a1.75 1.75 0 01.445-.758l8.61-8.61zm1.414 1.06a.25.25 0 00-.354 0L10.811 3.75l1.439 1.44 1.263-1.263a.25.25 0 000-.354l-1.086-1.086zM11.189 6.25L9.75 4.81l-6.286 6.287a.25.25 0 00-.064.108l-.558 1.953 1.953-.558a.249.249 0 00.108-.064l6.286-6.286z"></path></svg>
531
535
  Edit
532
536
  </button>
@@ -556,6 +560,8 @@ class SuggestionManager {
556
560
  extractSuggestionData(suggestionDiv) {
557
561
  const suggestionText = suggestionDiv.dataset?.originalBody ?
558
562
  JSON.parse(suggestionDiv.dataset.originalBody) : '';
563
+ const formattedBody = suggestionDiv.dataset?.formattedBody ?
564
+ JSON.parse(suggestionDiv.dataset.formattedBody) : '';
559
565
 
560
566
  // Get type from ai-suggestion-badge data-type attribute or praise-badge
561
567
  const badgeElement = suggestionDiv.querySelector('.ai-suggestion-badge, .praise-badge');
@@ -563,7 +569,7 @@ class SuggestionManager {
563
569
  const suggestionType = badgeElement?.dataset?.type || (badgeElement?.classList?.contains('praise-badge') ? 'praise' : '');
564
570
  const suggestionTitle = titleElement?.textContent?.trim() || '';
565
571
 
566
- return { suggestionText, suggestionType, suggestionTitle };
572
+ return { suggestionText, formattedBody, suggestionType, suggestionTitle };
567
573
  }
568
574
 
569
575
  /**
@@ -609,6 +615,7 @@ class SuggestionManager {
609
615
  // This is the reliable method that works even with gap rows between suggestion and target
610
616
  const storedFileName = suggestionDiv.dataset.fileName;
611
617
  const storedLineNumber = suggestionDiv.dataset.lineNumber;
618
+ const storedLineEnd = suggestionDiv.dataset.lineEnd;
612
619
  const storedSide = suggestionDiv.dataset.side;
613
620
  const storedDiffPosition = suggestionDiv.dataset.diffPosition;
614
621
  const storedIsFileLevel = suggestionDiv.dataset.isFileLevel;
@@ -642,6 +649,7 @@ class SuggestionManager {
642
649
  targetRow,
643
650
  suggestionRow,
644
651
  lineNumber: parseInt(storedLineNumber, 10),
652
+ lineEnd: storedLineEnd ? parseInt(storedLineEnd, 10) : null,
645
653
  fileName: storedFileName,
646
654
  diffPosition: storedDiffPosition || null,
647
655
  side: storedSide || 'RIGHT',