Split AI Validation and Human Interaction blocks in frontend (#4658)

Co-authored-by: Suchintan Singh <suchintan@skyvern.com>

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

@@ -84,17 +84,6 @@ function HumanInteractionNode({
           nodeId={id}
           totpIdentifier={null}
           totpUrl={null}
-          transmutations={{
-            blockTitle: "Validation",
-            self: "human",
-            others: [
-              {
-                label: "agent",
-                reason: "Convert to automated agent validation",
-                nodeName: "validation",
-              },
-            ],
-          }}
           type={type}
         />
         <div

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

@@ -96,17 +96,6 @@ function ValidationNode({ id, data, type }: NodeProps<ValidationNode>) {
             nodeId={id}
             totpIdentifier={null}
             totpUrl={null}
-            transmutations={{
-              blockTitle: "Validation",
-              self: "agent",
-              others: [
-                {
-                  label: "human",
-                  reason: "Convert to human validation",
-                  nodeName: "human_interaction",
-                },
-              ],
-            }}
             type={type}
           />
           <div className="space-y-2">

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

@@ -59,7 +59,7 @@ export const workflowBlockTitle: {
   text_prompt: "Text Prompt",
   upload_to_s3: "Upload To S3",
   file_upload: "Cloud Storage",
-  validation: "Validation",
+  validation: "AI Validation",
   human_interaction: "Human Interaction",
   wait: "Wait",
   pdf_parser: "PDF Parser",

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

@@ -84,24 +84,20 @@ const nodeLibraryItems: Array<{
         className="size-6"
       />
     ),
-    title: "AI or Human Validation",
-    description: "Have an AI or Human validate the state of the screen",
+    title: "AI Validation Block",
+    description: "Have an AI validate the state of the screen",
+  },
+  {
+    nodeType: "human_interaction",
+    icon: (
+      <WorkflowBlockIcon
+        workflowBlockType={WorkflowBlockTypes.HumanInteraction}
+        className="size-6"
+      />
+    ),
+    title: "Human Interaction Block",
+    description: "Pause workflow for human review and approval",
   },
-  /**
-   * The Human Interaction block can be had via a transmutation of the
-   * Validation block.
-   */
-  // {
-  //   nodeType: "human_interaction",
-  //   icon: (
-  //     <WorkflowBlockIcon
-  //       workflowBlockType={WorkflowBlockTypes.HumanInteraction}
-  //       className="size-6"
-  //     />
-  //   ),
-  //   title: "Human Interaction Block",
-  //   description: "Validate via human interaction",
-  // },
   // {
   //   nodeType: "task",
   //   icon: (