feat(amazonq): add /help and /clear quick action commands (#6862)

jpinkney-aws · web-flow · commit 621622b1b8cb · 2025-04-01T07:55:47.000-04:00
## Problem /help and /clear quick action commands are missing from the flare chat implementation ## Solution add them --- - Treat all work as PUBLIC. Private `feature/x` branches will not be squash-merged at release time. - Your code changes must meet the guidelines in [CONTRIBUTING.md](https://github.com/aws/aws-toolkit-vscode/blob/master/CONTRIBUTING.md#guidelines). - License: I confirm that my contribution is made under the terms of the Apache 2.0 license.
diff --git a/packages/amazonq/src/lsp/chat/webviewProvider.ts b/packages/amazonq/src/lsp/chat/webviewProvider.ts
@@ -13,6 +13,7 @@ import {
     Uri,
 } from 'vscode'
 import { LanguageServerResolver } from 'aws-core-vscode/shared'
+import { QuickActionCommandGroup } from '@aws/mynah-ui'
 
 export class AmazonQChatViewProvider implements WebviewViewProvider {
     public static readonly viewType = 'aws.amazonq.AmazonQChatView'
@@ -21,6 +22,24 @@ export class AmazonQChatViewProvider implements WebviewViewProvider {
 
     webview: Webview | undefined
 
+    private readonly quickActionCommands: QuickActionCommandGroup[] = [
+        {
+            groupName: 'Quick Actions',
+            commands: [
+                {
+                    command: '/help',
+                    icon: 'help',
+                    description: 'Learn more about Amazon Q',
+                },
+                {
+                    command: '/clear',
+                    icon: 'trash',
+                    description: 'Clear this session',
+                },
+            ],
+        },
+    ]
+
     constructor(private readonly mynahUIPath: string) {}
 
     public resolveWebviewView(webviewView: WebviewView, context: WebviewViewResolveContext, _token: CancellationToken) {
@@ -34,40 +53,40 @@ export class AmazonQChatViewProvider implements WebviewViewProvider {
         }
 
         const uiPath = webviewView.webview.asWebviewUri(Uri.parse(this.mynahUIPath)).toString()
-        webviewView.webview.html = getWebviewContent(uiPath)
+        webviewView.webview.html = this.getWebviewContent(uiPath)
 
         this.onDidResolveWebviewEmitter.fire()
     }
-}
 
-function getWebviewContent(mynahUIPath: string) {
-    return `
-    <!DOCTYPE html>
-    <html lang="en">
-    <head>
-        <meta charset="UTF-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <title>Chat</title>
-        <style>
-            body,
-            html {
-                background-color: var(--mynah-color-bg);
-                color: var(--mynah-color-text-default);
-                height: 100%;
-                width: 100%;
-                overflow: hidden;
-                margin: 0;
-                padding: 0;
-            }
-        </style>
-    </head>
-    <body>
-        <script type="text/javascript" src="${mynahUIPath.toString()}" defer onload="init()"></script>
-        <script type="text/javascript">
-            const init = () => {
-                amazonQChat.createChat(acquireVsCodeApi(), {disclaimerAcknowledged: false});
-            }
-        </script>
-    </body>
-    </html>`
+    private getWebviewContent(mynahUIPath: string) {
+        return `
+        <!DOCTYPE html>
+        <html lang="en">
+        <head>
+            <meta charset="UTF-8">
+            <meta name="viewport" content="width=device-width, initial-scale=1.0">
+            <title>Chat</title>
+            <style>
+                body,
+                html {
+                    background-color: var(--mynah-color-bg);
+                    color: var(--mynah-color-text-default);
+                    height: 100%;
+                    width: 100%;
+                    overflow: hidden;
+                    margin: 0;
+                    padding: 0;
+                }
+            </style>
+        </head>
+        <body>
+            <script type="text/javascript" src="${mynahUIPath.toString()}" defer onload="init()"></script>
+            <script type="text/javascript">
+                const init = () => {
+                    amazonQChat.createChat(acquireVsCodeApi(), { disclaimerAcknowledged: false, quickActionCommands: ${JSON.stringify(this.quickActionCommands)}});
+                }
+            </script>
+        </body>
+        </html>`
+    }
 }
