From 81d5babcf0fdcca6778a1611508f8e0deb506d15 Mon Sep 17 00:00:00 2001
From: Shuchang Zheng <wintonzheng0325@gmail.com>
Date: Tue, 28 Jan 2025 04:57:14 +0800
Subject: [PATCH] Redirect directly to workflow run when observer task created
 (#1662)

---
 .../routes/tasks/create/ExampleCasePill.tsx   | 18 ++++----------
 .../src/routes/tasks/create/PromptBox.tsx     | 24 ++++++-------------
 2 files changed, 11 insertions(+), 31 deletions(-)

diff --git a/skyvern-frontend/src/routes/tasks/create/ExampleCasePill.tsx b/skyvern-frontend/src/routes/tasks/create/ExampleCasePill.tsx
index 61f93bd1..df9b8baf 100644
--- a/skyvern-frontend/src/routes/tasks/create/ExampleCasePill.tsx
+++ b/skyvern-frontend/src/routes/tasks/create/ExampleCasePill.tsx
@@ -1,13 +1,11 @@
 import { getClient } from "@/api/AxiosClient";
 import { ObserverTask } from "@/api/types";
-import { Button } from "@/components/ui/button";
 import { toast } from "@/components/ui/use-toast";
 import { useCredentialGetter } from "@/hooks/useCredentialGetter";
 import { ReloadIcon } from "@radix-ui/react-icons";
-import { ToastAction } from "@radix-ui/react-toast";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { AxiosError } from "axios";
-import { Link, useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 
 type Props = {
   exampleId: string;
@@ -35,17 +33,6 @@ function ExampleCasePill({ exampleId, version, icon, label, prompt }: Props) {
         variant: "success",
         title: "Workflow Run Created",
         description: `Workflow run created successfully.`,
-        action: (
-          <ToastAction altText="View">
-            <Button asChild>
-              <Link
-                to={`/workflows/${response.data.workflow_permanent_id}/${response.data.workflow_run_id}`}
-              >
-                View
-              </Link>
-            </Button>
-          </ToastAction>
-        ),
       });
       queryClient.invalidateQueries({
         queryKey: ["workflowRuns"],
@@ -53,6 +40,9 @@ function ExampleCasePill({ exampleId, version, icon, label, prompt }: Props) {
       queryClient.invalidateQueries({
         queryKey: ["workflows"],
       });
+      navigate(
+        `/workflows/${response.data.workflow_permanent_id}/${response.data.workflow_run_id}`,
+      );
     },
     onError: (error: AxiosError) => {
       toast({
diff --git a/skyvern-frontend/src/routes/tasks/create/PromptBox.tsx b/skyvern-frontend/src/routes/tasks/create/PromptBox.tsx
index df13f0f7..cf720bf4 100644
--- a/skyvern-frontend/src/routes/tasks/create/PromptBox.tsx
+++ b/skyvern-frontend/src/routes/tasks/create/PromptBox.tsx
@@ -12,7 +12,8 @@ import { GraphIcon } from "@/components/icons/GraphIcon";
 import { InboxIcon } from "@/components/icons/InboxIcon";
 import { MessageIcon } from "@/components/icons/MessageIcon";
 import { TrophyIcon } from "@/components/icons/TrophyIcon";
-import { Button } from "@/components/ui/button";
+import { ProxySelector } from "@/components/ProxySelector";
+import { Input } from "@/components/ui/input";
 import {
   CustomSelectItem,
   Select,
@@ -21,6 +22,7 @@ import {
   SelectTrigger,
   SelectValue,
 } from "@/components/ui/select";
+import { Switch } from "@/components/ui/switch";
 import { toast } from "@/components/ui/use-toast";
 import { useCredentialGetter } from "@/hooks/useCredentialGetter";
 import {
@@ -31,20 +33,16 @@ import {
   PlusIcon,
   ReloadIcon,
 } from "@radix-ui/react-icons";
-import { ToastAction } from "@radix-ui/react-toast";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { AxiosError } from "axios";
 import { useState } from "react";
-import { Link, useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 import { stringify as convertToYAML } from "yaml";
 import {
   generatePhoneNumber,
   generateUniqueEmail,
 } from "../data/sampleTaskData";
 import { ExampleCasePill } from "./ExampleCasePill";
-import { Input } from "@/components/ui/input";
-import { ProxySelector } from "@/components/ProxySelector";
-import { Switch } from "@/components/ui/switch";
 
 function createTemplateTaskFromTaskGenerationParameters(
   values: TaskGenerationApiResponse,
@@ -174,17 +172,6 @@ function PromptBox() {
         variant: "success",
         title: "Workflow Run Created",
         description: `Workflow run created successfully.`,
-        action: (
-          <ToastAction altText="View">
-            <Button asChild>
-              <Link
-                to={`/workflows/${response.data.workflow_permanent_id}/${response.data.workflow_run_id}`}
-              >
-                View
-              </Link>
-            </Button>
-          </ToastAction>
-        ),
       });
       queryClient.invalidateQueries({
         queryKey: ["workflowRuns"],
@@ -192,6 +179,9 @@ function PromptBox() {
       queryClient.invalidateQueries({
         queryKey: ["workflows"],
       });
+      navigate(
+        `/workflows/${response.data.workflow_permanent_id}/${response.data.workflow_run_id}`,
+      );
     },
     onError: (error: AxiosError) => {
       toast({