From adfce8f85c3b49fe7043d24a785ff4f9f24caab8 Mon Sep 17 00:00:00 2001
From: Shuchang Zheng <wintonzheng0325@gmail.com>
Date: Wed, 5 Mar 2025 10:52:40 -0500
Subject: [PATCH] =?UTF-8?q?Put=20login=20block=20at=20the=20top=20of=20nod?=
 =?UTF-8?q?e=20library,=20change=20task=20v2=20icon,=20put=20=E2=80=A6=20(?=
 =?UTF-8?q?#1888)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Muhammed Salih Altun <muhammedsalihaltun@gmail.com>
---
 .../editor/nodes/WorkflowBlockIcon.tsx        |  6 +--
 .../panels/WorkflowNodeLibraryPanel.tsx       | 45 ++++++++++---------
 2 files changed, 26 insertions(+), 25 deletions(-)

diff --git a/skyvern-frontend/src/routes/workflows/editor/nodes/WorkflowBlockIcon.tsx b/skyvern-frontend/src/routes/workflows/editor/nodes/WorkflowBlockIcon.tsx
index a0f1d621..8e3883de 100644
--- a/skyvern-frontend/src/routes/workflows/editor/nodes/WorkflowBlockIcon.tsx
+++ b/skyvern-frontend/src/routes/workflows/editor/nodes/WorkflowBlockIcon.tsx
@@ -48,14 +48,14 @@ function WorkflowBlockIcon({ workflowBlockType, className }: Props) {
     case "login": {
       return <LockOpen1Icon className={className} />;
     }
-    case "navigation": {
+    case "navigation":
+    case "task_v2": {
       return <RobotIcon className={className} />;
     }
     case "send_email": {
       return <EnvelopeClosedIcon className={className} />;
     }
-    case "task":
-    case "task_v2": {
+    case "task": {
       return <ListBulletIcon className={className} />;
     }
     case "text_prompt": {
diff --git a/skyvern-frontend/src/routes/workflows/editor/panels/WorkflowNodeLibraryPanel.tsx b/skyvern-frontend/src/routes/workflows/editor/panels/WorkflowNodeLibraryPanel.tsx
index 645c1398..0e242341 100644
--- a/skyvern-frontend/src/routes/workflows/editor/panels/WorkflowNodeLibraryPanel.tsx
+++ b/skyvern-frontend/src/routes/workflows/editor/panels/WorkflowNodeLibraryPanel.tsx
@@ -12,6 +12,17 @@ const nodeLibraryItems: Array<{
   title: string;
   description: string;
 }> = [
+  {
+    nodeType: "login",
+    icon: (
+      <WorkflowBlockIcon
+        workflowBlockType={WorkflowBlockTypes.Login}
+        className="size-6"
+      />
+    ),
+    title: "Login Block",
+    description: "Login to a website",
+  },
   {
     nodeType: "navigation",
     icon: (
@@ -23,6 +34,17 @@ const nodeLibraryItems: Array<{
     title: "Navigation Block",
     description: "Navigate on the page",
   },
+  {
+    nodeType: "taskv2",
+    icon: (
+      <WorkflowBlockIcon
+        workflowBlockType={WorkflowBlockTypes.Taskv2}
+        className="size-6"
+      />
+    ),
+    title: "Task v2 Block",
+    description: "Runs a Skyvern v2 Task",
+  },
   {
     nodeType: "action",
     icon: (
@@ -67,17 +89,7 @@ const nodeLibraryItems: Array<{
     title: "Task Block",
     description: "Takes actions or extracts information",
   },
-  {
-    nodeType: "taskv2",
-    icon: (
-      <WorkflowBlockIcon
-        workflowBlockType={WorkflowBlockTypes.Taskv2}
-        className="size-6"
-      />
-    ),
-    title: "Task v2 Block",
-    description: "Runs a Skyvern v2 Task",
-  },
+
   {
     nodeType: "url",
     icon: (
@@ -188,17 +200,6 @@ const nodeLibraryItems: Array<{
     title: "File Download Block",
     description: "Download a file",
   },
-  {
-    nodeType: "login",
-    icon: (
-      <WorkflowBlockIcon
-        workflowBlockType={WorkflowBlockTypes.Login}
-        className="size-6"
-      />
-    ),
-    title: "Login Block",
-    description: "Login to a website",
-  },
   {
     nodeType: "wait",
     icon: (