vodorod/Dorod-Sky
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix issues in forms page, add prompt editing (#1342)

Browse Source 
Co-authored-by: Muhammed Salih Altun <muhammedsalihaltun@gmail.com>
This commit is contained in:
Shuchang Zheng
2024-12-06 11:06:05 -08:00
committed by GitHub
parent 3467382845
commit 6151527c26
1 changed files with 33 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
skyvern-frontend/src/routes/workflows/WorkflowBlockCollapsibleContent.tsx
View File

@@ -12,6 +12,7 @@ import { useState } from "react";
import { cn } from "@/util/utils"; import { cn } from "@/util/utils";
import { CodeEditor } from "./components/CodeEditor"; import { CodeEditor } from "./components/CodeEditor";
import { AutoResizingTextarea } from "@/components/AutoResizingTextarea/AutoResizingTextarea"; import { AutoResizingTextarea } from "@/components/AutoResizingTextarea/AutoResizingTextarea";
import { statusIsFinalized } from "../tasks/types";
type Props = { type Props = {
task: TaskApiResponse; task: TaskApiResponse;
@@ -20,7 +21,9 @@ type Props = {
function WorkflowBlockCollapsibleContent({ task, onNavigate }: Props) { function WorkflowBlockCollapsibleContent({ task, onNavigate }: Props) {
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const [activeTab, setActiveTab] = useState(0); const [activeTab, setActiveTab] = useState<"output" | "goal" | "parameters">(
statusIsFinalized(task) ? "output" : "goal",
);
const showExtractedInformation = task?.status === Status.Completed; const showExtractedInformation = task?.status === Status.Completed;
const extractedInformation = showExtractedInformation ? ( const extractedInformation = showExtractedInformation ? (
@@ -120,32 +123,36 @@ function WorkflowBlockCollapsibleContent({ task, onNavigate }: Props) {
<TableCell colSpan={6} className="border-b"> <TableCell colSpan={6} className="border-b">
<div className="space-y-2 px-6"> <div className="space-y-2 px-6">
<div className="flex gap-1"> <div className="flex gap-1">
<div {statusIsFinalized(task) && (
className={cn( <div
"cursor-pointer rounded-sm px-3 py-2 text-slate-400 hover:bg-slate-700", className={cn(
{ "cursor-pointer rounded-sm px-3 py-2 text-slate-400 hover:bg-slate-700",
"bg-slate-700 text-foreground": activeTab === 0, {
}, "bg-slate-700 text-foreground":
)} activeTab === "output",
onClick={() => { },
setActiveTab(0); )}
}} onClick={() => {
> setActiveTab("output");
{showExtractedInformation }}
? "Extracted Information" >
: showFailureReason {showExtractedInformation
? "Failure Reason" ? "Extracted Information"
: ""} : showFailureReason
</div> ? "Failure Reason"
: ""}
</div>
)}
<div <div
className={cn( className={cn(
"cursor-pointer rounded-sm px-3 py-2 text-slate-400 hover:bg-slate-700 hover:text-foreground", "cursor-pointer rounded-sm px-3 py-2 text-slate-400 hover:bg-slate-700 hover:text-foreground",
{ {
"bg-slate-700 text-foreground": activeTab === 1, "bg-slate-700 text-foreground": activeTab === "goal",
}, },
)} )}
onClick={() => { onClick={() => {
setActiveTab(1); setActiveTab("goal");
}} }}
> >
Navigation Goal Navigation Goal
@@ -154,30 +161,31 @@ function WorkflowBlockCollapsibleContent({ task, onNavigate }: Props) {
className={cn( className={cn(
"cursor-pointer rounded-sm px-3 py-2 text-slate-400 hover:bg-slate-700 hover:text-foreground", "cursor-pointer rounded-sm px-3 py-2 text-slate-400 hover:bg-slate-700 hover:text-foreground",
{ {
"bg-slate-700 text-foreground": activeTab === 2, "bg-slate-700 text-foreground":
activeTab === "parameters",
}, },
)} )}
onClick={() => { onClick={() => {
setActiveTab(2); setActiveTab("parameters");
}} }}
> >
Parameters Parameters
</div> </div>
</div> </div>
<div> <div>
{activeTab === 0 && {activeTab === "output" &&
(showExtractedInformation (showExtractedInformation
? extractedInformation ? extractedInformation
: showFailureReason : showFailureReason
? failureReason ? failureReason
: null)} : null)}
{activeTab === 1 && ( {activeTab === "goal" && (
<AutoResizingTextarea <AutoResizingTextarea
value={task.request.navigation_goal ?? ""} value={task.request.navigation_goal ?? ""}
readOnly readOnly
/> />
)} )}
{activeTab === 2 && ( {activeTab === "parameters" && (
<CodeEditor <CodeEditor
language="json" language="json"
value={JSON.stringify( value={JSON.stringify(