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

Adjust responsiveness of workflow run tasks tabe (#1221)

Browse Source
This commit is contained in:
Shuchang Zheng
2024-11-19 12:46:56 -08:00
committed by GitHub
parent 9b29ed1d5b
commit cca254e5c9
2 changed files with 50 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -34,14 +34,22 @@ function WorkflowBlockCollapsibleContent({ task, onNavigate }: Props) {
/>
) : null;
const isCanceled = task?.status === Status.Canceled;
const showFailureReason =
task?.status === Status.Failed ||
task?.status === Status.Terminated ||
task?.status === Status.TimedOut;
task?.status === Status.TimedOut ||
task?.status === Status.Canceled;
const failureReason = showFailureReason ? (
<CodeEditor
language="json"
value={JSON.stringify(task.failure_reason, null, 2)}
value={JSON.stringify(
task.failure_reason ?? (isCanceled && "This task was canceled."),
null,
2,
)}
readOnly
minHeight={"96px"}
maxHeight={"500px"}
@@ -59,7 +67,7 @@ function WorkflowBlockCollapsibleContent({ task, onNavigate }: Props) {
>
<TableCell>
<CollapsibleTrigger asChild>
<div className="w-fit cursor-pointer rounded-full p-2 hover:bg-muted">
<div className="w-10 cursor-pointer rounded-full p-2 hover:bg-muted">
{open ? (
<ChevronDownIcon className="size-6" />
) : (
@@ -68,11 +76,15 @@ function WorkflowBlockCollapsibleContent({ task, onNavigate }: Props) {
</div>
</CollapsibleTrigger>
</TableCell>
<TableCell className="w-1/4 cursor-pointer">
<TableCell
className="w-1/5 max-w-0 cursor-pointer truncate"
title={task.request.title ?? undefined}
>
{task.request.title}
</TableCell>
<TableCell
className="w-1/4 cursor-pointer"
className="w-1/6 max-w-0 cursor-pointer truncate"
title={task.task_id}
onClick={(event) => {
onNavigate(event, task.task_id);
}}
@@ -80,19 +92,20 @@ function WorkflowBlockCollapsibleContent({ task, onNavigate }: Props) {
{task.task_id}
</TableCell>
<TableCell
className="w-1/4 max-w-64 cursor-pointer overflow-hidden overflow-ellipsis whitespace-nowrap"
className="w-1/4 max-w-0 cursor-pointer truncate"
title={task.request.url}
onClick={(event) => onNavigate(event, task.task_id)}
>
{task.request.url}
</TableCell>
<TableCell
className="w-1/6 cursor-pointer"
className="w-1/8 cursor-pointer"
onClick={(event) => onNavigate(event, task.task_id)}
>
<StatusBadge status={task.status} />
</TableCell>
<TableCell
className="w-1/4 cursor-pointer whitespace-nowrap"
className="w-1/5 max-w-0 cursor-pointer truncate"
onClick={(event) => onNavigate(event, task.task_id)}
title={basicTimeFormat(task.created_at)}
>

36
skyvern-frontend/src/routes/workflows/WorkflowRun.tsx
View File

@@ -68,7 +68,6 @@ import {
useParams,
useSearchParams,
} from "react-router-dom";
import { TaskListSkeletonRows } from "../tasks/list/TaskListSkeletonRows";
import {
statusIsFinalized,
statusIsNotFinalized,
@@ -354,6 +353,29 @@ function WorkflowRun() {
</div>
) : null;
const skeleton = (
<TableRow>
<TableCell className="w-10">
<Skeleton className="h-6 w-full" />
</TableCell>
<TableCell className="w-1/5">
<Skeleton className="h-6 w-full" />
</TableCell>
<TableCell className="w-1/6">
<Skeleton className="h-6 w-full" />
</TableCell>
<TableCell className="w-1/4">
<Skeleton className="h-6 w-full" />
</TableCell>
<TableCell className="w-1/8">
<Skeleton className="h-6 w-full" />
</TableCell>
<TableCell className="w-1/5">
<Skeleton className="h-6 w-full" />
</TableCell>
</TableRow>
);
return (
<div className="space-y-8">
<header className="flex justify-between">
@@ -522,21 +544,21 @@ function WorkflowRun() {
<Table>
<TableHeader className="rounded-t-md bg-slate-elevation2">
<TableRow>
<TableHead className="rounded-tl-md"></TableHead>
<TableHead className="w-1/4 text-slate-400">
<TableHead className="w-10 rounded-tl-md"></TableHead>
<TableHead className="w-1/5 text-slate-400">
Task Title
</TableHead>
<TableHead className="w-1/4 text-slate-400">ID</TableHead>
<TableHead className="w-1/6 text-slate-400">ID</TableHead>
<TableHead className="w-1/4 text-slate-400">URL</TableHead>
<TableHead className="w-1/6 text-slate-400">Status</TableHead>
<TableHead className="w-1/4 rounded-tr-md text-slate-400">
<TableHead className="w-1/8 text-slate-400">Status</TableHead>
<TableHead className="w-1/5 rounded-tr-md text-slate-400">
Created At
</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{workflowTasksIsLoading ? (
<TaskListSkeletonRows />
skeleton
) : workflowTasks?.length === 0 ? (
<TableRow>
<TableCell colSpan={6}>Could not find any tasks</TableCell>