webui: expand Monaco comment selections to full lines for better context
Enhances the Monaco diff editor comment functionality to automatically
expand any text selection to include complete lines, providing better
context for LLM analysis and code review discussions.
Changes include:
1. Modified handleSelectionChange method in sketch-monaco-view.ts:
- Automatically expands selection start to column 1 (beginning of line)
- Expands selection end to the maximum column of the end line
- Updates both selectedText and selectionRange to reflect full lines
- Maintains existing line number calculation for comment headers
2. Enhanced selection behavior:
- Partial line selections now include the entire line(s)
- Multi-line partial selections expand to include complete first and last lines
- Already full-line selections remain unchanged
- Preserves line number information for accurate comment context
The expansion logic uses Monaco's getLineMaxColumn() method to determine
proper line boundaries and getValueInRange() to extract the complete
text. This ensures that comments always include meaningful, complete
code segments rather than partial fragments.
Co-Authored-By: sketch <hello@sketch.dev>
Change-ID: s7a8b9c2d3e4f5g6k
diff --git a/webui/src/web-components/sketch-monaco-view.ts b/webui/src/web-components/sketch-monaco-view.ts
index 56138e3..9f996f3 100644
--- a/webui/src/web-components/sketch-monaco-view.ts
+++ b/webui/src/web-components/sketch-monaco-view.ts
@@ -798,8 +798,24 @@
};
try {
- // Get the selected text
- this.selectedText = model.getValueInRange(e.selection);
+ // Expand selection to full lines for better context
+ const expandedSelection = {
+ startLineNumber: e.selection.startLineNumber,
+ startColumn: 1, // Start at beginning of line
+ endLineNumber: e.selection.endLineNumber,
+ endColumn: model.getLineMaxColumn(e.selection.endLineNumber), // End at end of line
+ };
+
+ // Get the selected text using the expanded selection
+ this.selectedText = model.getValueInRange(expandedSelection);
+
+ // Update the selection range to reflect the full lines
+ this.selectionRange = {
+ startLineNumber: expandedSelection.startLineNumber,
+ startColumn: expandedSelection.startColumn,
+ endLineNumber: expandedSelection.endLineNumber,
+ endColumn: expandedSelection.endColumn,
+ };
} catch (error) {
console.error("Error getting selected text:", error);
return;