feat(stepfunctions): add View by Execution ARN command and provider

Diler Zaza · Diler Zaza · commit d64f5cde0dfe · 2025-06-19T15:56:39.000-07:00
diff --git a/packages/core/src/stepFunctions/constants/webviewResources.ts b/packages/core/src/stepFunctions/constants/webviewResources.ts
@@ -3,6 +3,6 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-export const isLocalDev = true // eslint-disable-line @typescript-eslint/naming-convention
-export const localhost = 'http://127.0.0.1:3002' // eslint-disable-line @typescript-eslint/naming-convention
-export const cdn = 'https://d5t62uwepi9lu.cloudfront.net' // eslint-disable-line @typescript-eslint/naming-convention
+export const isLocalDev = true
+export const localhost = 'http://127.0.0.1:3002'
+export const cdn = 'https://d5t62uwepi9lu.cloudfront.net'
diff --git a/packages/core/src/stepFunctions/executionDetails/executionDetailProvider.ts b/packages/core/src/stepFunctions/executionDetails/executionDetailProvider.ts
@@ -10,6 +10,8 @@ import { ToolkitError } from '../../shared/errors'
 import { i18n } from '../../shared/i18n-helper'
 import { ComponentType } from '../workflowStudio/types'
 import { isLocalDev, localhost, cdn } from '../constants/webviewResources'
+import { ComponentType } from '../workflowStudio/types'
+import { isLocalDev, localhost, cdn } from '../constants/webviewResources'
 
 /**
  * Provider for Execution Details panels.
@@ -39,25 +41,23 @@ export class ExecutionDetailProvider {
                 ...params,
             }
         )
+        // Create and show the webview panel
+        const panel = vscode.window.createWebviewPanel(
+            ExecutionDetailProvider.viewType,
+            `Execution: ${executionArn.split(':').pop() || executionArn}`,
+            vscode.ViewColumn.Beside,
+            {
+                enableScripts: true,
+                retainContextWhenHidden: true,
+                ...params,
+            }
+        )
 
         // Create the provider and initialize the panel
         const provider = new ExecutionDetailProvider()
         await provider.initializePanel(panel, executionArn)
     }
 
-    /**
-     * Registers the command to open execution details.
-     * @remarks This should only be called once per extension.
-     */
-    public static register(): vscode.Disposable {
-        return vscode.commands.registerCommand(
-            'aws.stepFunctions.viewExecutionDetails',
-            async (executionArn: string) => {
-                await ExecutionDetailProvider.openExecutionDetails(executionArn)
-            }
-        )
-    }
-
     protected webviewHtml: string
     protected readonly logger = getLogger()
 
@@ -95,8 +95,10 @@ export class ExecutionDetailProvider {
 
         // Set component type to ExecutionDetails
         const componentTypeTag = `<meta name="component-type" content="${ComponentType.ExecutionDetails}" />`
+        const componentTypeTag = `<meta name="component-type" content="${ComponentType.ExecutionDetails}" />`
 
         return `${htmlFileSplit[0]} <head> ${baseTag} ${localeTag} ${darkModeTag} ${componentTypeTag} ${htmlFileSplit[1]}`
+        return `${htmlFileSplit[0]} <head> ${baseTag} ${localeTag} ${darkModeTag} ${componentTypeTag} ${htmlFileSplit[1]}`
     }
 
     /**
