Workflow Copilot: Work on Workflow instead of WorkflowDefinition level (#4523)

skyvern-frontend/src/routes/workflows/copilot/WorkflowCopilotChat.tsx

@@ -7,7 +7,7 @@ import { ReloadIcon, Cross2Icon } from "@radix-ui/react-icons";
 import { stringify as convertToYAML } from "yaml";
 import { useWorkflowHasChangesStore } from "@/store/WorkflowHasChangesStore";
 import { WorkflowCreateYAMLRequest } from "@/routes/workflows/types/workflowYamlTypes";
-import { WorkflowDefinition } from "@/routes/workflows/types/workflowTypes";
+import { WorkflowApiResponse } from "@/routes/workflows/types/workflowTypes";
 import { toast } from "@/components/ui/use-toast";
 import { getSseClient } from "@/api/sse";
 import {
@@ -67,7 +67,7 @@ const MessageItem = memo(({ message }: { message: ChatMessage }) => {
 });
 
 interface WorkflowCopilotChatProps {
-  onWorkflowUpdate?: (workflow: WorkflowDefinition) => void;
+  onWorkflowUpdate?: (workflow: WorkflowApiResponse) => void;
   isOpen?: boolean;
   onClose?: () => void;
   onMessageCountChange?: (count: number) => void;
@@ -425,7 +425,7 @@ export function WorkflowCopilotChat({
 
         if (response.updated_workflow && onWorkflowUpdate) {
           try {
-            onWorkflowUpdate(response.updated_workflow as WorkflowDefinition);
+            onWorkflowUpdate(response.updated_workflow);
           } catch (updateError) {
             console.error("Failed to update workflow:", updateError);
             toast({

skyvern-frontend/src/routes/workflows/copilot/workflowCopilotTypes.ts

@@ -1,3 +1,5 @@
+import { WorkflowApiResponse } from "@/routes/workflows/types/workflowTypes";
+
 export type WorkflowCopilotChatSender = "user" | "ai";
 
 export interface WorkflowCopilotChat {
@@ -53,7 +55,7 @@ export interface WorkflowCopilotStreamResponseUpdate {
   type: "response";
   workflow_copilot_chat_id: string;
   message: string;
-  updated_workflow?: Record<string, unknown> | null;
+  updated_workflow?: WorkflowApiResponse | null;
   response_time: string;
 }
 

skyvern-frontend/src/routes/workflows/editor/Workspace.tsx

@@ -94,7 +94,7 @@ import {
 import { WorkflowHeader } from "./WorkflowHeader";
 import { WorkflowHistoryPanel } from "./panels/WorkflowHistoryPanel";
 import { WorkflowVersion } from "../hooks/useWorkflowVersionsQuery";
-import { WorkflowApiResponse, WorkflowSettings } from "../types/workflowTypes";
+import { WorkflowSettings } from "../types/workflowTypes";
 import { ProxyLocation } from "@/api/types";
 import {
   nodeAdderNode,
@@ -1698,36 +1698,36 @@ function Workspace({
         buttonRef={copilotButtonRef}
         onWorkflowUpdate={(workflowData) => {
           try {
-            const saveData = workflowChangesStore.getSaveData?.();
-
             const settings: WorkflowSettings = {
               proxyLocation:
-                saveData?.settings.proxyLocation ?? ProxyLocation.Residential,
-              webhookCallbackUrl: saveData?.settings.webhookCallbackUrl || "",
+                workflowData.proxy_location ?? ProxyLocation.Residential,
+              webhookCallbackUrl: workflowData.webhook_callback_url || "",
               persistBrowserSession:
-                saveData?.settings.persistBrowserSession ?? false,
-              model: saveData?.settings.model ?? null,
-              maxScreenshotScrolls:
-                saveData?.settings.maxScreenshotScrolls || 3,
-              extraHttpHeaders: saveData?.settings.extraHttpHeaders ?? null,
-              runWith: saveData?.settings.runWith ?? null,
-              scriptCacheKey: saveData?.settings.scriptCacheKey ?? null,
-              aiFallback: saveData?.settings.aiFallback ?? true,
-              runSequentially: saveData?.settings.runSequentially ?? false,
-              sequentialKey: saveData?.settings.sequentialKey ?? null,
-              finallyBlockLabel: workflowData?.finally_block_label ?? null,
+                workflowData.persist_browser_session ?? false,
+              model: workflowData.model ?? null,
+              maxScreenshotScrolls: workflowData.max_screenshot_scrolls || 3,
+              extraHttpHeaders: workflowData.extra_http_headers
+                ? JSON.stringify(workflowData.extra_http_headers)
+                : null,
+              runWith: workflowData.run_with ?? null,
+              scriptCacheKey: workflowData.cache_key ?? null,
+              aiFallback: workflowData.ai_fallback ?? true,
+              runSequentially: workflowData.run_sequentially ?? false,
+              sequentialKey: workflowData.sequential_key ?? null,
+              finallyBlockLabel:
+                workflowData.workflow_definition?.finally_block_label ?? null,
             };
 
-            const elements = getElements(workflowData.blocks, settings, true);
+            const elements = getElements(
+              workflowData.workflow_definition.blocks,
+              settings,
+              true,
+            );
 
             setNodes(elements.nodes);
             setEdges(elements.edges);
 
-            const initialParameters = getInitialParameters({
-              workflow_definition: {
-                parameters: workflowData.parameters,
-              },
-            } as WorkflowApiResponse);
+            const initialParameters = getInitialParameters(workflowData);
             useWorkflowParametersStore
               .getState()
               .setParameters(initialParameters);

skyvern-frontend/src/routes/workflows/editor/panels/WorkflowParameterEditPanel.tsx

@@ -46,6 +46,7 @@ const workflowParameterTypeOptions = [
   { label: "integer", value: WorkflowParameterValueType.Integer },
   { label: "boolean", value: WorkflowParameterValueType.Boolean },
   { label: "file", value: WorkflowParameterValueType.FileURL },
+  { label: "credential", value: WorkflowParameterValueType.CredentialId },
   { label: "JSON", value: WorkflowParameterValueType.JSON },
 ];