From 09701394185974bf7b263fe338916a168185ef3b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E6=A9=98?= <xiaoju@shazhou.work>
Date: Mon, 11 May 2026 12:09:48 +0000
Subject: [PATCH 1/2] fix: sort thread list newest-first and differentiate
 status colors
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Sort threads by startedAt descending (newest first)
- completed: green (dimmed) — distinct from running (green, full opacity)
- active: accent color (blue) — was same muted gray as completed
- failed: red — unchanged
- running: green — unchanged

Fixes #191
---
 .../workflow-dashboard/src/components/thread-list.tsx  | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/workflow-dashboard/src/components/thread-list.tsx b/packages/workflow-dashboard/src/components/thread-list.tsx
index a17c972..f14ca57 100644
--- a/packages/workflow-dashboard/src/components/thread-list.tsx
+++ b/packages/workflow-dashboard/src/components/thread-list.tsx
@@ -13,7 +13,10 @@ export function ThreadList({ agent, onSelect }: Props) {
     return <p style={{ color: "var(--color-text-muted)" }}>Loading threads...</p>;
   if (status === "error") return <p style={{ color: "var(--color-error)" }}>Error: {error}</p>;
 
-  const threads = data.threads;
+  const threads = [...data.threads].sort((a, b) => {
+    if (!a.startedAt || !b.startedAt) return 0;
+    return b.startedAt.localeCompare(a.startedAt);
+  });
 
   return (
     <div>
@@ -43,8 +46,11 @@ export function ThreadList({ agent, onSelect }: Props) {
                           ? "var(--color-success)"
                           : t.status === "failed"
                             ? "var(--color-error)"
-                            : "var(--color-text-muted)",
+                            : t.status === "completed"
+                              ? "var(--color-success)"
+                              : "var(--color-accent)",
                       color: "#000",
+                      opacity: t.status === "completed" ? 0.7 : 1,
                     }}
                   >
                     {t.status}

From f87cb38a67e316bc62cdd38018831b2940b68e76 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E6=A9=98?= <xiaoju@shazhou.work>
Date: Mon, 11 May 2026 12:14:51 +0000
Subject: [PATCH 2/2] =?UTF-8?q?fix:=20review=20=E2=80=94=20stable=20sort?=
 =?UTF-8?q?=20fallback,=20cleaner=20status=20colors?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Sort: threads without startedAt pushed to bottom (not random)
- Colors: completed=success(green), running/active=accent(blue), failed=error(red)
- Remove opacity hack, simplify ternary

小橘 <xiaoju@shazhou.work>
---
 .../workflow-dashboard/src/components/thread-list.tsx | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/packages/workflow-dashboard/src/components/thread-list.tsx b/packages/workflow-dashboard/src/components/thread-list.tsx
index f14ca57..01fdf5d 100644
--- a/packages/workflow-dashboard/src/components/thread-list.tsx
+++ b/packages/workflow-dashboard/src/components/thread-list.tsx
@@ -14,7 +14,9 @@ export function ThreadList({ agent, onSelect }: Props) {
   if (status === "error") return <p style={{ color: "var(--color-error)" }}>Error: {error}</p>;
 
   const threads = [...data.threads].sort((a, b) => {
-    if (!a.startedAt || !b.startedAt) return 0;
+    if (!a.startedAt && !b.startedAt) return 0;
+    if (!a.startedAt) return 1;
+    if (!b.startedAt) return -1;
     return b.startedAt.localeCompare(a.startedAt);
   });
 
@@ -42,15 +44,12 @@ export function ThreadList({ agent, onSelect }: Props) {
                     className="text-xs px-2 py-0.5 rounded"
                     style={{
                       background:
-                        t.status === "running"
+                        t.status === "completed"
                           ? "var(--color-success)"
                           : t.status === "failed"
                             ? "var(--color-error)"
-                            : t.status === "completed"
-                              ? "var(--color-success)"
-                              : "var(--color-accent)",
+                            : "var(--color-accent)",
                       color: "#000",
-                      opacity: t.status === "completed" ? 0.7 : 1,
                     }}
                   >
                     {t.status}