From 8471f50fef0847e225294ab28cab7728c22ff47e Mon Sep 17 00:00:00 2001
From: Jonathan Dobson <jon.m.dobson@gmail.com>
Date: Thu, 7 Aug 2025 13:36:14 -0400
Subject: [PATCH] add cache key input to workflow settings (#3131)

---
 .../routes/workflows/editor/FlowRenderer.tsx  |  1 +
 .../workflows/editor/WorkflowDebugger.tsx     |  1 +
 .../workflows/editor/WorkflowEditor.tsx       |  1 +
 .../editor/nodes/StartNode/StartNode.tsx      | 20 +++++++++++++++++--
 .../workflows/editor/nodes/StartNode/types.ts |  1 +
 .../workflows/editor/workflowEditorUtils.ts   |  3 +++
 .../routes/workflows/types/workflowTypes.ts   |  2 ++
 .../workflows/types/workflowYamlTypes.ts      |  1 +
 8 files changed, 28 insertions(+), 2 deletions(-)

diff --git a/skyvern-frontend/src/routes/workflows/editor/FlowRenderer.tsx b/skyvern-frontend/src/routes/workflows/editor/FlowRenderer.tsx
index 2e729cf7..705511b2 100644
--- a/skyvern-frontend/src/routes/workflows/editor/FlowRenderer.tsx
+++ b/skyvern-frontend/src/routes/workflows/editor/FlowRenderer.tsx
@@ -350,6 +350,7 @@ function FlowRenderer({
         totp_verification_url: workflow.totp_verification_url,
         extra_http_headers: extraHttpHeaders,
         use_cache: data.settings.useScriptCache,
+        cache_key: data.settings.scriptCacheKey,
         workflow_definition: {
           parameters: data.parameters,
           blocks: data.blocks,
diff --git a/skyvern-frontend/src/routes/workflows/editor/WorkflowDebugger.tsx b/skyvern-frontend/src/routes/workflows/editor/WorkflowDebugger.tsx
index 3407de36..0482d360 100644
--- a/skyvern-frontend/src/routes/workflows/editor/WorkflowDebugger.tsx
+++ b/skyvern-frontend/src/routes/workflows/editor/WorkflowDebugger.tsx
@@ -154,6 +154,7 @@ function WorkflowDebugger() {
       ? JSON.stringify(workflow.extra_http_headers)
       : null,
     useScriptCache: workflow.use_cache,
+    scriptCacheKey: workflow.cache_key,
   };
 
   const elements = getElements(
diff --git a/skyvern-frontend/src/routes/workflows/editor/WorkflowEditor.tsx b/skyvern-frontend/src/routes/workflows/editor/WorkflowEditor.tsx
index 53a430ed..e5da52ab 100644
--- a/skyvern-frontend/src/routes/workflows/editor/WorkflowEditor.tsx
+++ b/skyvern-frontend/src/routes/workflows/editor/WorkflowEditor.tsx
@@ -59,6 +59,7 @@ function WorkflowEditor() {
       ? JSON.stringify(workflow.extra_http_headers)
       : null,
     useScriptCache: workflow.use_cache,
+    scriptCacheKey: workflow.cache_key,
   };
 
   const elements = getElements(
diff --git a/skyvern-frontend/src/routes/workflows/editor/nodes/StartNode/StartNode.tsx b/skyvern-frontend/src/routes/workflows/editor/nodes/StartNode/StartNode.tsx
index bb80c484..0aef7cf1 100644
--- a/skyvern-frontend/src/routes/workflows/editor/nodes/StartNode/StartNode.tsx
+++ b/skyvern-frontend/src/routes/workflows/editor/nodes/StartNode/StartNode.tsx
@@ -61,6 +61,7 @@ function StartNode({ id, data }: NodeProps<StartNode>) {
       : null,
     extraHttpHeaders: data.withWorkflowSettings ? data.extraHttpHeaders : null,
     useScriptCache: data.withWorkflowSettings ? data.useScriptCache : false,
+    scriptCacheKey: data.withWorkflowSettings ? data.scriptCacheKey : null,
   });
 
   useEffect(() => {
@@ -133,11 +134,11 @@ function StartNode({ id, data }: NodeProps<StartNode>) {
                         }}
                       />
                     </div>
-                    <OrgWalled>
+                    <OrgWalled className="flex flex-col gap-4">
                       <div className="space-y-2">
                         <div className="flex items-center gap-2">
                           <Label>Use Script Cache</Label>
-                          <HelpTooltip content="Generate & use cached scripts for faster execution" />
+                          <HelpTooltip content="Generate & use cached scripts for faster execution." />
                           <Switch
                             className="ml-auto"
                             checked={inputs.useScriptCache}
@@ -147,6 +148,21 @@ function StartNode({ id, data }: NodeProps<StartNode>) {
                           />
                         </div>
                       </div>
+                      <div className="space-y-2">
+                        <div className="flex gap-2">
+                          <Label>Script Cache Key</Label>
+                          <HelpTooltip content="A templated name, comprised of one or more of your parameters, that defines the key for your script cache." />
+                        </div>
+                        <Input
+                          value={inputs.scriptCacheKey ?? ""}
+                          placeholder="my-{param1}-{param2}-key"
+                          onChange={(event) => {
+                            const value = (event.target.value ?? "").trim();
+                            const v = value.length ? value : null;
+                            handleChange("scriptCacheKey", v);
+                          }}
+                        />
+                      </div>
                     </OrgWalled>
                     <div className="space-y-2">
                       <div className="flex items-center gap-2">
diff --git a/skyvern-frontend/src/routes/workflows/editor/nodes/StartNode/types.ts b/skyvern-frontend/src/routes/workflows/editor/nodes/StartNode/types.ts
index 5f1fc32c..f4b7f733 100644
--- a/skyvern-frontend/src/routes/workflows/editor/nodes/StartNode/types.ts
+++ b/skyvern-frontend/src/routes/workflows/editor/nodes/StartNode/types.ts
@@ -13,6 +13,7 @@ export type WorkflowStartNodeData = {
   extraHttpHeaders: string | null;
   editable: boolean;
   useScriptCache: boolean;
+  scriptCacheKey: string | null;
 };
 
 export type OtherStartNodeData = {
diff --git a/skyvern-frontend/src/routes/workflows/editor/workflowEditorUtils.ts b/skyvern-frontend/src/routes/workflows/editor/workflowEditorUtils.ts
index f30bbe1e..24a2b91e 100644
--- a/skyvern-frontend/src/routes/workflows/editor/workflowEditorUtils.ts
+++ b/skyvern-frontend/src/routes/workflows/editor/workflowEditorUtils.ts
@@ -699,6 +699,7 @@ function getElements(
       extraHttpHeaders: settings.extraHttpHeaders,
       editable,
       useScriptCache: settings.useScriptCache,
+      scriptCacheKey: settings.scriptCacheKey,
     }),
   );
 
@@ -1402,6 +1403,7 @@ function getWorkflowSettings(nodes: Array<AppNode>): WorkflowSettings {
     maxScreenshotScrolls: null,
     extraHttpHeaders: null,
     useScriptCache: false,
+    scriptCacheKey: null,
   };
   const startNodes = nodes.filter(isStartNode);
   const startNodeWithWorkflowSettings = startNodes.find(
@@ -1420,6 +1422,7 @@ function getWorkflowSettings(nodes: Array<AppNode>): WorkflowSettings {
       maxScreenshotScrolls: data.maxScreenshotScrolls,
       extraHttpHeaders: data.extraHttpHeaders,
       useScriptCache: data.useScriptCache,
+      scriptCacheKey: data.scriptCacheKey,
     };
   }
   return defaultSettings;
diff --git a/skyvern-frontend/src/routes/workflows/types/workflowTypes.ts b/skyvern-frontend/src/routes/workflows/types/workflowTypes.ts
index ba6c333f..410dac8b 100644
--- a/skyvern-frontend/src/routes/workflows/types/workflowTypes.ts
+++ b/skyvern-frontend/src/routes/workflows/types/workflowTypes.ts
@@ -502,6 +502,7 @@ export type WorkflowApiResponse = {
   modified_at: string;
   deleted_at: string | null;
   use_cache: boolean;
+  cache_key: string | null;
 };
 
 export type WorkflowSettings = {
@@ -512,6 +513,7 @@ export type WorkflowSettings = {
   maxScreenshotScrolls: number | null;
   extraHttpHeaders: string | null;
   useScriptCache: boolean;
+  scriptCacheKey: string | null;
 };
 
 export type WorkflowModel = JsonObjectExtendable<{ model_name: string }>;
diff --git a/skyvern-frontend/src/routes/workflows/types/workflowYamlTypes.ts b/skyvern-frontend/src/routes/workflows/types/workflowYamlTypes.ts
index 6f79ff71..cf4e75a2 100644
--- a/skyvern-frontend/src/routes/workflows/types/workflowYamlTypes.ts
+++ b/skyvern-frontend/src/routes/workflows/types/workflowYamlTypes.ts
@@ -15,6 +15,7 @@ export type WorkflowCreateYAMLRequest = {
   max_screenshot_scrolls?: number | null;
   extra_http_headers?: Record<string, string> | null;
   use_cache?: boolean;
+  cache_key?: string | null;
 };
 
 export type WorkflowDefinitionYAML = {