fix(chat): exclude the active head from the queue, not just PENDING

The queue panel was duplicating the current message: a just-sent message
sits ENQUEUED ("accepted and queued") for a window before it flips to
PENDING, and the previous filter only excluded PENDING — so the active
head leaked into the panel while also rendering in the chat body.

Define the active run as the *oldest non-terminal* gate workflow (PENDING
or ENQUEUED) and exclude it: new pure `selectWaitingQueueItems(items)`
sorts by enqueuedAt and drops the head. The current message keeps
rendering in the body as before; the panel shows only what comes next.

Verified live: a lone ENQUEUED head shows no panel (only the body), and a
head + one waiting item shows just the waiting one.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Author: tlgimenes

apps/mesh/src/web/components/chat/queue-items.test.ts

@@ -0,0 +1,57 @@
+import { describe, expect, it } from "bun:test";
+import { selectWaitingQueueItems } from "./queue-items";
+import type { QueueItemDTO } from "./use-thread-queue";
+
+const item = (
+  id: string,
+  status: "running" | "queued",
+  enqueuedAt: number,
+): QueueItemDTO => ({
+  workflowId: `thread-run:t:${id}`,
+  messageId: id,
+  text: id,
+  status,
+  enqueuedAt,
+});
+
+describe("selectWaitingQueueItems", () => {
+  it("returns nothing for an empty queue", () => {
+    expect(selectWaitingQueueItems([])).toEqual([]);
+  });
+
+  it("hides a lone PENDING head (running, in the body)", () => {
+    expect(selectWaitingQueueItems([item("a", "running", 1)])).toEqual([]);
+  });
+
+  it("hides a lone ENQUEUED head — the 'accepted and queued' window", () => {
+    // The reported bug: a just-sent first message sits ENQUEUED before it
+    // flips to PENDING; it's the active run shown in the body, not a wait.
+    expect(selectWaitingQueueItems([item("massa", "queued", 1)])).toEqual([]);
+  });
+
+  it("shows the messages waiting behind a running head", () => {
+    const out = selectWaitingQueueItems([
+      item("head", "running", 1),
+      item("q1", "queued", 2),
+      item("q2", "queued", 3),
+    ]);
+    expect(out.map((i) => i.messageId)).toEqual(["q1", "q2"]);
+  });
+
+  it("drops the oldest when none is running yet (all ENQUEUED)", () => {
+    const out = selectWaitingQueueItems([
+      item("head", "queued", 1),
+      item("q1", "queued", 2),
+    ]);
+    expect(out.map((i) => i.messageId)).toEqual(["q1"]);
+  });
+
+  it("sorts by enqueuedAt before dropping the head", () => {
+    const out = selectWaitingQueueItems([
+      item("q2", "queued", 3),
+      item("head", "running", 1),
+      item("q1", "queued", 2),
+    ]);
+    expect(out.map((i) => i.messageId)).toEqual(["q1", "q2"]);
+  });
+});

apps/mesh/src/web/components/chat/queue-items.ts

@@ -0,0 +1,16 @@
+import type { QueueItemDTO } from "./use-thread-queue";
+
+/**
+ * The messages *waiting behind* the active run, for the queue panel.
+ *
+ * The active run is the oldest non-terminal gate workflow — whether it's
+ * already PENDING ("running") or still ENQUEUED in the brief "accepted and
+ * queued" window before it flips to PENDING. That message is the one being
+ * processed and is already rendered in the chat body, so the panel must
+ * exclude it and show only what comes next. Pure + total.
+ */
+export function selectWaitingQueueItems(items: QueueItemDTO[]): QueueItemDTO[] {
+  if (items.length <= 1) return [];
+  const sorted = [...items].sort((a, b) => a.enqueuedAt - b.enqueuedAt);
+  return sorted.slice(1);
+}

apps/mesh/src/web/components/chat/queue-panel.tsx

@@ -1,17 +1,18 @@
 import { Button } from "@deco/ui/components/button.tsx";
 import { X } from "@untitledui/icons";
+import { selectWaitingQueueItems } from "./queue-items";
 import { useCancelQueuedMessage, useThreadQueue } from "./use-thread-queue";
 
 /**
  * Pending-message queue above the composer. Lists only the messages *waiting*
- * behind the active run — the running head is excluded here because it's
- * already rendered in the chat body. Each row cancels its own gate workflow.
- * Hidden when nothing is queued.
+ * behind the active run — the message currently being processed (the oldest
+ * non-terminal gate workflow) is excluded because it's already rendered in the
+ * chat body. Each row cancels its own gate workflow. Hidden when nothing waits.
  */
 export function ThreadQueuePanel({ taskId }: { taskId: string }) {
   const { items } = useThreadQueue(taskId);
   const cancel = useCancelQueuedMessage(taskId);
-  const queued = items.filter((i) => i.status === "queued");
+  const queued = selectWaitingQueueItems(items);
   if (queued.length === 0) return null;
 
   return (