diff --git a/src/vs/workbench/contrib/void/browser/inlineDiffsService.ts b/src/vs/workbench/contrib/void/browser/inlineDiffsService.ts index d17b263f..e2ad724e 100644 --- a/src/vs/workbench/contrib/void/browser/inlineDiffsService.ts +++ b/src/vs/workbench/contrib/void/browser/inlineDiffsService.ts @@ -298,39 +298,27 @@ class InlineDiffsService extends Disposable implements IInlineDiffsService { let zoneId: string | null = null editor.changeViewZones(accessor => { zoneId = accessor.addZone(viewZone); }) + + // mount react this._instantiationService.invokeFunction(accessor => { const props: QuickEditPropsType = { diffareaid: diffArea.diffareaid, + onChangeHeight(height) { + if (height === undefined) return + domNode.style.display = 'block' + viewZone.heightInPx = height + editor.changeViewZones(accessor => { if (zoneId) { accessor.layoutZone(zoneId) } }) + }, onUserUpdateText(text) { diffArea.userText = text; }, - onMount: () => onResize() } mountCtrlK(domNode, accessor, props) }) - // 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 } }, }) diff --git a/src/vs/workbench/contrib/void/browser/quickEditActions.ts b/src/vs/workbench/contrib/void/browser/quickEditActions.ts index 6adb0437..3773c90a 100644 --- a/src/vs/workbench/contrib/void/browser/quickEditActions.ts +++ b/src/vs/workbench/contrib/void/browser/quickEditActions.ts @@ -9,8 +9,8 @@ import { IInlineDiffsService } from './inlineDiffsService.js'; export type QuickEditPropsType = { diffareaid: number, + onChangeHeight: (height: number) => void; onUserUpdateText: (text: string) => void; - onMount: () => void; } export type QuickEdit = { diff --git a/src/vs/workbench/contrib/void/browser/react/src/ctrl-k-tsx/CtrlK.tsx b/src/vs/workbench/contrib/void/browser/react/src/ctrl-k-tsx/CtrlK.tsx index e57acf4a..6f79e10d 100644 --- a/src/vs/workbench/contrib/void/browser/react/src/ctrl-k-tsx/CtrlK.tsx +++ b/src/vs/workbench/contrib/void/browser/react/src/ctrl-k-tsx/CtrlK.tsx @@ -8,7 +8,7 @@ export const CtrlK = (props: QuickEditPropsType) => { const isDark = useIsDark() - return
+ return
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 2d16024f..e44876f1 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 @@ -7,16 +7,31 @@ import { getCmdKey } from '../../../helpers/getCmdKey.js'; import { VoidInputBox } from '../util/inputs.js'; import { QuickEditPropsType } from '../../../quickEditActions.js'; -export const CtrlKChat = ({ diffareaid, onUserUpdateText, onMount }: QuickEditPropsType) => { +export const CtrlKChat = ({ diffareaid, onUserUpdateText, onChangeHeight }: QuickEditPropsType) => { const accessor = useAccessor() const inlineDiffsService = accessor.get('IInlineDiffsService') + const formRef = useRef(null) const inputBoxRef: React.MutableRefObject = useRef(null); - useEffect(() => onMount(), [onMount]) + useEffect(() => { + console.log('mounting resize observer') + const inputContainer = formRef.current + if (!inputContainer) return; + + // only observing 1 element + const resizeObserver = new ResizeObserver((entries) => { + const height = entries[0].contentRect.height + console.log('NEW HEIGHT', height) + onChangeHeight(height) + }); + resizeObserver.observe(inputContainer); + return () => { resizeObserver.disconnect(); }; + }, [onChangeHeight]); + // state of current message const [instructions, setInstructions] = useState('') // the user's instructions @@ -41,6 +56,7 @@ export const CtrlKChat = ({ diffareaid, onUserUpdateText, onMount }: QuickEditPr }, []) return