From 01a345a391735180bd5311f3f9f2e691b0ec2d08 Mon Sep 17 00:00:00 2001 From: Andrew Pareles Date: Sat, 28 Dec 2024 21:28:20 -0500 Subject: [PATCH] ctrlk double redundancy fix --- .../void/browser/inlineDiffsService.ts | 146 +++++++++--------- .../contrib/void/browser/quickEditActions.ts | 1 + .../react/src/ctrl-k-tsx/CtrlKChat.tsx | 15 +- 3 files changed, 85 insertions(+), 77 deletions(-) diff --git a/src/vs/workbench/contrib/void/browser/inlineDiffsService.ts b/src/vs/workbench/contrib/void/browser/inlineDiffsService.ts index 793e7f86..d17b263f 100644 --- a/src/vs/workbench/contrib/void/browser/inlineDiffsService.ts +++ b/src/vs/workbench/contrib/void/browser/inlineDiffsService.ts @@ -172,9 +172,6 @@ class InlineDiffsService extends Disposable implements IInlineDiffsService { diffOfId: Record = {}; // redundant with diffArea._diffs - - _diffidPool = 0 // each diff has an id - constructor( // @IHistoryService private readonly _historyService: IHistoryService, // history service is the history of pressing alt left/right @ICodeEditorService private readonly _editorService: ICodeEditorService, @@ -200,7 +197,7 @@ class InlineDiffsService extends Disposable implements IInlineDiffsService { if (this._weAreWriting) return const uri = model.uri for (const change of e.changes) { this._realignAllDiffAreasLines(uri, change.text, change.range) } - this._refreshDiffsInURI(uri) + this._refreshStylesAndDiffsInURI(uri) // // diffArea should be removed if we just discovered it has no more diffs in it // for (const diffareaid of this.diffAreasOfURI[uri.fsPath]) { @@ -224,7 +221,7 @@ class InlineDiffsService extends Disposable implements IInlineDiffsService { // this function adds listeners to refresh styles when editor changes tab let initializeEditor = (editor: ICodeEditor) => { const uri = editor.getModel()?.uri ?? null - if (uri) this._refreshDiffsInURI(uri) + if (uri) this._refreshStylesAndDiffsInURI(uri) } // add listeners for all existing editors + listen for editor being added for (let editor of this._editorService.listCodeEditors()) { initializeEditor(editor) } @@ -257,8 +254,13 @@ class InlineDiffsService extends Disposable implements IInlineDiffsService { private _addDiffAreaStylesToURI = (uri: URI) => { const model = this._getModel(uri) + const fullFileText = this._readURI(uri) ?? '' + + for (const diffareaid of this.diffAreasOfURI[uri.fsPath]) { const diffArea = this.diffAreaOfId[diffareaid] + console.log('DA start and end:', diffArea.startLine, diffArea.endLine) + if (diffArea.type === 'DiffZone') { // add sweep styles to the diffZone if (diffArea._streamState.isStreaming) { @@ -268,52 +270,68 @@ class InlineDiffsService extends Disposable implements IInlineDiffsService { const fn2 = this._addLineDecoration(model, diffArea._streamState.line + 1, diffArea.endLine, 'void-sweepBG') diffArea._removeStylesFns.add(() => { fn1?.(); fn2?.(); }) } + + const newDiffAreaCode = fullFileText.split('\n').slice((diffArea.startLine - 1), (diffArea.endLine - 1) + 1).join('\n') + const computedDiffs = findDiffs(diffArea.originalCode, newDiffAreaCode) + + for (let computedDiff of computedDiffs) { + this._addDiff(computedDiff, diffArea) + } + } // highlight the ctrlK zone if (diffArea.type === 'CtrlKZone') { - const consistentZoneId = this._zoneStyleService.addConsistentItemToURI({ uri, fn: (editor) => { const domNode = document.createElement('div'); domNode.style.zIndex = '1' + domNode.style.display = 'hidden' // start hidden until mount and get computed size - // domNode.className = 'void-redBG' const viewZone: IViewZone = { - // afterLineNumber: computedDiff.startLine - 1, - afterLineNumber: diffArea.startLine, - // __TODO__ heightInPx update dynamically - heightInPx: 100, - // heightInLines: 1, - // minWidthInPx: 200, + afterLineNumber: diffArea.startLine - 1, domNode: domNode, suppressMouseDown: false, }; - + // mount zone let zoneId: string | null = null - editor.changeViewZones(accessor => { zoneId = accessor.addZone(viewZone) }) - const fn1 = () => editor.changeViewZones(accessor => { if (zoneId) accessor.removeZone(zoneId) }) - - - // __TODO fix this resize part - // on resize - domNode.onresize = () => { - console.log('RESIZING!!!!') - viewZone.heightInPx = domNode.clientHeight - editor.changeViewZones(accessor => { if (zoneId) accessor.layoutZone(zoneId) }) - } + editor.changeViewZones(accessor => { zoneId = accessor.addZone(viewZone); }) + // mount react this._instantiationService.invokeFunction(accessor => { const props: QuickEditPropsType = { diffareaid: diffArea.diffareaid, onUserUpdateText(text) { diffArea.userText = text; }, + onMount: () => onResize() } mountCtrlK(domNode, accessor, props) - // __TODO__ dismount }) - return () => { fn1(); } + // observe + const onResize = () => { + domNode.style.display = 'block' + console.log('resizing'); + viewZone.heightInPx = domNode.clientHeight + + editor.changeViewZones(accessor => { + if (zoneId) { + console.log('CALLING LAYOUT', viewZone.heightInPx); + accessor.layoutZone(zoneId) + } + }) + } + const observer = new ResizeObserver(onResize) + console.log('observing...') + observer.observe(domNode) + onResize() + + return () => { + editor.changeViewZones(accessor => { if (zoneId) accessor.removeZone(zoneId) }); + domNode.remove(); + observer.disconnect(); + // __TODO__ dismount + } }, }) diffArea._removeStylesFns.add(() => this._zoneStyleService.removeConsistentItemFromURI(consistentZoneId)); @@ -515,7 +533,7 @@ class InlineDiffsService extends Disposable implements IInlineDiffsService { this._writeText(uri, entireModelCode, { startColumn: 1, startLineNumber: 1, endLineNumber: numLines, endColumn: Number.MAX_SAFE_INTEGER }) // restore all the decorations - this._refreshDiffsInURI(uri) + this._refreshStylesAndDiffsInURI(uri) } const beforeSnapshot: HistorySnapshot = getCurrentSnapshot() @@ -592,6 +610,28 @@ class InlineDiffsService extends Disposable implements IInlineDiffsService { return diffArea2 } + private _diffidPool = 0 // each diff has an id + private _addDiff(computedDiff: ComputedDiff, diffZone: DiffZone): Diff { + + const uri = diffZone._URI + + const diffid = this._diffidPool++ + + // create a Diff of it + const newDiff: Diff = { + ...computedDiff, + diffid: diffid, + diffareaid: diffZone.diffareaid, + } + + const fn = this._addDiffStylesToURI(uri, newDiff) + diffZone._removeStylesFns.add(fn) + + this.diffOfId[diffid] = newDiff + diffZone._diffOfId[diffid] = newDiff + + return newDiff + } @@ -660,7 +700,7 @@ class InlineDiffsService extends Disposable implements IInlineDiffsService { } - private _refreshDiffsInURI(uri: URI) { + private _refreshStylesAndDiffsInURI(uri: URI) { const content = this._readURI(uri) if (content === null) return @@ -668,41 +708,7 @@ class InlineDiffsService extends Disposable implements IInlineDiffsService { this._clearAllEffects(uri) // 2. recompute all diffs on each editor with this URI - - const fullFileText = this._readURI(uri) ?? '' - - - // go thru all diffareas in this URI, creating diffs and adding styles to it - for (let diffareaid of this.diffAreasOfURI[uri.fsPath]) { - const diffArea = this.diffAreaOfId[diffareaid] - - if (diffArea.type === 'DiffZone') { - - console.log('DA start and end:', diffArea.startLine, diffArea.endLine) - const newDiffAreaCode = fullFileText.split('\n').slice((diffArea.startLine - 1), (diffArea.endLine - 1) + 1).join('\n') - const computedDiffs = findDiffs(diffArea.originalCode, newDiffAreaCode) - - for (let computedDiff of computedDiffs) { - const diffid = this._diffidPool++ - - // create a Diff of it - const newDiff: Diff = { - ...computedDiff, - diffid: diffid, - diffareaid: diffArea.diffareaid, - } - - const fn = this._addDiffStylesToURI(uri, newDiff) - diffArea._removeStylesFns.add(fn) - - this.diffOfId[diffid] = newDiff - diffArea._diffOfId[diffid] = newDiff - } - } - - // update styles on this DiffArea - this._addDiffAreaStylesToURI(uri) - } + this._addDiffAreaStylesToURI(uri) } @@ -916,14 +922,14 @@ ${userMessage} ], onText: ({ newText, fullText }) => { this._writeDiffZoneLLMText(diffZone, fullText, latestCurrentFileEnd, latestOriginalFileStart) - this._refreshDiffsInURI(uri) + this._refreshStylesAndDiffsInURI(uri) }, onFinalMessage: ({ fullText }) => { this._writeText(uri, fullText, { startLineNumber: diffZone.startLine, startColumn: 1, endLineNumber: diffZone.endLine, endColumn: Number.MAX_SAFE_INTEGER }, // 1-indexed ) diffZone._streamState = { isStreaming: false, line: null } - this._refreshDiffsInURI(uri) + this._refreshStylesAndDiffsInURI(uri) onFinishEdit() }, onError: (e) => { @@ -960,9 +966,9 @@ ${userMessage} } const ctrlKZone = this._addDiffArea(adding) - onFinishEdit() + this._refreshStylesAndDiffsInURI(uri) - this._refreshDiffsInURI(uri) + onFinishEdit() return ctrlKZone.diffareaid } @@ -1070,7 +1076,7 @@ ${userMessage} this._deleteDiffArea(diffArea) } - this._refreshDiffsInURI(uri) + this._refreshStylesAndDiffsInURI(uri) onFinishEdit() @@ -1152,7 +1158,7 @@ ${userMessage} this._deleteDiffArea(diffArea) } - this._refreshDiffsInURI(uri) + this._refreshStylesAndDiffsInURI(uri) onFinishEdit() diff --git a/src/vs/workbench/contrib/void/browser/quickEditActions.ts b/src/vs/workbench/contrib/void/browser/quickEditActions.ts index 76a1e194..6adb0437 100644 --- a/src/vs/workbench/contrib/void/browser/quickEditActions.ts +++ b/src/vs/workbench/contrib/void/browser/quickEditActions.ts @@ -10,6 +10,7 @@ import { IInlineDiffsService } from './inlineDiffsService.js'; export type QuickEditPropsType = { diffareaid: number, onUserUpdateText: (text: string) => void; + onMount: () => void; } export type QuickEdit = { diff --git a/src/vs/workbench/contrib/void/browser/react/src/ctrl-k-tsx/CtrlKChat.tsx b/src/vs/workbench/contrib/void/browser/react/src/ctrl-k-tsx/CtrlKChat.tsx index 01a1a22b..2d16024f 100644 --- a/src/vs/workbench/contrib/void/browser/react/src/ctrl-k-tsx/CtrlKChat.tsx +++ b/src/vs/workbench/contrib/void/browser/react/src/ctrl-k-tsx/CtrlKChat.tsx @@ -1,5 +1,5 @@ -import React, { FormEvent, useCallback, useRef, useState } from 'react'; +import React, { FormEvent, useCallback, useEffect, useRef, useState } from 'react'; import { useSettingsState, useSidebarState, useThreadsState, useQuickEditState, useAccessor } from '../util/services.js'; import { OnError } from '../../../../../../../platform/void/common/llmMessageTypes.js'; import { InputBox } from '../../../../../../../base/browser/ui/inputbox/inputBox.js'; @@ -7,7 +7,7 @@ import { getCmdKey } from '../../../helpers/getCmdKey.js'; import { VoidInputBox } from '../util/inputs.js'; import { QuickEditPropsType } from '../../../quickEditActions.js'; -export const CtrlKChat = ({ diffareaid, onUserUpdateText }: QuickEditPropsType) => { +export const CtrlKChat = ({ diffareaid, onUserUpdateText, onMount }: QuickEditPropsType) => { const accessor = useAccessor() @@ -16,7 +16,7 @@ export const CtrlKChat = ({ diffareaid, onUserUpdateText }: QuickEditPropsType) const inputBoxRef: React.MutableRefObject = useRef(null); - // -- imported state -- + useEffect(() => onMount(), [onMount]) // state of current message const [instructions, setInstructions] = useState('') // the user's instructions @@ -47,7 +47,8 @@ export const CtrlKChat = ({ diffareaid, onUserUpdateText }: QuickEditPropsType) transition-all duration-200 rounded-md bg-vscode-input-bg - border border-vscode-commandcenter-inactive-border focus-within:border-vscode-commandcenter-active-border hover:border-vscode-commandcenter-active-border` + border border-vscode-commandcenter-inactive-border focus-within:border-vscode-commandcenter-active-border hover:border-vscode-commandcenter-active-border + ` } onKeyDown={(e) => { if (e.key === 'Enter' && !e.shiftKey) { @@ -83,12 +84,12 @@ export const CtrlKChat = ({ diffareaid, onUserUpdateText }: QuickEditPropsType) inputBoxRef={inputBoxRef} multiline={true} /> + -