Update Copy to cURL buttons to reference the new Runs API spec (#3765)

Co-authored-by: Shuchang Zheng <wintonzheng0325@gmail.com>

skyvern-frontend/src/routes/tasks/create/CreateNewTaskForm.tsx

@@ -21,9 +21,10 @@ import { KeyValueInput } from "@/components/KeyValueInput";
 import { useApiCredential } from "@/hooks/useApiCredential";
 import { useCredentialGetter } from "@/hooks/useCredentialGetter";
 import { CodeEditor } from "@/routes/workflows/components/CodeEditor";
-import { apiBaseUrl } from "@/util/env";
+import { runsApiBaseUrl } from "@/util/env";
 import { CopyApiCommandDropdown } from "@/components/CopyApiCommandDropdown";
 import { type ApiCommandOptions } from "@/util/apiCommands";
+import { buildTaskRunPayload } from "@/util/taskRunPayload";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { PlayIcon, ReloadIcon } from "@radix-ui/react-icons";
 import { ToastAction } from "@radix-ui/react-toast";
@@ -754,17 +755,30 @@ function CreateNewTaskForm({ initialValues }: Props) {
 
         <div className="flex justify-end gap-3">
           <CopyApiCommandDropdown
-            getOptions={() =>
-              ({
+            getOptions={() => {
+              const formValues = form.getValues();
+              const includeOverrideHeader =
+                formValues.maxStepsOverride !== null &&
+                formValues.maxStepsOverride !== MAX_STEPS_DEFAULT;
+
+              const headers: Record<string, string> = {
+                "Content-Type": "application/json",
+                "x-api-key": apiCredential ?? "<your-api-key>",
+              };
+
+              if (includeOverrideHeader) {
+                headers["x-max-steps-override"] = String(
+                  formValues.maxStepsOverride,
+                );
+              }
+
+              return {
                 method: "POST",
-                url: `${apiBaseUrl}/tasks`,
-                body: createTaskRequestObject(form.getValues()),
-                headers: {
-                  "Content-Type": "application/json",
-                  "x-api-key": apiCredential ?? "<your-api-key>",
-                },
-              }) satisfies ApiCommandOptions
-            }
+                url: `${runsApiBaseUrl}/run/tasks`,
+                body: buildTaskRunPayload(createTaskRequestObject(formValues)),
+                headers,
+              } satisfies ApiCommandOptions;
+            }}
           />
           <Button type="submit" disabled={mutation.isPending}>
             {mutation.isPending && (

skyvern-frontend/src/routes/tasks/create/SavedTaskForm.tsx

@@ -16,9 +16,10 @@ import { useApiCredential } from "@/hooks/useApiCredential";
 import { useCredentialGetter } from "@/hooks/useCredentialGetter";
 import { CodeEditor } from "@/routes/workflows/components/CodeEditor";
 import { SubmitEvent } from "@/types";
-import { apiBaseUrl } from "@/util/env";
+import { runsApiBaseUrl } from "@/util/env";
 import { CopyApiCommandDropdown } from "@/components/CopyApiCommandDropdown";
 import { type ApiCommandOptions } from "@/util/apiCommands";
+import { buildTaskRunPayload } from "@/util/taskRunPayload";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { PlayIcon, ReloadIcon } from "@radix-ui/react-icons";
 import { ToastAction } from "@radix-ui/react-toast";
@@ -31,7 +32,11 @@ import { stringify as convertToYAML } from "yaml";
 import { MAX_STEPS_DEFAULT } from "../constants";
 import { TaskFormSection } from "./TaskFormSection";
 import { savedTaskFormSchema, SavedTaskFormValues } from "./taskFormTypes";
-import { OrganizationApiResponse, ProxyLocation } from "@/api/types";
+import {
+  CreateTaskRequest,
+  OrganizationApiResponse,
+  ProxyLocation,
+} from "@/api/types";
 import { ProxySelector } from "@/components/ProxySelector";
 import { TestWebhookDialog } from "@/components/TestWebhookDialog";
 
@@ -39,11 +44,13 @@ type Props = {
   initialValues: SavedTaskFormValues;
 };
 
-function transform(value: unknown) {
+function transform<T>(value: T): T | null {
   return value === "" ? null : value;
 }
 
-function createTaskRequestObject(formValues: SavedTaskFormValues) {
+function createTaskRequestObject(
+  formValues: SavedTaskFormValues,
+): CreateTaskRequest {
   return {
     title: formValues.title,
     url: formValues.url,
@@ -759,17 +766,30 @@ function SavedTaskForm({ initialValues }: Props) {
 
         <div className="flex justify-end gap-3">
           <CopyApiCommandDropdown
-            getOptions={() =>
-              ({
+            getOptions={() => {
+              const formValues = form.getValues();
+              const includeOverrideHeader =
+                formValues.maxStepsOverride !== null &&
+                formValues.maxStepsOverride !== MAX_STEPS_DEFAULT;
+
+              const headers: Record<string, string> = {
+                "Content-Type": "application/json",
+                "x-api-key": apiCredential ?? "<your-api-key>",
+              };
+
+              if (includeOverrideHeader) {
+                headers["x-max-steps-override"] = String(
+                  formValues.maxStepsOverride,
+                );
+              }
+
+              return {
                 method: "POST",
-                url: `${apiBaseUrl}/tasks`,
-                body: createTaskRequestObject(form.getValues()),
-                headers: {
-                  "Content-Type": "application/json",
-                  "x-api-key": apiCredential ?? "<your-api-key>",
-                },
-              }) satisfies ApiCommandOptions
-            }
+                url: `${runsApiBaseUrl}/run/tasks`,
+                body: buildTaskRunPayload(createTaskRequestObject(formValues)),
+                headers,
+              } satisfies ApiCommandOptions;
+            }}
           />
           <Button
             type="submit"

skyvern-frontend/src/routes/tasks/detail/TaskDetails.tsx

@@ -25,14 +25,16 @@ import { useApiCredential } from "@/hooks/useApiCredential";
 import { useCredentialGetter } from "@/hooks/useCredentialGetter";
 import { CodeEditor } from "@/routes/workflows/components/CodeEditor";
 import { WorkflowApiResponse } from "@/routes/workflows/types/workflowTypes";
-import { apiBaseUrl } from "@/util/env";
+import { runsApiBaseUrl } from "@/util/env";
 import { ApiWebhookActionsMenu } from "@/components/ApiWebhookActionsMenu";
 import { WebhookReplayDialog } from "@/components/WebhookReplayDialog";
 import { type ApiCommandOptions } from "@/util/apiCommands";
+import { buildTaskRunPayload } from "@/util/taskRunPayload";
 import { PlayIcon, ReloadIcon } from "@radix-ui/react-icons";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { Link, Outlet, useParams } from "react-router-dom";
 import { statusIsFinalized } from "../types";
+import { MAX_STEPS_DEFAULT } from "../constants";
 import { useTaskQuery } from "./hooks/useTaskQuery";
 
 function createTaskRequestObject(values: TaskApiResponse) {
@@ -206,14 +208,27 @@ function TaskDetails() {
                     },
                   } satisfies ApiCommandOptions;
                 }
+
+                const includeOverrideHeader =
+                  task.max_steps_per_run !== null &&
+                  task.max_steps_per_run !== MAX_STEPS_DEFAULT;
+
+                const headers: Record<string, string> = {
+                  "Content-Type": "application/json",
+                  "x-api-key": apiCredential ?? "<your-api-key>",
+                };
+
+                if (includeOverrideHeader) {
+                  headers["x-max-steps-override"] = String(
+                    task.max_steps_per_run,
+                  );
+                }
+
                 return {
                   method: "POST",
-                  url: `${apiBaseUrl}/tasks`,
-                  body: createTaskRequestObject(task),
-                  headers: {
-                    "Content-Type": "application/json",
-                    "x-api-key": apiCredential ?? "<your-api-key>",
-                  },
+                  url: `${runsApiBaseUrl}/run/tasks`,
+                  body: buildTaskRunPayload(createTaskRequestObject(task)),
+                  headers,
                 } satisfies ApiCommandOptions;
               }}
               webhookDisabled={taskIsLoading || !taskHasTerminalState}