fix(stepfunctions): Bug fixes - handling unsupported messages, fix undo sync bug, code cleanup (#6667)

## Problem
1. In case we introduce new feature dependant on the Toolkit change in
the future, users may face issues if they don't update their toolkit
right away (as their toolkit version won't have the new functionality in
place)
2. There was a regression from my [previous
PR](9c40f4c),
in `package.json` - most possibly due to incorrect merge conflict
resolution (since the original file has been moved to another folder).
The regression is that undo command override is not working, causing
uncorrect undo command behaviour when triggered from webview
3. There is some redundant code which is not useful and causes incorrect
behaviour, showing in the webview view screen

## Solution
1. To ensure compatibility, we are adding an unsupported message handler
in advance. In case of unsupported message it will send an appropriate
response back to the webview, so we will be able to use it to handle the
error gracefully on the webview side
2. Adding back the undo command override (only when WFS editor is
active). More context on why it's needed on [previous
PR](#6024), which was
approved and merged previously. Verified that the command only applies
to WFS editor and with this undo behaviour is fixed
3. Removing redundant code (verified the integration still works fine)

---

- 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.

Co-authored-by: Vlad Nikolaenko <[email protected]>

Author: witness-me

packages/core/src/stepFunctions/workflowStudio/handleMessage.ts

@@ -14,6 +14,7 @@ import {
     FileChangeEventTrigger,
     SyncFileRequestMessage,
     ApiCallRequestMessage,
+    UnsupportedMessage,
 } from './types'
 import { submitFeedback } from '../../feedback/vue/submitFeedback'
 import { placeholder } from '../../shared/vscode/commands2'
@@ -56,13 +57,21 @@ export async function handleMessage(message: Message, context: WebviewContext) {
             case Command.API_CALL:
                 apiCallMessageHandler(message as ApiCallRequestMessage, context)
                 break
+            default:
+                void handleUnsupportedMessage(context, message)
+                break
         }
     } else if (messageType === MessageType.BROADCAST) {
         switch (command) {
             case Command.LOAD_STAGE:
                 void loadStageMessageHandler(context)
                 break
+            default:
+                void handleUnsupportedMessage(context, message)
+                break
         }
+    } else {
+        void handleUnsupportedMessage(context, message)
     }
 }
 
@@ -206,3 +215,18 @@ function apiCallMessageHandler(request: ApiCallRequestMessage, context: WebviewC
     const apiHandler = new WorkflowStudioApiHandler(globals.awsContext.getCredentialDefaultRegion(), context)
     apiHandler.performApiCall(request).catch((error) => logger.error('%s API call failed: %O', request.apiName, error))
 }
+
+/**
+ * Handles unsupported or unrecognized messages by sending a response to the webview. Ensures compatibility with future
+ * commands and message types, preventing issues if the user has an outdated extension version.
+ * @param context The context object containing information about the webview environment
+ * @param command The command received from the webview
+ * @param messageType The type of the message received
+ */
+async function handleUnsupportedMessage(context: WebviewContext, originalMessage: Message) {
+    await context.panel.webview.postMessage({
+        messageType: MessageType.RESPONSE,
+        command: Command.UNSUPPORTED_COMMAND,
+        originalMessage,
+    } as UnsupportedMessage)
+}

packages/core/src/stepFunctions/workflowStudio/types.ts

@@ -41,6 +41,7 @@ export enum Command {
     OPEN_FEEDBACK = 'OPEN_FEEDBACK',
     CLOSE_WFS = 'CLOSE_WFS',
     API_CALL = 'API_CALL',
+    UNSUPPORTED_COMMAND = 'UNSUPPORTED_COMMAND',
 }
 
 export type FileWatchInfo = {
@@ -61,6 +62,10 @@ export interface FileChangedMessage extends Message {
     trigger: FileChangeEventTrigger
 }
 
+export interface UnsupportedMessage extends Message {
+    originalMessage: Message
+}
+
 export interface InitResponseMessage extends Omit<FileChangedMessage, 'trigger'> {
     isSuccess: boolean
     failureReason?: string

packages/core/src/stepFunctions/workflowStudio/workflowStudioEditorProvider.ts

@@ -6,11 +6,10 @@
 import * as vscode from 'vscode'
 import { getLogger } from '../../shared/logger/logger'
 import request from '../../shared/request'
-import fs from '../../shared/fs/fs'
 import { getClientId } from '../../shared/telemetry/util'
 import { telemetry } from '../../shared/telemetry/telemetry'
 import globals from '../../shared/extensionGlobals'
-import { getRandomString, getStringHash } from '../../shared/utilities/textUtilities'
+import { getStringHash } from '../../shared/utilities/textUtilities'
 import { ToolkitError } from '../../shared/errors'
 import { getTabSizeSetting } from '../../shared/utilities/editorUtilities'
 import { WorkflowStudioEditor } from './workflowStudioEditor'
@@ -80,7 +79,7 @@ export class WorkflowStudioEditorProvider implements vscode.CustomTextEditorProv
      * @private
      */
     private getWebviewContent = async () => {
-        let htmlFileSplit = this.webviewHtml.split('<head>')
+        const htmlFileSplit = this.webviewHtml.split('<head>')
 
         // Set asset source to CDN
         const source = isLocalDev ? localhost : cdn
@@ -93,20 +92,8 @@ export class WorkflowStudioEditorProvider implements vscode.CustomTextEditorProv
         const isDarkMode = theme === vscode.ColorThemeKind.Dark || theme === vscode.ColorThemeKind.HighContrast
         const tabSizeTag = `<meta name='tab-size' content='${getTabSizeSetting()}'>`
         const darkModeTag = `<meta name='dark-mode' content='${isDarkMode}'>`
-        let html = `${htmlFileSplit[0]} <head> ${baseTag} ${localeTag} ${darkModeTag} ${tabSizeTag} ${htmlFileSplit[1]}`
 
-        const nonce = getRandomString()
-        const localDevURL = isLocalDev ? localhost : ''
-        htmlFileSplit = html.split("script-src 'self'")
-
-        html = `${htmlFileSplit[0]} script-src 'self' 'nonce-${nonce}' ${localDevURL} ${htmlFileSplit[1]}`
-        htmlFileSplit = html.split('<body>')
-
-        const script = await fs.readFileText(
-            vscode.Uri.joinPath(globals.context.extensionUri, 'resources', 'js', 'vsCodeExtensionInterface.js')
-        )
-
-        return `${htmlFileSplit[0]} <body> <script nonce='${nonce}'>${script}</script> ${htmlFileSplit[1]}`
+        return `${htmlFileSplit[0]} <head> ${baseTag} ${localeTag} ${darkModeTag} ${tabSizeTag} ${htmlFileSplit[1]}`
     }
 
     /**

packages/toolkit/package.json

@@ -4151,6 +4151,12 @@
                 "mac": "cmd+shift+v",
                 "when": "editorTextFocus && editorLangId == asl || editorTextFocus && editorLangId == asl-yaml"
             },
+            {
+                "command": "noop",
+                "key": "ctrl+z",
+                "mac": "cmd+z",
+                "when": "aws.stepFunctions.isWorkflowStudioFocused"
+            },
             {
                 "command": "aws.samcli.sync",
                 "key": "ctrl+shift+s",