Merge pull request microsoft#210239 from microsoft/tyriar/copilot-4720

Offset terminal when inline chat appears to ensure cursor is visible

Author: Tyriar

src/vs/workbench/contrib/terminalContrib/chat/browser/terminalChatController.ts

@@ -149,7 +149,7 @@ export class TerminalChatController extends Disposable implements ITerminalContr
 
 	xtermReady(xterm: IXtermTerminal & { raw: RawXtermTerminal }): void {
 		this._chatWidget = new Lazy(() => {
-			const chatWidget = this._register(this._instantiationService.createInstance(TerminalChatWidget, this._instance.domElement!, this._instance));
+			const chatWidget = this._register(this._instantiationService.createInstance(TerminalChatWidget, this._instance.domElement!, this._instance, xterm));
 			this._register(chatWidget.focusTracker.onDidFocus(() => {
 				TerminalChatController.activeChatWidget = this;
 				if (!isDetachedTerminalInstance(this._instance)) {

src/vs/workbench/contrib/terminalContrib/chat/browser/terminalChatWidget.ts

@@ -3,18 +3,21 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
+import type { Terminal as RawXtermTerminal } from '@xterm/xterm';
 import { Dimension, IFocusTracker, trackFocus } from 'vs/base/browser/dom';
 import { Event } from 'vs/base/common/event';
 import { Disposable, toDisposable } from 'vs/base/common/lifecycle';
+import { MicrotaskDelay } from 'vs/base/common/symbols';
 import 'vs/css!./media/terminalChatWidget';
 import { localize } from 'vs/nls';
 import { IContextKey, IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import { ChatAgentLocation } from 'vs/workbench/contrib/chat/common/chatAgents';
 import { IChatProgress } from 'vs/workbench/contrib/chat/common/chatService';
 import { InlineChatWidget } from 'vs/workbench/contrib/inlineChat/browser/inlineChatWidget';
-import { ITerminalInstance } from 'vs/workbench/contrib/terminal/browser/terminal';
+import { ITerminalInstance, type IXtermTerminal } from 'vs/workbench/contrib/terminal/browser/terminal';
 import { MENU_TERMINAL_CHAT_INPUT, MENU_TERMINAL_CHAT_WIDGET, MENU_TERMINAL_CHAT_WIDGET_FEEDBACK, MENU_TERMINAL_CHAT_WIDGET_STATUS, TerminalChatCommandId, TerminalChatContextKeys } from 'vs/workbench/contrib/terminalContrib/chat/browser/terminalChat';
+import { TerminalStickyScrollContribution } from 'vs/workbench/contrib/terminalContrib/stickyScroll/browser/terminalStickyScrollContribution';
 
 const enum Constants {
 	HorizontalMargin = 10
@@ -35,6 +38,7 @@ export class TerminalChatWidget extends Disposable {
 	constructor(
 		private readonly _terminalElement: HTMLElement,
 		private readonly _instance: ITerminalInstance,
+		private readonly _xterm: IXtermTerminal & { raw: RawXtermTerminal },
 		@IInstantiationService private readonly _instantiationService: IInstantiationService,
 		@IContextKeyService private readonly _contextKeyService: IContextKeyService
 	) {
@@ -73,6 +77,7 @@ export class TerminalChatWidget extends Disposable {
 		this._register(Event.any(
 			this._inlineChatWidget.onDidChangeHeight,
 			this._instance.onDimensionsChanged,
+			Event.debounce(this._xterm.raw.onCursorMove, () => void 0, MicrotaskDelay),
 		)(() => this._relayout()));
 
 		const observer = new ResizeObserver(() => this._relayout());
@@ -102,6 +107,7 @@ export class TerminalChatWidget extends Disposable {
 		}
 		this._dimension = new Dimension(width, height);
 		this._inlineChatWidget.layout(this._dimension);
+
 		this._updateVerticalPosition();
 	}
 
@@ -134,7 +140,9 @@ export class TerminalChatWidget extends Disposable {
 			return;
 		}
 		if (top > terminalWrapperHeight - widgetHeight) {
-			this._container.style.top = '';
+			this._setTerminalOffset(top - (terminalWrapperHeight - widgetHeight));
+		} else {
+			this._setTerminalOffset(undefined);
 		}
 	}
 
@@ -154,6 +162,18 @@ export class TerminalChatWidget extends Disposable {
 		this._visibleContextKey.set(false);
 		this._inlineChatWidget.value = '';
 		this._instance.focus();
+		this._setTerminalOffset(undefined);
+	}
+	private _setTerminalOffset(offset: number | undefined) {
+		if (offset === undefined || this._container.classList.contains('hide')) {
+			this._terminalElement.style.position = '';
+			this._terminalElement.style.bottom = '';
+			TerminalStickyScrollContribution.get(this._instance)?.hideUnlock();
+		} else {
+			this._terminalElement.style.position = 'relative';
+			this._terminalElement.style.bottom = `${offset}px`;
+			TerminalStickyScrollContribution.get(this._instance)?.hideLock();
+		}
 	}
 	focus(): void {
 		this._inlineChatWidget.focus();

src/vs/workbench/contrib/terminalContrib/stickyScroll/browser/terminalStickyScrollContribution.ts

@@ -60,6 +60,14 @@ export class TerminalStickyScrollContribution extends Disposable implements ITer
 		this._refreshState();
 	}
 
+	hideLock() {
+		this._overlay.value?.lockHide();
+	}
+
+	hideUnlock() {
+		this._overlay.value?.unlockHide();
+	}
+
 	private _refreshState(): void {
 		if (this._overlay.value) {
 			this._tryDisable();

src/vs/workbench/contrib/terminalContrib/stickyScroll/browser/terminalStickyScrollOverlay.ts

@@ -129,6 +129,14 @@ export class TerminalStickyScrollOverlay extends Disposable {
 		});
 	}
 
+	lockHide() {
+		this._element?.classList.add('lock-hide');
+	}
+
+	unlockHide() {
+		this._element?.classList.remove('lock-hide');
+	}
+
 	private _setState(state: OverlayState) {
 		if (this._state === state) {
 			return;