fix(amazonq): code-block styling #4253

dogusata · web-flow · commit f126a56d12b6 · 2024-01-10T04:56:56.000-08:00
Problem:
With the new version of VSCode, they've implemented a global styling for code blocks to give background color to the texts inside them which also effects the code blocks in the Q Chat too.

Solution:
MynahUI 3.3.2 adds code block background color as inherited from parent.
* update mynah ui version
* rename mynah-ui version to its true name
diff --git a/.changes/next-release/Bug Fix-335f2fb2-ad96-4031-8777-1edba11b4d21.json b/.changes/next-release/Bug Fix-335f2fb2-ad96-4031-8777-1edba11b4d21.json
@@ -0,0 +1,4 @@
+{
+	"type": "Bug Fix",
+	"description": "Amazon Q Chat: Fixed code block text background"
+}
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -4348,7 +4348,7 @@
         "@aws-sdk/property-provider": "3.46.0",
         "@aws-sdk/smithy-client": "^3.46.0",
         "@aws-sdk/util-arn-parser": "^3.46.0",
-        "@aws/mynah-ui-chat": "npm:@aws/mynah-ui@3.2.10",
+        "@aws/mynah-ui": "3.3.3",
         "@gerhobbelt/gitignore-parser": "^0.2.0-9",
         "@iarna/toml": "^2.2.5",
         "@smithy/shared-ini-file-loader": "^2.2.8",
diff --git a/src/amazonq/webview/ui/apps/amazonqCommonsConnector.ts b/src/amazonq/webview/ui/apps/amazonqCommonsConnector.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { ChatItemFollowUp } from '@aws/mynah-ui-chat'
+import { ChatItemFollowUp } from '@aws/mynah-ui'
 import { ExtensionMessage } from '../commands'
 import { AuthFollowUpType } from '../followUps/generator'
 
diff --git a/src/amazonq/webview/ui/apps/cwChatConnector.ts b/src/amazonq/webview/ui/apps/cwChatConnector.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { ChatItem, ChatItemFollowUp, ChatItemType, FeedbackPayload } from '@aws/mynah-ui-chat'
+import { ChatItem, ChatItemFollowUp, ChatItemType, FeedbackPayload } from '@aws/mynah-ui'
 import { ExtensionMessage } from '../commands'
 import { CodeReference } from './amazonqCommonsConnector'
 import { TabOpenType, TabsStorage } from '../storages/tabsStorage'
diff --git a/src/amazonq/webview/ui/apps/featureDevChatConnector.ts b/src/amazonq/webview/ui/apps/featureDevChatConnector.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { ChatItem, ChatItemFollowUp, ChatItemType, FeedbackPayload } from '@aws/mynah-ui-chat'
+import { ChatItem, ChatItemFollowUp, ChatItemType, FeedbackPayload } from '@aws/mynah-ui'
 import { ExtensionMessage } from '../commands'
 import { TabType, TabsStorage } from '../storages/tabsStorage'
 import { CodeReference } from './amazonqCommonsConnector'
diff --git a/src/amazonq/webview/ui/connector.ts b/src/amazonq/webview/ui/connector.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { ChatItem, ChatItemFollowUp, FeedbackPayload, Engagement } from '@aws/mynah-ui-chat'
+import { ChatItem, ChatItemFollowUp, FeedbackPayload, Engagement } from '@aws/mynah-ui'
 import { Connector as CWChatConnector } from './apps/cwChatConnector'
 import { Connector as FeatureDevChatConnector } from './apps/featureDevChatConnector'
 import { Connector as AmazonQCommonsConnector } from './apps/amazonqCommonsConnector'
diff --git a/src/amazonq/webview/ui/followUps/generator.ts b/src/amazonq/webview/ui/followUps/generator.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { MynahIcons } from '@aws/mynah-ui-chat'
+import { MynahIcons } from '@aws/mynah-ui'
 import { TabType } from '../storages/tabsStorage'
 import { FollowUpsBlock } from './model'
 
diff --git a/src/amazonq/webview/ui/followUps/handler.ts b/src/amazonq/webview/ui/followUps/handler.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { ChatItemFollowUp, ChatItemType, MynahUI } from '@aws/mynah-ui-chat'
+import { ChatItemFollowUp, ChatItemType, MynahUI } from '@aws/mynah-ui'
 import { Connector } from '../connector'
 import { TabsStorage } from '../storages/tabsStorage'
 import { WelcomeFollowupType } from '../apps/amazonqCommonsConnector'
diff --git a/src/amazonq/webview/ui/followUps/model.ts b/src/amazonq/webview/ui/followUps/model.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { ChatItemFollowUp } from '@aws/mynah-ui-chat'
+import { ChatItemFollowUp } from '@aws/mynah-ui'
 
 export interface FollowUpsBlock {
     text?: string
diff --git a/src/amazonq/webview/ui/main.ts b/src/amazonq/webview/ui/main.ts
@@ -3,9 +3,9 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 import { Connector } from './connector'
-import { ChatItem, ChatItemType, MynahUI, MynahUIDataModel, NotificationType } from '@aws/mynah-ui-chat'
+import { ChatItem, ChatItemType, MynahUI, MynahUIDataModel, NotificationType } from '@aws/mynah-ui'
 import './styles/dark.scss'
-import { ChatPrompt } from '@aws/mynah-ui-chat/dist/static'
+import { ChatPrompt } from '@aws/mynah-ui/dist/static'
 import { TabsStorage, TabType } from './storages/tabsStorage'
 import { WelcomeFollowupType } from './apps/amazonqCommonsConnector'
 import { TabDataGenerator } from './tabs/generator'
diff --git a/src/amazonq/webview/ui/messages/controller.ts b/src/amazonq/webview/ui/messages/controller.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { ChatItem, ChatItemType, MynahUI, NotificationType } from '@aws/mynah-ui-chat'
+import { ChatItem, ChatItemType, MynahUI, NotificationType } from '@aws/mynah-ui'
 import { Connector } from '../connector'
 import { TabType, TabsStorage } from '../storages/tabsStorage'
 import { TabDataGenerator } from '../tabs/generator'
diff --git a/src/amazonq/webview/ui/messages/handler.ts b/src/amazonq/webview/ui/messages/handler.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { ChatItemType, ChatPrompt, MynahUI } from '@aws/mynah-ui-chat'
+import { ChatItemType, ChatPrompt, MynahUI } from '@aws/mynah-ui'
 import { Connector } from '../connector'
 import { TabsStorage } from '../storages/tabsStorage'
 
@@ -31,13 +31,6 @@ export class TextMessageHandler {
         this.mynahUI.addChatItem(tabID, {
             type: ChatItemType.PROMPT,
             body: chatPrompt.escapedPrompt,
-            ...(chatPrompt.attachment !== undefined
-                ? {
-                      relatedContent: {
-                          content: [chatPrompt.attachment],
-                      },
-                  }
-                : {}),
         })
 
         this.mynahUI.updateStore(tabID, {
diff --git a/src/amazonq/webview/ui/quickActions/generator.ts b/src/amazonq/webview/ui/quickActions/generator.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { QuickActionCommandGroup } from '@aws/mynah-ui-chat/dist/static'
+import { QuickActionCommandGroup } from '@aws/mynah-ui/dist/static'
 import { TabType } from '../storages/tabsStorage'
 
 export interface QuickActionGeneratorProps {
diff --git a/src/amazonq/webview/ui/quickActions/handler.ts b/src/amazonq/webview/ui/quickActions/handler.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { ChatItemType, ChatPrompt, MynahUI, NotificationType } from '@aws/mynah-ui-chat'
+import { ChatItemType, ChatPrompt, MynahUI, NotificationType } from '@aws/mynah-ui'
 import { TabDataGenerator } from '../tabs/generator'
 import { Connector } from '../connector'
 import { TabsStorage } from '../storages/tabsStorage'
@@ -104,13 +104,6 @@ export class QuickActionHandler {
                 this.mynahUI.addChatItem(affectedTabId, {
                     type: ChatItemType.PROMPT,
                     body: realPromptText,
-                    ...(chatPrompt.attachment !== undefined
-                        ? {
-                              relatedContent: {
-                                  content: [chatPrompt.attachment],
-                              },
-                          }
-                        : {}),
                 })
 
                 this.mynahUI.addChatItem(affectedTabId, {
diff --git a/src/amazonq/webview/ui/tabs/generator.ts b/src/amazonq/webview/ui/tabs/generator.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { ChatItemType, MynahUIDataModel } from '@aws/mynah-ui-chat'
+import { ChatItemType, MynahUIDataModel } from '@aws/mynah-ui'
 import { TabType } from '../storages/tabsStorage'
 import { FollowUpGenerator } from '../followUps/generator'
 import { QuickActionGenerator } from '../quickActions/generator'
diff --git a/src/amazonqFeatureDev/controllers/chat/controller.ts b/src/amazonqFeatureDev/controllers/chat/controller.ts
@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { ChatItemFollowUp } from '@aws/mynah-ui-chat'
+import { ChatItemFollowUp } from '@aws/mynah-ui'
 import { existsSync } from 'fs'
 import * as path from 'path'
 import * as vscode from 'vscode'
diff --git a/src/amazonqFeatureDev/controllers/chat/messenger/messenger.ts b/src/amazonqFeatureDev/controllers/chat/messenger/messenger.ts
@@ -17,7 +17,7 @@ import {
     OpenNewTabMessage,
 } from '../../../views/connector/connector'
 import { AppToWebViewMessageDispatcher } from '../../../views/connector/connector'
-import { ChatItemFollowUp } from '@aws/mynah-ui-chat'
+import { ChatItemFollowUp } from '@aws/mynah-ui'
 
 export class Messenger {
     public constructor(private readonly dispatcher: AppToWebViewMessageDispatcher) {}
diff --git a/src/amazonqFeatureDev/views/connector/connector.ts b/src/amazonqFeatureDev/views/connector/connector.ts
@@ -7,7 +7,7 @@ import { AuthFollowUpType } from '../../../amazonq/auth/model'
 import { MessagePublisher } from '../../../amazonq/messages/messagePublisher'
 import { featureDevChat } from '../../constants'
 import { ChatItemType } from '../../models'
-import { ChatItemFollowUp, SourceLink } from '@aws/mynah-ui-chat'
+import { ChatItemFollowUp, SourceLink } from '@aws/mynah-ui'
 
 class UiMessage {
     readonly time: number = Date.now()

-Original file line number
+Diff line change
@@ @@ -0,0 +1,4 @@ @@
 +{
 +	"type": "Bug Fix",
 +	"description": "Amazon Q Chat: Fixed code block text background"
 +}