From 2e9bcc3463a8fbf55a4dd35aaf94227170bf3272 Mon Sep 17 00:00:00 2001
From: Shuchang Zheng <wintonzheng0325@gmail.com>
Date: Mon, 6 Jan 2025 09:13:05 -0800
Subject: [PATCH] Use API order instead of reordering timeline (#1503)

---
 .../routes/workflows/workflowRun/WorkflowRunTimeline.tsx  | 8 ++++----
 .../workflowRun/WorkflowRunTimelineBlockItem.tsx          | 2 +-
 .../routes/workflows/workflowRun/workflowTimelineUtils.ts | 6 ++----
 3 files changed, 7 insertions(+), 9 deletions(-)

diff --git a/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimeline.tsx b/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimeline.tsx
index d2cdad89..9118c84f 100644
--- a/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimeline.tsx
+++ b/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimeline.tsx
@@ -56,8 +56,6 @@ function WorkflowRunTimeline({
 
   const workflowRunIsNotFinalized = statusIsNotFinalized(workflowRun);
 
-  const timeline = workflowRunTimeline.slice().reverse();
-
   const numberOfActions = workflowRunTimeline.reduce((total, current) => {
     if (isTaskVariantBlockItem(current)) {
       return total + current.block!.actions!.length;
@@ -98,8 +96,10 @@ function WorkflowRunTimeline({
                 </div>
               </div>
             )}
-            {timeline.length === 0 && <div>Workflow timeline is empty</div>}
-            {timeline?.map((timelineItem) => {
+            {workflowRunTimeline.length === 0 && (
+              <div>Workflow timeline is empty</div>
+            )}
+            {workflowRunTimeline?.map((timelineItem) => {
               if (isBlockItem(timelineItem)) {
                 return (
                   <WorkflowRunTimelineBlockItem
diff --git a/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineBlockItem.tsx b/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineBlockItem.tsx
index 7bfef4d0..d00cc141 100644
--- a/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineBlockItem.tsx
+++ b/skyvern-frontend/src/routes/workflows/workflowRun/WorkflowRunTimelineBlockItem.tsx
@@ -31,7 +31,7 @@ function WorkflowRunTimelineBlockItem({
   onBlockItemClick,
   onActionClick,
 }: Props) {
-  const actions = block.actions ? [...block.actions].reverse() : [];
+  const actions = block.actions ?? [];
 
   const hasActiveAction =
     isAction(activeItem) &&
diff --git a/skyvern-frontend/src/routes/workflows/workflowRun/workflowTimelineUtils.ts b/skyvern-frontend/src/routes/workflows/workflowRun/workflowTimelineUtils.ts
index 964a9c50..6c36f3f7 100644
--- a/skyvern-frontend/src/routes/workflows/workflowRun/workflowTimelineUtils.ts
+++ b/skyvern-frontend/src/routes/workflows/workflowRun/workflowTimelineUtils.ts
@@ -37,15 +37,13 @@ function findActiveItem(
       return "stream";
     }
     if (timeline?.length > 0) {
-      const last = timeline.length - 1;
-      const timelineItem = timeline![last];
+      const timelineItem = timeline![0];
       if (isBlockItem(timelineItem)) {
         if (
           timelineItem.block.actions &&
           timelineItem.block.actions.length > 0
         ) {
-          const last = timelineItem.block.actions.length - 1;
-          return timelineItem.block.actions[last]!;
+          return timelineItem.block.actions[0]!;
         }
         return timelineItem.block;
       }