@theia/ai-chat-ui 1.65.0-next.6 → 1.66.0-next.0

package/src/browser/chat-input-widget.tsx

@@ -15,14 +15,16 @@
 // *****************************************************************************
 import {
     ChangeSet, ChangeSetElement, ChatAgent, ChatChangeEvent, ChatHierarchyBranch,
-    ChatModel, ChatRequestModel, ChatService, ChatSuggestion, EditableChatRequestModel
+    ChatModel, ChatRequestModel, ChatService, ChatSuggestion, EditableChatRequestModel,
+    ChatRequestParser
 } from '@theia/ai-chat';
 import { ChangeSetDecoratorService } from '@theia/ai-chat/lib/browser/change-set-decorator-service';
 import { ImageContextVariable } from '@theia/ai-chat/lib/common/image-context-variable';
 import { AIVariableResolutionRequest } from '@theia/ai-core';
 import { AgentCompletionNotificationService, FrontendVariableService, AIActivationService } from '@theia/ai-core/lib/browser';
-import { DisposableCollection, Emitter, InMemoryResources, URI, nls } from '@theia/core';
+import { DisposableCollection, Emitter, InMemoryResources, URI, nls, Disposable } from '@theia/core';
 import { ContextMenuRenderer, LabelProvider, Message, OpenerService, ReactWidget } from '@theia/core/lib/browser';
+import { ContextKey, ContextKeyService } from '@theia/core/lib/browser/context-key-service';
 import { Deferred } from '@theia/core/lib/common/promise-util';
 import { inject, injectable, optional, postConstruct } from '@theia/core/shared/inversify';
 import * as React from '@theia/core/shared/react';
@@ -35,6 +37,8 @@ import { CHAT_VIEW_LANGUAGE_EXTENSION } from './chat-view-language-contribution'
 import { ContextVariablePicker } from './context-variable-picker';
 import { TASK_CONTEXT_VARIABLE } from '@theia/ai-chat/lib/browser/task-context-variable';
 import { IModelDeltaDecoration } from '@theia/monaco-editor-core/esm/vs/editor/common/model';
+import { EditorOption } from '@theia/monaco-editor-core/esm/vs/editor/common/config/editorOptions';
+import { ChatInputHistoryService, ChatInputNavigationState } from './chat-input-history';
 
 type Query = (query: string) => Promise<void>;
 type Unpin = () => void;
@@ -49,6 +53,7 @@ export interface AIChatInputConfiguration {
     showPinnedAgent?: boolean;
     showChangeSet?: boolean;
     showSuggestions?: boolean;
+    enablePromptHistory?: boolean;
 }
 
 @injectable()
@@ -95,12 +100,52 @@ export class AIChatInputWidget extends ReactWidget {
     @inject(AIActivationService)
     protected readonly aiActivationService: AIActivationService;
 
+    @inject(ChatInputHistoryService)
+    protected readonly historyService: ChatInputHistoryService;
+
+    @inject(ChatRequestParser)
+    protected readonly chatRequestParser: ChatRequestParser;
+
+    protected navigationState: ChatInputNavigationState;
+
+    @inject(ContextKeyService)
+    protected readonly contextKeyService: ContextKeyService;
+
     protected editorRef: SimpleMonacoEditor | undefined = undefined;
     protected readonly editorReady = new Deferred<void>();
 
+    get editor(): SimpleMonacoEditor | undefined {
+        return this.editorRef;
+    }
+
+    get inputConfiguration(): AIChatInputConfiguration | undefined {
+        return this.configuration;
+    }
+
+    getPreviousPrompt(currentInput: string): string | undefined {
+        if (!this.navigationState) {
+            return undefined;
+        }
+        return this.navigationState.getPreviousPrompt(currentInput);
+    }
+
+    getNextPrompt(): string | undefined {
+        if (!this.navigationState) {
+            return undefined;
+        }
+        return this.navigationState.getNextPrompt();
+    }
+
+    protected chatInputFocusKey: ContextKey<boolean>;
+    protected chatInputFirstLineKey: ContextKey<boolean>;
+    protected chatInputLastLineKey: ContextKey<boolean>;
+    protected chatInputReceivingAgentKey: ContextKey<string>;
+
     protected isEnabled = false;
     protected heightInLines = 12;
 
+    protected updateReceivingAgentTimeout: number | undefined;
+
     protected _branch?: ChatHierarchyBranch;
     set branch(branch: ChatHierarchyBranch | undefined) {
         if (this._branch !== branch) {
@@ -111,7 +156,13 @@ export class AIChatInputWidget extends ReactWidget {
 
     protected _onQuery: Query;
     set onQuery(query: Query) {
-        this._onQuery = query;
+        this._onQuery = (prompt: string) => {
+            if (this.configuration?.enablePromptHistory !== false && prompt.trim()) {
+                this.historyService.addToHistory(prompt);
+                this.navigationState.stopNavigation();
+            }
+            return query(prompt);
+        };
     }
     protected _onUnpin: Unpin;
     set onUnpin(unpin: Unpin) {
@@ -146,11 +197,13 @@ export class AIChatInputWidget extends ReactWidget {
             }
         }));
         this._chatModel = chatModel;
+        this.scheduleUpdateReceivingAgent();
         this.update();
     }
     protected _pinnedAgent: ChatAgent | undefined;
     set pinnedAgent(pinnedAgent: ChatAgent | undefined) {
         this._pinnedAgent = pinnedAgent;
+        this.scheduleUpdateReceivingAgent();
         this.update();
     }
 
@@ -166,10 +219,134 @@ export class AIChatInputWidget extends ReactWidget {
             this.setEnabled(this.aiActivationService.isActive);
         }));
         this.toDispose.push(this.onDidResizeEmitter);
+        this.toDispose.push(Disposable.create(() => {
+            if (this.updateReceivingAgentTimeout !== undefined) {
+                clearTimeout(this.updateReceivingAgentTimeout);
+                this.updateReceivingAgentTimeout = undefined;
+            }
+        }));
         this.setEnabled(this.aiActivationService.isActive);
+        this.historyService.init().then(() => {
+            this.navigationState = new ChatInputNavigationState(this.historyService);
+        });
+        this.initializeContextKeys();
         this.update();
     }
 
+    protected initializeContextKeys(): void {
+        this.chatInputFocusKey = this.contextKeyService.createKey<boolean>('chatInputFocus', false);
+        this.chatInputFirstLineKey = this.contextKeyService.createKey<boolean>('chatInputFirstLine', false);
+        this.chatInputLastLineKey = this.contextKeyService.createKey<boolean>('chatInputLastLine', false);
+        this.chatInputReceivingAgentKey = this.contextKeyService.createKey<string>('chatInputReceivingAgent', '');
+    }
+
+    updateCursorPositionKeys(): void {
+        if (!this.editorRef) {
+            this.chatInputFirstLineKey.set(false);
+            this.chatInputLastLineKey.set(false);
+            return;
+        }
+
+        const editor = this.editorRef.getControl();
+        const position = editor.getPosition();
+        const model = editor.getModel();
+
+        if (!position || !model) {
+            this.chatInputFirstLineKey.set(false);
+            this.chatInputLastLineKey.set(false);
+            return;
+        }
+
+        const line = position.lineNumber;
+        const col = position.column;
+
+        const topAtPos = editor.getTopForPosition(line, col);
+        const topAtLineStart = editor.getTopForLineNumber(line);
+        const topAtLineEnd = editor.getTopForPosition(line, model.getLineMaxColumn(line));
+        const lineHeight = editor.getOption(EditorOption.lineHeight);
+        const toleranceValue = 0.5;
+
+        const isFirstVisualOfThisLine = Math.abs(topAtPos - topAtLineStart) < toleranceValue;
+        const isLastVisualOfThisLine = Math.abs(topAtPos - topAtLineEnd) < toleranceValue || (topAtPos > topAtLineEnd - lineHeight + toleranceValue);
+        const isFirstVisualOverall = line === 1 && isFirstVisualOfThisLine;
+
+        const isLastVisualOverall = line === model.getLineCount() && isLastVisualOfThisLine;
+
+        this.chatInputFirstLineKey.set(isFirstVisualOverall);
+        this.chatInputLastLineKey.set(isLastVisualOverall);
+    }
+
+    protected scheduleUpdateReceivingAgent(): void {
+        if (this.updateReceivingAgentTimeout !== undefined) {
+            clearTimeout(this.updateReceivingAgentTimeout);
+        }
+        this.updateReceivingAgentTimeout = window.setTimeout(() => {
+            this.updateReceivingAgent();
+            this.updateReceivingAgentTimeout = undefined;
+        }, 200);
+    }
+
+    protected async updateReceivingAgent(): Promise<void> {
+        if (!this.editorRef || !this._chatModel) {
+            this.chatInputReceivingAgentKey.set('');
+            return;
+        }
+
+        try {
+            const inputText = this.editorRef.getControl().getValue();
+            const request = { text: inputText };
+            const resolvedContext = { variables: [] };
+            const parsedRequest = await this.chatRequestParser.parseChatRequest(request, this._chatModel.location, resolvedContext);
+            const session = this.chatService.getSessions().find(s => s.model.id === this._chatModel.id);
+            if (session) {
+                const agent = this.chatService.getAgent(parsedRequest, session);
+                this.chatInputReceivingAgentKey.set(agent?.id ?? '');
+            } else {
+                this.chatInputReceivingAgentKey.set('');
+            }
+        } catch (error) {
+            console.warn('Failed to determine receiving agent:', error);
+            this.chatInputReceivingAgentKey.set('');
+        }
+    }
+
+    protected setupEditorEventListeners(): void {
+        if (!this.editorRef) {
+            return;
+        }
+
+        const editor = this.editorRef.getControl();
+
+        this.toDispose.push(editor.onDidFocusEditorWidget(() => {
+            this.chatInputFocusKey.set(true);
+            this.updateCursorPositionKeys();
+        }));
+
+        this.toDispose.push(editor.onDidBlurEditorWidget(() => {
+            this.chatInputFocusKey.set(false);
+            this.chatInputFirstLineKey.set(false);
+            this.chatInputLastLineKey.set(false);
+        }));
+
+        this.toDispose.push(editor.onDidChangeCursorPosition(() => {
+            if (editor.hasWidgetFocus()) {
+                this.updateCursorPositionKeys();
+            }
+        }));
+
+        this.toDispose.push(editor.onDidChangeModelContent(() => {
+            if (editor.hasWidgetFocus()) {
+                this.updateCursorPositionKeys();
+            }
+            this.scheduleUpdateReceivingAgent();
+        }));
+
+        if (editor.hasWidgetFocus()) {
+            this.chatInputFocusKey.set(true);
+            this.updateCursorPositionKeys();
+        }
+    }
+
     protected override onActivateRequest(msg: Message): void {
         super.onActivateRequest(msg);
         this.editorReady.promise.then(() => {
@@ -232,12 +409,14 @@ export class AIChatInputWidget extends ReactWidget {
                 isEnabled={this.isEnabled}
                 setEditorRef={editor => {
                     this.editorRef = editor;
+                    this.setupEditorEventListeners();
                     this.editorReady.resolve();
                 }}
                 showContext={this.configuration?.showContext}
                 showPinnedAgent={this.configuration?.showPinnedAgent}
                 showChangeSet={this.configuration?.showChangeSet}
                 showSuggestions={this.configuration?.showSuggestions}
+                hasPromptHistory={this.configuration?.enablePromptHistory}
                 labelProvider={this.labelProvider}
                 actionService={this.changeSetActionService}
                 decoratorService={this.changeSetDecoratorService}
@@ -388,6 +567,7 @@ interface ChatInputProperties {
     showPinnedAgent?: boolean;
     showChangeSet?: boolean;
     showSuggestions?: boolean;
+    hasPromptHistory?: boolean;
     labelProvider: LabelProvider;
     actionService: ChangeSetActionService;
     decoratorService: ChangeSetDecoratorService;
@@ -412,6 +592,8 @@ const ChatInput: React.FunctionComponent<ChatInputProperties> = (props: ChatInpu
     const onDeleteChangeSetElement = (uri: URI) => props.onDeleteChangeSetElement(props.chatModel.id, uri);
 
     const [isInputEmpty, setIsInputEmpty] = React.useState(true);
+    const [isInputFocused, setIsInputFocused] = React.useState(false);
+    const [placeholderText, setPlaceholderText] = React.useState('');
     const [changeSetUI, setChangeSetUI] = React.useState(
         () => buildChangeSetUI(
             props.chatModel.changeSet,
@@ -435,11 +617,16 @@ const ChatInput: React.FunctionComponent<ChatInputProperties> = (props: ChatInpu
     const isFirstRequest = props.chatModel.getRequests().length === 0;
     const shouldUseTaskPlaceholder = isFirstRequest && props.pinnedAgent && hasTaskContext(props.chatModel);
     const taskPlaceholder = nls.localize('theia/ai/chat-ui/performThisTask', 'Perform this task.');
-    const placeholderText = !props.isEnabled
-        ? nls.localize('theia/ai/chat-ui/aiDisabled', 'AI features are disabled')
-        : shouldUseTaskPlaceholder
-            ? taskPlaceholder
-            : nls.localizeByDefault('Ask a question');
+
+    // Update placeholder text when focus state or other dependencies change
+    React.useEffect(() => {
+        const newPlaceholderText = !props.isEnabled
+            ? nls.localize('theia/ai/chat-ui/aiDisabled', 'AI features are disabled')
+            : shouldUseTaskPlaceholder
+                ? taskPlaceholder
+                : nls.localizeByDefault('Ask a question') + (props.hasPromptHistory && isInputFocused ? nls.localizeByDefault(' ({0} for history)', '⇅') : '');
+        setPlaceholderText(newPlaceholderText);
+    }, [props.isEnabled, shouldUseTaskPlaceholder, taskPlaceholder, props.hasPromptHistory, isInputFocused]);
 
     // Handle paste events on the container
     const handlePaste = React.useCallback((event: ClipboardEvent) => {
@@ -680,6 +867,7 @@ const ChatInput: React.FunctionComponent<ChatInputProperties> = (props: ChatInpu
     }, [props.isEnabled, submit]);
 
     const handleInputFocus = () => {
+        setIsInputFocused(true);
         hidePlaceholderIfEditorFilled();
     };
 
@@ -689,6 +877,7 @@ const ChatInput: React.FunctionComponent<ChatInputProperties> = (props: ChatInpu
     };
 
     const handleInputBlur = () => {
+        setIsInputFocused(false);
         showPlaceholderIfEditorEmpty();
     };
 

package/src/browser/chat-response-renderer/tool-confirmation.tsx

@@ -22,7 +22,7 @@ import { ToolCallChatResponseContent } from '@theia/ai-chat/lib/common';
 /**
  * States the tool confirmation component can be in
  */
-export type ToolConfirmationState = 'waiting' | 'allowed' | 'denied';
+export type ToolConfirmationState = 'waiting' | 'allowed' | 'denied' | 'rejected';
 
 export interface ToolConfirmationProps {
     response: ToolCallChatResponseContent;

package/src/browser/chat-response-renderer/toolcall-part-renderer.tsx

@@ -22,10 +22,11 @@ import { nls } from '@theia/core/lib/common/nls';
 import { codicon, OpenerService } from '@theia/core/lib/browser';
 import * as React from '@theia/core/shared/react';
 import { ToolConfirmation, ToolConfirmationState } from './tool-confirmation';
-import { ToolConfirmationManager, ToolConfirmationMode } from '@theia/ai-chat/lib/browser/chat-tool-preferences';
+import { ToolConfirmationMode } from '@theia/ai-chat/lib/common/chat-tool-preferences';
 import { ResponseNode } from '../chat-tree-view';
 import { useMarkdownRendering } from './markdown-part-renderer';
 import { ToolCallResult } from '@theia/ai-core';
+import { ToolConfirmationManager } from '@theia/ai-chat/lib/browser/chat-tool-preference-bindings';
 
 @injectable()
 export class ToolCallPartRenderer implements ChatResponsePartRenderer<ToolCallChatResponseContent> {
@@ -52,7 +53,8 @@ export class ToolCallPartRenderer implements ChatResponsePartRenderer<ToolCallCh
             toolConfirmationManager={this.toolConfirmationManager}
             chatId={chatId}
             renderCollapsibleArguments={this.renderCollapsibleArguments.bind(this)}
-            responseRenderer={this.renderResult.bind(this)} />;
+            responseRenderer={this.renderResult.bind(this)}
+            requestCanceled={parentNode.response.isCanceled} />;
     }
 
     protected renderResult(response: ToolCallChatResponseContent): ReactNode {
@@ -138,13 +140,40 @@ interface ToolCallContentProps {
     chatId: string;
     renderCollapsibleArguments: (args: string | undefined) => ReactNode;
     responseRenderer: (response: ToolCallChatResponseContent) => ReactNode | undefined;
+    requestCanceled: boolean;
 }
 
 /**
  * A function component to handle tool call rendering and confirmation
  */
-const ToolCallContent: React.FC<ToolCallContentProps> = ({ response, confirmationMode, toolConfirmationManager, chatId, responseRenderer, renderCollapsibleArguments }) => {
+const ToolCallContent: React.FC<ToolCallContentProps> = ({
+    response,
+    confirmationMode,
+    toolConfirmationManager,
+    chatId,
+    responseRenderer,
+    renderCollapsibleArguments,
+    requestCanceled
+}) => {
     const [confirmationState, setConfirmationState] = React.useState<ToolConfirmationState>('waiting');
+    const [rejectionReason, setRejectionReason] = React.useState<unknown>(undefined);
+
+    const formatReason = (reason: unknown): string => {
+        if (!reason) {
+            return '';
+        }
+        if (reason instanceof Error) {
+            return reason.message;
+        }
+        if (typeof reason === 'string') {
+            return reason;
+        }
+        try {
+            return JSON.stringify(reason);
+        } catch (e) {
+            return String(reason);
+        }
+    };
 
     React.useEffect(() => {
         if (confirmationMode === ToolConfirmationMode.ALWAYS_ALLOW) {
@@ -156,17 +185,17 @@ const ToolCallContent: React.FC<ToolCallContentProps> = ({ response, confirmatio
             setConfirmationState('denied');
             return;
         }
-        response.confirmed.then(
-            confirmed => {
+        response.confirmed
+            .then(confirmed => {
                 if (confirmed === true) {
                     setConfirmationState('allowed');
                 } else {
                     setConfirmationState('denied');
                 }
-            }
-        )
-            .catch(() => {
-                setConfirmationState('denied');
+            })
+            .catch(reason => {
+                setRejectionReason(reason);
+                setConfirmationState('rejected');
             });
     }, [response, confirmationMode]);
 
@@ -188,9 +217,20 @@ const ToolCallContent: React.FC<ToolCallContentProps> = ({ response, confirmatio
         response.deny();
     }, [response, toolConfirmationManager, chatId]);
 
+    const reasonText = formatReason(rejectionReason);
+
     return (
         <div className='theia-toolCall'>
-            {confirmationState === 'denied' ? (
+            {confirmationState === 'rejected' ? (
+                <span className='theia-toolCall-rejected'>
+                    <span className={codicon('error')}></span> {nls.localize('theia/ai/chat-ui/toolcall-part-renderer/rejected', 'Execution canceled')}: {response.name}
+                    {reasonText ? <span> — {reasonText}</span> : undefined}
+                </span>
+            ) : requestCanceled && !response.finished ? (
+                <span className='theia-toolCall-rejected'>
+                    <span className={codicon('error')}></span> {nls.localize('theia/ai/chat-ui/toolcall-part-renderer/rejected', 'Execution canceled')}: {response.name}
+                </span>
+            ) : confirmationState === 'denied' ? (
                 <span className='theia-toolCall-denied'>
                     <span className={codicon('error')}></span> {nls.localize('theia/ai/chat-ui/toolcall-part-renderer/denied', 'Execution denied')}: {response.name}
                 </span>
@@ -205,7 +245,7 @@ const ToolCallContent: React.FC<ToolCallContentProps> = ({ response, confirmatio
                     </div>
                 </details>
             ) : (
-                confirmationState === 'allowed' && (
+                confirmationState === 'allowed' && !requestCanceled && (
                     <span className='theia-toolCall-allowed'>
                         <Spinner /> {nls.localizeByDefault('Running')} {response.name}
                     </span>
@@ -213,7 +253,7 @@ const ToolCallContent: React.FC<ToolCallContentProps> = ({ response, confirmatio
             )}
 
             {/* Show confirmation UI when waiting for allow */}
-            {confirmationState === 'waiting' && (
+            {confirmationState === 'waiting' && !requestCanceled && (
                 <span className='theia-toolCall-waiting'>
                     <ToolConfirmation
                         response={response}

package/src/browser/chat-view-commands.ts

@@ -18,26 +18,29 @@ import { Command, nls } from '@theia/core';
 import { codicon } from '@theia/core/lib/browser';
 
 export namespace ChatCommands {
-    const CHAT_CATEGORY = 'Chat';
-    const CHAT_CATEGORY_KEY = nls.getDefaultKey(CHAT_CATEGORY);
+    export const CHAT_CATEGORY = 'Chat';
+    export const CHAT_CATEGORY_KEY = nls.getDefaultKey(CHAT_CATEGORY);
 
     export const SCROLL_LOCK_WIDGET = Command.toLocalizedCommand({
         id: 'chat:widget:lock',
         category: CHAT_CATEGORY,
-        iconClass: codicon('unlock')
-    }, '', CHAT_CATEGORY_KEY);
+        iconClass: codicon('unlock'),
+        label: 'Lock Scroll'
+    }, 'theia/ai-chat-ui/scroll-lock', CHAT_CATEGORY_KEY);
 
     export const SCROLL_UNLOCK_WIDGET = Command.toLocalizedCommand({
         id: 'chat:widget:unlock',
         category: CHAT_CATEGORY,
-        iconClass: codicon('lock')
-    }, '', CHAT_CATEGORY_KEY);
+        iconClass: codicon('lock'),
+        label: 'Unlock Scroll'
+    }, 'theia/ai-chat-ui/scroll-unlock', CHAT_CATEGORY_KEY);
 
     export const EDIT_SESSION_SETTINGS = Command.toLocalizedCommand({
         id: 'chat:widget:session-settings',
         category: CHAT_CATEGORY,
-        iconClass: codicon('bracket')
-    }, 'Set Session Settings', CHAT_CATEGORY_KEY);
+        iconClass: codicon('bracket'),
+        label: 'Set Session Settings'
+    }, 'theia/ai-chat-ui/session-settings', CHAT_CATEGORY_KEY);
 
     export const AI_CHAT_NEW_WITH_TASK_CONTEXT: Command = {
         id: 'ai-chat.new-with-task-context',
@@ -47,29 +50,33 @@ export namespace ChatCommands {
         id: 'ai-chat.initiate-session-with-task-context',
         label: 'Task Context: Initiate Session',
         category: CHAT_CATEGORY
-    }, undefined, CHAT_CATEGORY_KEY);
+    }, 'theia/ai-chat-ui/initiate-session-task-context', CHAT_CATEGORY_KEY);
 
     export const AI_CHAT_SUMMARIZE_CURRENT_SESSION = Command.toLocalizedCommand({
         id: 'ai-chat-summary-current-session',
         iconClass: codicon('go-to-editing-session'),
         label: 'Summarize Current Session',
         category: CHAT_CATEGORY
-    }, undefined, CHAT_CATEGORY_KEY);
+    }, 'theia/ai-chat-ui/summarize-current-session', CHAT_CATEGORY_KEY);
 
     export const AI_CHAT_OPEN_SUMMARY_FOR_CURRENT_SESSION = Command.toLocalizedCommand({
         id: 'ai-chat-open-current-session-summary',
         iconClass: codicon('note'),
         label: 'Open Current Session Summary',
         category: CHAT_CATEGORY
-    }, undefined, CHAT_CATEGORY_KEY);
+    }, 'theia/ai-chat-ui/open-current-session-summary', CHAT_CATEGORY_KEY);
 }
 
-export const AI_CHAT_NEW_CHAT_WINDOW_COMMAND: Command = {
+export const AI_CHAT_NEW_CHAT_WINDOW_COMMAND = Command.toDefaultLocalizedCommand({
     id: 'ai-chat-ui.new-chat',
-    iconClass: codicon('add')
-};
+    iconClass: codicon('add'),
+    category: ChatCommands.CHAT_CATEGORY,
+    label: 'New Chat'
+});
 
-export const AI_CHAT_SHOW_CHATS_COMMAND: Command = {
+export const AI_CHAT_SHOW_CHATS_COMMAND = Command.toDefaultLocalizedCommand({
     id: 'ai-chat-ui.show-chats',
-    iconClass: codicon('history')
-};
+    iconClass: codicon('history'),
+    category: ChatCommands.CHAT_CATEGORY,
+    label: 'Show Chats...'
+});

package/src/browser/chat-view-widget.tsx

@@ -13,9 +13,9 @@
 //
 // SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
 // *****************************************************************************
-import { CommandService, deepClone, Emitter, Event, MessageService, URI } from '@theia/core';
+import { CommandService, deepClone, Emitter, Event, MessageService, PreferenceService, URI } from '@theia/core';
 import { ChatRequest, ChatRequestModel, ChatService, ChatSession, isActiveSessionChangedEvent, MutableChatModel } from '@theia/ai-chat';
-import { BaseWidget, codicon, ExtractableWidget, Message, PanelLayout, PreferenceService, StatefulWidget } from '@theia/core/lib/browser';
+import { BaseWidget, codicon, ExtractableWidget, Message, PanelLayout, StatefulWidget } from '@theia/core/lib/browser';
 import { nls } from '@theia/core/lib/common/nls';
 import { inject, injectable, postConstruct } from '@theia/core/shared/inversify';
 import { AIChatInputWidget } from './chat-input-widget';
@@ -64,6 +64,7 @@ export class ChatViewWidget extends BaseWidget implements ExtractableWidget, Sta
     protected _state: ChatViewWidget.State = { locked: false, temporaryLocked: false };
     protected readonly onStateChangedEmitter = new Emitter<ChatViewWidget.State>();
 
+    isExtractable = true;
     secondaryWindow: Window | undefined;
 
     constructor(
@@ -239,10 +240,6 @@ export class ChatViewWidget extends BaseWidget implements ExtractableWidget, Sta
         return !!this.state.locked;
     }
 
-    get isExtractable(): boolean {
-        return this.secondaryWindow === undefined;
-    }
-
     addContext(variable: AIVariableResolutionRequest): void {
         this.inputWidget.addContext(variable);
     }