feat(chat-client): add shortcut for stop/reject/run commands (aws#1932)

dungdong-aws · web-flow · commit 087f3387ba73 · 2025-07-22T11:30:40.000-07:00
* feat(amazonq): add keyboard shortcut for run/reject/stop shell commands

* feat(amazonq): add feature flag for keyboard shortcut and update key for run

* fix: update package lock

* fix: remove debug logs

* feat: add back reject shortcut keyboard

* fix: update keybind and resolve interface for KeyBinding to make it for general usage

* fix: dont support user change default keybind for p0

* feat: add tooltip to Stop button on chat-item-card

* fix: remove invalid interface

* chore: clean up codes

* fix: add type to executeShellCommandShortCut() params

* fix: make shift shortcut text to icon instead

* fix: update type name and UI for tooltip

* chore: bump to the latest mynah-ui and lsr version

* fix: bump up LSR version and change string to enum for executeShellCommandShortcut

* fix(chat-client): properly stop chat through shortcut, make shortcut only available if focus
diff --git a/chat-client/src/client/chat.ts b/chat-client/src/client/chat.ts
@@ -107,6 +107,7 @@ import {
     OpenFileDialogParams,
     OPEN_FILE_DIALOG_METHOD,
     OpenFileDialogResult,
+    EXECUTE_SHELL_COMMAND_SHORTCUT_METHOD,
 } from '@aws/language-server-runtimes-types'
 import { ConfigTexts, MynahUIDataModel, MynahUITabStoreModel } from '@aws/mynah-ui'
 import { ServerMessage, TELEMETRY, TelemetryParams } from '../contracts/serverContracts'
@@ -130,6 +131,7 @@ type ChatClientConfig = Pick<MynahUIDataModel, 'quickActionCommands'> & {
     agenticMode?: boolean
     modelSelectionEnabled?: boolean
     stringOverrides?: Partial<ConfigTexts>
+    os?: string
 }
 
 export const createChat = (
@@ -183,6 +185,9 @@ export const createChat = (
         }
 
         switch (message?.command) {
+            case EXECUTE_SHELL_COMMAND_SHORTCUT_METHOD:
+                mynahApi.executeShellCommandShortCut(message.params)
+                break
             case CHAT_REQUEST_METHOD:
                 mynahApi.addChatResponse(message.params, message.tabId, message.isPartialResult)
                 break
@@ -537,7 +542,8 @@ export const createChat = (
         chatClientAdapter,
         featureConfig,
         !!config?.agenticMode,
-        config?.stringOverrides
+        config?.stringOverrides,
+        config?.os
     )
 
     mynahApi = api
diff --git a/chat-client/src/client/mynahUi.ts b/chat-client/src/client/mynahUi.ts
@@ -37,6 +37,7 @@ import {
     RuleClickResult,
     SourceLinkClickParams,
     ListAvailableModelsResult,
+    ExecuteShellCommandParams,
 } from '@aws/language-server-runtimes-types'
 import {
     ChatItem,
@@ -94,6 +95,7 @@ export interface InboundChatApi {
     openTab(requestId: string, params: OpenTabParams): void
     sendContextCommands(params: ContextCommandParams): void
     listConversations(params: ListConversationsResult): void
+    executeShellCommandShortCut(params: ExecuteShellCommandParams): void
     listRules(params: ListRulesResult): void
     conversationClicked(params: ConversationClickResult): void
     ruleClicked(params: RuleClickResult): void
@@ -313,7 +315,8 @@ export const createMynahUi = (
     customChatClientAdapter?: ChatClientAdapter,
     featureConfig?: Map<string, any>,
     agenticMode?: boolean,
-    stringOverrides?: Partial<ConfigTexts>
+    stringOverrides?: Partial<ConfigTexts>,
+    os?: string
 ): [MynahUI, InboundChatApi] => {
     let disclaimerCardActive = !disclaimerAcknowledged
     let programmingModeCardActive = !pairProgrammingCardAcknowledged
@@ -690,24 +693,7 @@ export const createMynahUi = (
             }
         },
         onStopChatResponse: tabId => {
-            messager.onStopChatResponse(tabId)
-
-            // Reset loading state
-            mynahUi.updateStore(tabId, {
-                loadingChat: false,
-                cancelButtonWhenLoading: true,
-                promptInputDisabledState: false,
-            })
-
-            // Add a small delay before adding the chat item
-            setTimeout(() => {
-                // Add cancellation message when stop button is clicked
-                mynahUi.addChatItem(tabId, {
-                    type: ChatItemType.DIRECTIVE,
-                    messageId: 'stopped' + Date.now(),
-                    body: 'You stopped your current work, please provide additional examples or ask another question.',
-                })
-            }, 500) // 500ms delay
+            handleUIStopChatResponse(messager, mynahUi, tabId)
         },
         onOpenFileDialogClick: (tabId, fileType, insertPosition) => {
             const imageContext = getImageContextCount(tabId)
@@ -818,6 +804,7 @@ export const createMynahUi = (
                 dragOverlayText: 'Add image to context',
                 // Fallback to original texts in non-agentic chat mode
                 stopGenerating: agenticMode ? uiComponentsTexts.stopGenerating : 'Stop generating',
+                stopGeneratingTooltip: getStopGeneratingToolTipText(os, agenticMode),
                 spinnerText: agenticMode ? uiComponentsTexts.spinnerText : 'Generating your answer...',
                 ...stringOverrides,
             },
@@ -1459,6 +1446,55 @@ ${params.message}`,
         messager.onError(params)
     }
 
+    const executeShellCommandShortCut = (params: ExecuteShellCommandParams) => {
+        const activeElement = document.activeElement as HTMLElement
+
+        const tabId = mynahUi.getSelectedTabId()
+        if (!tabId) return
+
+        const chatItems = mynahUi.getTabData(tabId)?.getStore()?.chatItems || []
+        const buttonId = params.id
+
+        let messageId
+        for (const item of chatItems) {
+            if (buttonId === 'stop-shell-command' && item.buttons && item.buttons.some(b => b.id === buttonId)) {
+                messageId = item.messageId
+                break
+            }
+            if (item.header?.buttons && item.header.buttons.some(b => b.id === buttonId)) {
+                messageId = item.messageId
+                break
+            }
+        }
+
+        if (messageId) {
+            const payload: ButtonClickParams = {
+                tabId,
+                messageId,
+                buttonId,
+            }
+            messager.onButtonClick(payload)
+            if (buttonId === 'stop-shell-command') {
+                handleUIStopChatResponse(messager, mynahUi, tabId)
+            }
+        } else {
+            // handle global stop
+            const isLoading = mynahUi.getTabData(tabId)?.getStore()?.loadingChat
+            if (isLoading && buttonId === 'stop-shell-command') {
+                handleUIStopChatResponse(messager, mynahUi, tabId)
+            }
+        }
+        // this is a short-term solution to re-gain focus after executing a shortcut
+        // current behavior will emit exitFocus telemetry immediadately.
+        // use this to re-gain focus, so that user can use shortcut after shortcut
+        // without manually re-gain focus.
+        setTimeout(() => {
+            if (activeElement && activeElement.focus) {
+                activeElement.focus()
+            }
+        }, 100)
+    }
+
     const openTab = (requestId: string, params: OpenTabParams) => {
         if (params.tabId) {
             if (params.tabId !== mynahUi.getSelectedTabId()) {
@@ -1684,6 +1720,7 @@ ${params.message}`,
         openTab: openTab,
         sendContextCommands: sendContextCommands,
         sendPinnedContext: sendPinnedContext,
+        executeShellCommandShortCut: executeShellCommandShortCut,
         listConversations: listConversations,
         listRules: listRules,
         conversationClicked: conversationClicked,
@@ -1730,4 +1767,37 @@ export const uiComponentsTexts = {
     noMoreTabsTooltip: 'You can only open ten conversation tabs at a time.',
     codeSuggestionWithReferenceTitle: 'Some suggestions contain code with references.',
     spinnerText: 'Working...',
+    macStopButtonShortcut: '&#8679; &#8984; &#9003;',
+    windowStopButtonShortcut: 'Ctrl + &#8679; + &#9003;',
+}
+
+const getStopGeneratingToolTipText = (os: string | undefined, agenticMode: boolean | undefined): string => {
+    if (agenticMode && os) {
+        return os === 'darwin'
+            ? `Stop:  ${uiComponentsTexts.macStopButtonShortcut}`
+            : `Stop:  ${uiComponentsTexts.windowStopButtonShortcut}`
+    }
+
+    return agenticMode ? uiComponentsTexts.stopGenerating : 'Stop generating'
+}
+
+const handleUIStopChatResponse = (messenger: Messager, mynahUi: MynahUI, tabId: string) => {
+    messenger.onStopChatResponse(tabId)
+
+    // Reset loading state
+    mynahUi.updateStore(tabId, {
+        loadingChat: false,
+        cancelButtonWhenLoading: true,
+        promptInputDisabledState: false,
+    })
+
+    // Add a small delay before adding the chat item
+    setTimeout(() => {
+        // Add cancellation message when stop button is clicked
+        mynahUi.addChatItem(tabId, {
+            type: ChatItemType.DIRECTIVE,
+            messageId: 'stopped' + Date.now(),
+            body: 'You stopped your current work, please provide additional examples or ask another question.',
+        })
+    }, 500) // 500ms delay
 }
diff --git a/client/vscode/src/activation.ts b/client/vscode/src/activation.ts
@@ -5,6 +5,7 @@
 
 import * as cp from 'child_process'
 import * as path from 'path'
+import * as os from 'os'
 
 import { ExtensionContext, env, version } from 'vscode'
 
@@ -147,13 +148,15 @@ export async function activateDocumentsLanguageServer(extensionContext: Extensio
     const enableChat = process.env.ENABLE_CHAT === 'true'
     const agenticMode = process.env.ENABLE_AGENTIC_UI_MODE === 'true'
     const modelSelectionEnabled = process.env.ENABLE_MODEL_SELECTION === 'true'
+    const osPlatform = os.platform()
     if (enableChat) {
         registerChat(
             client,
             extensionContext.extensionUri,
             enableEncryptionInit ? encryptionKey : undefined,
             agenticMode,
-            modelSelectionEnabled
+            modelSelectionEnabled,
+            osPlatform
         )
     }
 
diff --git a/client/vscode/src/chatActivation.ts b/client/vscode/src/chatActivation.ts
@@ -6,7 +6,6 @@ import {
     CHAT_OPTIONS,
     COPY_TO_CLIPBOARD,
     UiMessageResultParams,
-    OPEN_FILE_DIALOG,
 } from '@aws/chat-client-ui-types'
 import {
     ChatResult,
@@ -37,8 +36,6 @@ import {
     chatUpdateNotificationType,
     listRulesRequestType,
     ruleClickRequestType,
-    openFileDialogRequestType,
-    OPEN_FILE_DIALOG_METHOD,
 } from '@aws/language-server-runtimes/protocol'
 import { v4 as uuidv4 } from 'uuid'
 import { Uri, Webview, WebviewView, commands, window } from 'vscode'
@@ -58,7 +55,8 @@ export function registerChat(
     extensionUri: Uri,
     encryptionKey?: Buffer,
     agenticMode?: boolean,
-    modelSelectionEnabled?: boolean
+    modelSelectionEnabled?: boolean,
+    os?: string
 ) {
     const webviewInitialized: Promise<Webview> = new Promise(resolveWebview => {
         const provider = {
@@ -71,8 +69,7 @@ export function registerChat(
                 resolveWebview(webviewView.webview)
 
                 webviewView.webview.onDidReceiveMessage(async message => {
-                    languageClient.info(`[VSCode Client]  Received ${JSON.stringify(message)} from chat`)
-
+                    languageClient.info(`[VSCode Client]  Received ${JSON.stringify(message)}`)
                     switch (message.command) {
                         case COPY_TO_CLIPBOARD:
                             languageClient.info('[VSCode Client] Copy to clipboard event received')
@@ -301,7 +298,8 @@ export function registerChat(
                     webviewView.webview,
                     extensionUri,
                     !!agenticMode,
-                    !!modelSelectionEnabled
+                    !!modelSelectionEnabled,
+                    os!
                 )
 
                 registerGenericCommand('aws.sample-vscode-ext-amazonq.explainCode', 'Explain', webviewView.webview)
@@ -435,7 +433,13 @@ async function handleRequest(
     })
 }
 
-function getWebviewContent(webView: Webview, extensionUri: Uri, agenticMode: boolean, modelSelectionEnabled: boolean) {
+function getWebviewContent(
+    webView: Webview,
+    extensionUri: Uri,
+    agenticMode: boolean,
+    modelSelectionEnabled: boolean,
+    os: string
+) {
     return `
     <!DOCTYPE html>
     <html lang="en">
@@ -446,7 +450,7 @@ function getWebviewContent(webView: Webview, extensionUri: Uri, agenticMode: boo
         ${generateCss()}
     </head>
     <body>
-        ${generateJS(webView, extensionUri, agenticMode, modelSelectionEnabled)}
+        ${generateJS(webView, extensionUri, agenticMode, modelSelectionEnabled, os)}
     </body>
     </html>`
 }
@@ -467,7 +471,13 @@ function generateCss() {
     </style>`
 }
 
-function generateJS(webView: Webview, extensionUri: Uri, agenticMode: boolean, modelSelectionEnabled: boolean): string {
+function generateJS(
+    webView: Webview,
+    extensionUri: Uri,
+    agenticMode: boolean,
+    modelSelectionEnabled: boolean,
+    os: string
+): string {
     const assetsPath = Uri.joinPath(extensionUri)
     const chatUri = Uri.joinPath(assetsPath, 'build', 'amazonq-ui.js')
 
@@ -486,7 +496,7 @@ function generateJS(webView: Webview, extensionUri: Uri, agenticMode: boolean, m
     <script type="text/javascript">
         const init = () => {
             amazonQChat.createChat(acquireVsCodeApi(), 
-                {disclaimerAcknowledged: false, agenticMode: ${!!agenticMode}, modelSelectionEnabled: ${!!modelSelectionEnabled}},
+                {disclaimerAcknowledged: false, agenticMode: ${!!agenticMode}, modelSelectionEnabled: ${!!modelSelectionEnabled}, os: "${os}"},
                 undefined,
                 JSON.stringify(${stringifiedContextCommands})
             );
diff --git a/server/aws-lsp-codewhisperer/src/language-server/agenticChat/agenticChatController.ts b/server/aws-lsp-codewhisperer/src/language-server/agenticChat/agenticChatController.ts
@@ -2250,7 +2250,7 @@ export class AgenticChatController implements ChatHandlers {
 
         const initialHeader: ChatMessage['header'] = {
             body: 'shell',
-            buttons: [{ id: BUTTON_STOP_SHELL_COMMAND, text: 'Stop', icon: 'stop' }],
+            buttons: [this.#renderStopShellCommandButton()],
         }
 
         const completedHeader: ChatMessage['header'] = {
@@ -2327,7 +2327,7 @@ export class AgenticChatController implements ChatHandlers {
                                   text: 'Rejected',
                               },
                           }),
-                    buttons: isAccept ? [{ id: BUTTON_STOP_SHELL_COMMAND, text: 'Stop', icon: 'stop' }] : [],
+                    buttons: isAccept ? [this.#renderStopShellCommandButton()] : [],
                 },
             }
         }
@@ -2503,7 +2503,7 @@ export class AgenticChatController implements ChatHandlers {
     #renderStopShellCommandButton() {
         const stopKey = this.#getKeyBinding('aws.amazonq.stopCmdExecution')
         return {
-            id: 'stop-shell-command',
+            id: BUTTON_STOP_SHELL_COMMAND,
             text: 'Stop',
             icon: 'stop',
             ...(stopKey ? { description: `Stop:  ${stopKey}` } : {}),
@@ -2574,14 +2574,28 @@ export class AgenticChatController implements ChatHandlers {
         switch (toolName) {
             case EXECUTE_BASH: {
                 const commandString = (toolUse.input as unknown as ExecuteBashParams).command
+                // get feature flag
+                const shortcut =
+                    this.#features.lsp.getClientInitializeParams()?.initializationOptions?.aws?.awsClientCapabilities?.q
+                        ?.shortcut
+
+                const runKey = this.#getKeyBinding('aws.amazonq.runCmdExecution')
+                const rejectKey = this.#getKeyBinding('aws.amazonq.rejectCmdExecution')
+
                 buttons = requiresAcceptance
                     ? [
-                          { id: BUTTON_RUN_SHELL_COMMAND, text: 'Run', icon: 'play' },
+                          {
+                              id: BUTTON_RUN_SHELL_COMMAND,
+                              text: 'Run',
+                              icon: 'play',
+                              ...(runKey ? { description: `Run:  ${runKey}` } : {}),
+                          },
                           {
                               id: BUTTON_REJECT_SHELL_COMMAND,
                               status: 'dimmed-clear' as Status,
                               text: 'Reject',
                               icon: 'cancel',
+                              ...(rejectKey ? { description: `Reject:  ${rejectKey}` } : {}),
                           },
                       ]
                     : []
diff --git a/server/aws-lsp-codewhisperer/src/language-server/agenticChat/qAgenticChatServer.ts b/server/aws-lsp-codewhisperer/src/language-server/agenticChat/qAgenticChatServer.ts
diff --git a/server/aws-lsp-codewhisperer/src/language-server/configuration/qConfigurationServer.ts b/server/aws-lsp-codewhisperer/src/language-server/configuration/qConfigurationServer.ts
