get rid of navigation block and use task + task v2 block (#3128)

skyvern-frontend/src/routes/workflows/editor/nodes/NavigationNode/NavigationNode.tsx

@@ -139,7 +139,7 @@ function NavigationNode({ id, data, type }: NodeProps<NavigationNode>) {
           </div>
           <div className="space-y-2">
             <div className="flex gap-2">
-              <Label className="text-xs text-slate-300">Navigation Goal</Label>
+              <Label className="text-xs text-slate-300">Prompt</Label>
               <HelpTooltip
                 content={helpTooltips["navigation"]["navigationGoal"]}
               />

skyvern-frontend/src/routes/workflows/editor/nodes/components/NodeHeader.tsx

@@ -35,6 +35,7 @@ import {
 import { EditableNodeTitle } from "../components/EditableNodeTitle";
 import { NodeActionMenu } from "../NodeActionMenu";
 import { WorkflowBlockIcon } from "../WorkflowBlockIcon";
+import { workflowBlockTitle } from "../types";
 
 interface Props {
   blockLabel: string; // today, this + wpid act as the identity of a block
@@ -59,15 +60,6 @@ type Payload = Record<string, unknown> & {
   workflow_id: string;
 };
 
-const blockTypeToTitle = (type: WorkflowBlockType): string => {
-  const parts = type.split("_");
-  const capCased = parts
-    .map((part) => part.charAt(0).toUpperCase() + part.slice(1))
-    .join(" ");
-
-  return `${capCased} Block`;
-};
-
 const getPayload = (opts: {
   blockLabel: string;
   browserSessionId: string | null;
@@ -150,7 +142,7 @@ function NodeHeader({
     id: nodeId,
     initialValue: blockLabel,
   });
-  const blockTitle = blockTypeToTitle(type);
+  const blockTitle = workflowBlockTitle[type];
   const deleteNodeCallback = useDeleteNodeCallback();
   const credentialGetter = useCredentialGetter();
   const navigate = useNavigate();

skyvern-frontend/src/routes/workflows/editor/nodes/types.ts

@@ -33,7 +33,7 @@ export const dataSchemaExampleForFileExtraction = {
 export const workflowBlockTitle: {
   [blockType in WorkflowBlockType]: string;
 } = {
-  action: "Action",
+  action: "Browser Action",
   code: "Code",
   download_to_s3: "Download",
   extraction: "Extraction",
@@ -41,16 +41,16 @@ export const workflowBlockTitle: {
   file_url_parser: "File Parser",
   for_loop: "Loop",
   login: "Login",
-  navigation: "Navigation",
+  navigation: "Browser Task",
   send_email: "Send Email",
-  task: "Task",
+  task: "Browser Task (Deprecated)",
   text_prompt: "Text Prompt",
   upload_to_s3: "Upload To S3",
   file_upload: "Upload Files",
   validation: "Validation",
   wait: "Wait",
   pdf_parser: "PDF Parser",
-  task_v2: "Task v2",
+  task_v2: "Browser Task v2",
   goto_url: "Go to URL",
   http_request: "HTTP Request",
 };

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

@@ -40,8 +40,8 @@ const nodeLibraryItems: Array<{
         className="size-6"
       />
     ),
-    title: "Navigation Block",
-    description: "Navigate on the page",
+    title: "Browser Task Block",
+    description: "Take actions to achieve a task.",
   },
   {
     nodeType: "taskv2",
@@ -51,8 +51,8 @@ const nodeLibraryItems: Array<{
         className="size-6"
       />
     ),
-    title: "Navigation v2 Block",
-    description: "Navigate on the page with Skyvern 2.0",
+    title: "Browser Task v2 Block",
+    description: "Achieve complex tasks with deep thinking.",
   },
   {
     nodeType: "action",
@@ -62,7 +62,7 @@ const nodeLibraryItems: Array<{
         className="size-6"
       />
     ),
-    title: "Action Block",
+    title: "Browser Action Block",
     description: "Take a single action",
   },
   {
@@ -87,17 +87,17 @@ const nodeLibraryItems: Array<{
     title: "Validation Block",
     description: "Validate completion criteria",
   },
-  {
-    nodeType: "task",
-    icon: (
-      <WorkflowBlockIcon
-        workflowBlockType={WorkflowBlockTypes.Task}
-        className="size-6"
-      />
-    ),
-    title: "Task Block",
-    description: "Complete multi-step browser automation tasks",
-  },
+  // {
+  //   nodeType: "task",
+  //   icon: (
+  //     <WorkflowBlockIcon
+  //       workflowBlockType={WorkflowBlockTypes.Task}
+  //       className="size-6"
+  //     />
+  //   ),
+  //   title: "Task Block",
+  //   description: "Complete multi-step browser automation tasks",
+  // },
   {
     nodeType: "url",
     icon: (