@opengeni/react 0.6.0 → 0.6.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeni/react",
-  "version": "0.6.0",
+  "version": "0.6.2",
   "description": "React hooks and styled components for OpenGeni: live session streaming, chat composer, message timeline, session status, and fleet views — token-themed (CSS variables), dark-first, built on Tailwind v4 + Radix + Motion.",
   "license": "Apache-2.0",
   "repository": {

package/src/components/message-timeline.tsx

@@ -287,8 +287,11 @@ function UserMessageRow({
 }) {
   return (
     <div className="animate-og-enter flex justify-end">
-      <div className="max-w-[85%] min-w-0 rounded-og-lg rounded-br-og-xs border border-og-border bg-og-surface-2 px-4 py-2.5 text-og-md leading-6 text-og-fg">
-        {renderMessageText ? renderMessageText(item.text, item) : <Markdown>{item.text}</Markdown>}
+      <div className="flex max-w-[85%] min-w-0 flex-col items-end gap-1">
+        {item.pending ? <span className="px-1 text-og-xs text-og-fg-subtle">queued</span> : null}
+        <div className="w-fit max-w-full min-w-0 rounded-og-lg rounded-br-og-xs border border-og-border bg-og-surface-2 px-4 py-2.5 text-og-md leading-6 text-og-fg">
+          {renderMessageText ? renderMessageText(item.text, item) : <Markdown>{item.text}</Markdown>}
+        </div>
       </div>
     </div>
   );

package/src/timeline/projection.ts

@@ -34,7 +34,8 @@ const WORKER_INTERRUPT_TOOL = "session_interrupt";
 
 export function buildTimeline(events: SessionEvent[]): TimelineItem[] {
   const items: TimelineItem[] = [];
-  const ordered = [...events].sort((a, b) => a.sequence - b.sequence);
+  const prescan = prescanTurnAnchors(events);
+  const ordered = orderTimelineEvents(events, prescan);
 
   const last = (): TimelineItem | undefined => items[items.length - 1];
 
@@ -76,6 +77,7 @@ export function buildTimeline(events: SessionEvent[]): TimelineItem[] {
           kind: "user-message",
           id: event.id,
           text: typeof payload.text === "string" ? payload.text : "",
+          ...(event.pendingUserMessage ? { pending: true } : {}),
           resources: resourceRefs(payload.resources),
           tools: toolRefs(payload.tools),
           occurredAt: event.occurredAt,
@@ -280,6 +282,14 @@ export function buildTimeline(events: SessionEvent[]): TimelineItem[] {
         if (!isSessionStatus(status)) {
           break;
         }
+        // Only attention-worthy statuses earn a timeline divider. queued /
+        // running / idle are machinery telemetry: the header pill carries the
+        // live status, the shimmer says "running", and the turn chip's duration
+        // facet says how long — a stale "idle · 27s" row is pure noise,
+        // especially in historical traces.
+        if (!ATTENTION_STATUSES.has(status)) {
+          break;
+        }
         const previous = [...items].reverse().find((item): item is SessionStatusItem => item.kind === "session-status");
         if (previous?.status === status) {
           break;
@@ -324,6 +334,12 @@ export function buildTimeline(events: SessionEvent[]): TimelineItem[] {
       }
 
       case "turn.cancelled": {
+        // A retraction of a never-started queued turn is not a turn ending —
+        // the message was withdrawn before any work happened; show nothing.
+        // A null turnId proves nothing, so it keeps the legacy finalize path.
+        if (turnId && !prescan.startedTurnIds.has(turnId)) {
+          break;
+        }
         const hadActivity = hasTurnActivity(items, turnId);
         finalizeOpen(turnId, "cancelled");
         items.push(turnEndItem(event, "cancelled", null));
@@ -425,6 +441,128 @@ export function groupTimeline(items: TimelineItem[]): TimelineGroup[] {
 
 /* --- helpers ---------------------------------------------------------------- */
 
+type TimelineEvent = SessionEvent & { pendingUserMessage?: true };
+
+type TurnAnchorPrescan = {
+  queuedTurnByTrigger: Map<string, string>;
+  startSeqByTrigger: Map<string, number>;
+  cancelledBeforeStartTriggers: Set<string>;
+  startedTurnIds: Set<string>;
+};
+
+function prescanTurnAnchors(events: SessionEvent[]): TurnAnchorPrescan {
+  const ordered = [...events].sort((a, b) => a.sequence - b.sequence);
+  const queuedTurnByTrigger = new Map<string, string>();
+  const startSeqByTrigger = new Map<string, number>();
+  const cancelledTurnIds = new Set<string>();
+  const fallbackSeqByTurn = new Map<string, number>();
+  const startedTurnIds = new Set<string>();
+
+  for (const event of ordered) {
+    const payload = asRecord(event.payload);
+    const turnId = event.turnId ?? null;
+    if (event.type === "turn.queued") {
+      const triggerEventId = typeof payload.triggerEventId === "string" ? payload.triggerEventId : null;
+      const queuedTurnId = typeof payload.turnId === "string" ? payload.turnId : turnId;
+      if (triggerEventId && queuedTurnId) {
+        queuedTurnByTrigger.set(triggerEventId, queuedTurnId);
+      }
+      continue;
+    }
+    if (event.type === "turn.started") {
+      const triggerEventId = typeof payload.triggerEventId === "string" ? payload.triggerEventId : null;
+      if (triggerEventId) {
+        startSeqByTrigger.set(triggerEventId, event.sequence);
+      }
+      if (turnId) {
+        startedTurnIds.add(turnId);
+      }
+    } else if (event.type === "turn.cancelled" && turnId) {
+      cancelledTurnIds.add(turnId);
+    }
+
+    if (turnId && event.type !== "turn.queued" && event.type !== "turn.cancelled") {
+      const previous = fallbackSeqByTurn.get(turnId);
+      if (previous === undefined || event.sequence < previous) {
+        fallbackSeqByTurn.set(turnId, event.sequence);
+      }
+    }
+    if (turnId && isAgentActivityEvent(event.type)) {
+      startedTurnIds.add(turnId);
+    }
+  }
+
+  for (const [triggerEventId, turnId] of queuedTurnByTrigger) {
+    if (!startSeqByTrigger.has(triggerEventId)) {
+      const fallbackSeq = fallbackSeqByTurn.get(turnId);
+      if (fallbackSeq !== undefined) {
+        startSeqByTrigger.set(triggerEventId, fallbackSeq);
+      }
+    }
+  }
+
+  const cancelledBeforeStartTriggers = new Set<string>();
+  for (const [triggerEventId, turnId] of queuedTurnByTrigger) {
+    if (cancelledTurnIds.has(turnId) && !startSeqByTrigger.has(triggerEventId) && !fallbackSeqByTurn.has(turnId)) {
+      cancelledBeforeStartTriggers.add(triggerEventId);
+    }
+  }
+
+  return { queuedTurnByTrigger, startSeqByTrigger, cancelledBeforeStartTriggers, startedTurnIds };
+}
+
+function orderTimelineEvents(events: SessionEvent[], prescan: TurnAnchorPrescan): TimelineEvent[] {
+  const ordered = [...events].sort((a, b) => a.sequence - b.sequence);
+  const insertions = new Map<number, TimelineEvent[]>();
+  const pending: TimelineEvent[] = [];
+
+  for (const event of ordered) {
+    if (event.type !== "user.message") {
+      continue;
+    }
+    const queuedTurnId = prescan.queuedTurnByTrigger.get(event.id);
+    if (!queuedTurnId) {
+      pushInsertion(insertions, event.sequence, event);
+      continue;
+    }
+    if (prescan.cancelledBeforeStartTriggers.has(event.id)) {
+      continue;
+    }
+    const startSeq = prescan.startSeqByTrigger.get(event.id);
+    if (startSeq !== undefined) {
+      pushInsertion(insertions, startSeq, event);
+      continue;
+    }
+    pending.push({ ...event, pendingUserMessage: true });
+  }
+
+  const projected: TimelineEvent[] = [];
+  for (const event of ordered) {
+    const before = insertions.get(event.sequence);
+    if (before) {
+      projected.push(...before);
+    }
+    if (event.type !== "user.message") {
+      projected.push(event);
+    }
+  }
+  projected.push(...pending);
+  return projected;
+}
+
+function pushInsertion(insertions: Map<number, TimelineEvent[]>, sequence: number, event: SessionEvent): void {
+  const bucket = insertions.get(sequence);
+  if (bucket) {
+    bucket.push(event);
+  } else {
+    insertions.set(sequence, [event]);
+  }
+}
+
+function isAgentActivityEvent(type: string): boolean {
+  return type.startsWith("agent.") || type.startsWith("sandbox.");
+}
+
 function turnEndItem(
   event: SessionEvent,
   outcome: TurnEndItem["outcome"],
@@ -577,6 +715,9 @@ function asRecord(value: unknown): Record<string, unknown> {
 
 const SESSION_STATUSES: readonly SessionStatus[] = ["queued", "running", "idle", "requires_action", "failed", "cancelled"];
 
+/** Statuses that demand the reader's attention and so earn a timeline divider. */
+const ATTENTION_STATUSES: ReadonlySet<SessionStatus> = new Set(["requires_action", "failed", "cancelled"]);
+
 /** Keep only entries that match the wire shapes; user payloads are untyped. */
 function resourceRefs(value: unknown): import("@opengeni/sdk").ResourceRef[] {
   if (!Array.isArray(value)) {

package/src/timeline/types.ts

@@ -13,6 +13,8 @@ export type UserMessageItem = {
   kind: "user-message";
   id: string;
   text: string;
+  /** Queued for a future turn whose start has not appeared in the event log. */
+  pending?: boolean;
   /** Resources attached to this message (file uploads, repositories). */
   resources: ResourceRef[];
   /** Tools requested for the turn this message starts. */