@workflow/web-shared 4.1.0-beta.61 → 4.1.0-beta.63

package/dist/lib/event-materialization.js

@@ -0,0 +1,171 @@
+/**
+ * Event materialization helpers.
+ *
+ * These functions convert a flat list of workflow events into entity-like
+ * objects (steps, hooks, waits) by grouping events by correlationId and
+ * stitching together lifecycle events.
+ *
+ * This enables a "top-down" data fetching pattern where the client fetches
+ * all events for a run once, then materializes entities client-side instead
+ * of making separate API calls for each entity type.
+ */
+// ---------------------------------------------------------------------------
+// Helper: group events by correlationId prefix
+// ---------------------------------------------------------------------------
+function groupByCorrelationId(events, prefixes) {
+    const groups = new Map();
+    for (const event of events) {
+        const cid = event.correlationId;
+        if (!cid)
+            continue;
+        if (!prefixes.some((p) => cid.startsWith(p)))
+            continue;
+        const existing = groups.get(cid);
+        if (existing) {
+            existing.push(event);
+        }
+        else {
+            groups.set(cid, [event]);
+        }
+    }
+    return groups;
+}
+// ---------------------------------------------------------------------------
+// materializeSteps
+// ---------------------------------------------------------------------------
+/**
+ * Group step_* events by correlationId and build Step-like entities.
+ *
+ * Handles partial event lists gracefully: a step may only have a
+ * step_created event with no completion yet.
+ */
+export function materializeSteps(events) {
+    const groups = groupByCorrelationId(events, ['step_']);
+    const steps = [];
+    for (const [correlationId, stepEvents] of groups) {
+        const created = stepEvents.find((e) => e.eventType === 'step_created');
+        if (!created)
+            continue;
+        let status = 'pending';
+        let attempt = 0;
+        let startedAt;
+        let completedAt;
+        let updatedAt = created.createdAt;
+        for (const e of stepEvents) {
+            switch (e.eventType) {
+                case 'step_started':
+                    status = 'running';
+                    attempt += 1;
+                    if (!startedAt)
+                        startedAt = e.createdAt;
+                    completedAt = undefined;
+                    updatedAt = e.createdAt;
+                    break;
+                case 'step_completed':
+                    status = 'completed';
+                    completedAt = e.createdAt;
+                    updatedAt = e.createdAt;
+                    break;
+                case 'step_failed':
+                    status = 'failed';
+                    completedAt = e.createdAt;
+                    updatedAt = e.createdAt;
+                    break;
+                case 'step_retrying':
+                    status = 'pending';
+                    completedAt = undefined;
+                    updatedAt = e.createdAt;
+                    break;
+            }
+        }
+        steps.push({
+            stepId: correlationId,
+            runId: created.runId,
+            stepName: created.eventType === 'step_created'
+                ? (created.eventData?.stepName ?? correlationId)
+                : correlationId,
+            status,
+            attempt,
+            createdAt: created.createdAt,
+            startedAt,
+            completedAt,
+            updatedAt,
+            events: stepEvents,
+        });
+    }
+    return steps;
+}
+// ---------------------------------------------------------------------------
+// materializeHooks
+// ---------------------------------------------------------------------------
+/**
+ * Group hook_* events by correlationId and build Hook-like entities.
+ */
+export function materializeHooks(events) {
+    const groups = groupByCorrelationId(events, ['hook_']);
+    const hooks = [];
+    for (const [correlationId, hookEvents] of groups) {
+        const created = hookEvents.find((e) => e.eventType === 'hook_created');
+        if (!created)
+            continue;
+        const receivedEvents = hookEvents.filter((e) => e.eventType === 'hook_received');
+        const disposed = hookEvents.find((e) => e.eventType === 'hook_disposed');
+        const lastReceived = receivedEvents.at(-1);
+        hooks.push({
+            hookId: correlationId,
+            runId: created.runId,
+            token: created.eventType === 'hook_created'
+                ? created.eventData?.token
+                : undefined,
+            createdAt: created.createdAt,
+            receivedCount: receivedEvents.length,
+            lastReceivedAt: lastReceived?.createdAt,
+            disposedAt: disposed?.createdAt,
+            events: hookEvents,
+        });
+    }
+    return hooks;
+}
+// ---------------------------------------------------------------------------
+// materializeWaits
+// ---------------------------------------------------------------------------
+/**
+ * Group wait_* events by correlationId and build Wait-like entities.
+ */
+export function materializeWaits(events) {
+    const groups = groupByCorrelationId(events, ['wait_']);
+    const waits = [];
+    for (const [correlationId, waitEvents] of groups) {
+        const created = waitEvents.find((e) => e.eventType === 'wait_created');
+        if (!created)
+            continue;
+        const completed = waitEvents.find((e) => e.eventType === 'wait_completed');
+        waits.push({
+            waitId: correlationId,
+            runId: created.runId,
+            status: completed ? 'completed' : 'waiting',
+            createdAt: created.createdAt,
+            resumeAt: created.eventType === 'wait_created'
+                ? created.eventData?.resumeAt
+                : undefined,
+            completedAt: completed?.createdAt,
+            events: waitEvents,
+        });
+    }
+    return waits;
+}
+// ---------------------------------------------------------------------------
+// materializeAll
+// ---------------------------------------------------------------------------
+/**
+ * Convenience function that materializes all entity types from a flat
+ * event list.
+ */
+export function materializeAll(events) {
+    return {
+        steps: materializeSteps(events),
+        hooks: materializeHooks(events),
+        waits: materializeWaits(events),
+    };
+}
+//# sourceMappingURL=event-materialization.js.map

package/dist/lib/event-materialization.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"event-materialization.js","sourceRoot":"","sources":["../../src/lib/event-materialization.ts"],"names":[],"mappings":"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"}

package/dist/lib/trace-builder.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Builds a complete trace from a WorkflowRun and its Events.
+ *
+ * This module groups raw events by correlation ID and entity type,
+ * converts each group into an OpenTelemetry-style Span, and returns
+ * a fully-formed Trace ready for the trace viewer.
+ */
+import type { Event, WorkflowRun } from '@workflow/world';
+import type { Span } from '../components/trace-viewer/types';
+export declare const isStepEvent: (eventType: string) => boolean;
+export declare const isTimerEvent: (eventType: string) => eventType is "wait_created" | "wait_completed";
+export declare const isHookLifecycleEvent: (eventType: string) => eventType is "hook_created" | "hook_received" | "hook_disposed";
+export type GroupedEvents = {
+    eventsByStepId: Map<string, Event[]>;
+    runLevelEvents: Event[];
+    timerEvents: Map<string, Event[]>;
+    hookEvents: Map<string, Event[]>;
+};
+export declare function groupEventsByCorrelation(events: Event[]): GroupedEvents;
+export interface TraceWithMeta {
+    traceId: string;
+    rootSpanId: string;
+    spans: Span[];
+    resources: {
+        name: string;
+        attributes: Record<string, string>;
+    }[];
+    /** Duration in ms from trace start to the latest known event. */
+    knownDurationMs: number;
+}
+export declare function buildTrace(run: WorkflowRun, events: Event[], now: Date): TraceWithMeta;
+//# sourceMappingURL=trace-builder.d.ts.map

package/dist/lib/trace-builder.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"trace-builder.d.ts","sourceRoot":"","sources":["../../src/lib/trace-builder.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kCAAkC,CAAC;AAc7D,eAAO,MAAM,WAAW,GAAI,WAAW,MAAM,YAAkC,CAAC;AAEhF,eAAO,MAAM,YAAY,GAAI,WAAW,MAAM,mDACkB,CAAC;AAEjE,eAAO,MAAM,oBAAoB,GAAI,WAAW,MAAM,oEAGvB,CAAC;AAMhC,MAAM,MAAM,aAAa,GAAG;IAC1B,cAAc,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC;IACrC,cAAc,EAAE,KAAK,EAAE,CAAC;IACxB,WAAW,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC;IAClC,UAAU,EAAE,GAAG,CAAC,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC;CAClC,CAAC;AAeF,wBAAgB,wBAAwB,CAAC,MAAM,EAAE,KAAK,EAAE,GAAG,aAAa,CAgCvE;AAqED,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,SAAS,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;KAAE,EAAE,CAAC;IAClE,iEAAiE;IACjE,eAAe,EAAE,MAAM,CAAC;CACzB;AAED,wBAAgB,UAAU,CACxB,GAAG,EAAE,WAAW,EAChB,MAAM,EAAE,KAAK,EAAE,EACf,GAAG,EAAE,IAAI,GACR,aAAa,CA6Bf"}

package/dist/lib/trace-builder.js

@@ -0,0 +1,129 @@
+/**
+ * Builds a complete trace from a WorkflowRun and its Events.
+ *
+ * This module groups raw events by correlation ID and entity type,
+ * converts each group into an OpenTelemetry-style Span, and returns
+ * a fully-formed Trace ready for the trace viewer.
+ */
+import { hookToSpan, runToSpan, stepToSpan, waitToSpan, WORKFLOW_LIBRARY, } from '../components/workflow-traces/trace-span-construction';
+import { otelTimeToMs } from '../components/workflow-traces/trace-time-utils';
+// ---------------------------------------------------------------------------
+// Event type classifiers
+// ---------------------------------------------------------------------------
+export const isStepEvent = (eventType) => eventType.startsWith('step_');
+export const isTimerEvent = (eventType) => eventType === 'wait_created' || eventType === 'wait_completed';
+export const isHookLifecycleEvent = (eventType) => eventType === 'hook_received' ||
+    eventType === 'hook_created' ||
+    eventType === 'hook_disposed';
+function pushEvent(map, correlationId, event) {
+    const existing = map.get(correlationId);
+    if (existing) {
+        existing.push(event);
+        return;
+    }
+    map.set(correlationId, [event]);
+}
+export function groupEventsByCorrelation(events) {
+    const eventsByStepId = new Map();
+    const runLevelEvents = [];
+    const timerEvents = new Map();
+    const hookEvents = new Map();
+    for (const event of events) {
+        const correlationId = event.correlationId;
+        if (!correlationId) {
+            runLevelEvents.push(event);
+            continue;
+        }
+        if (isTimerEvent(event.eventType)) {
+            pushEvent(timerEvents, correlationId, event);
+            continue;
+        }
+        if (isHookLifecycleEvent(event.eventType)) {
+            pushEvent(hookEvents, correlationId, event);
+            continue;
+        }
+        if (isStepEvent(event.eventType)) {
+            pushEvent(eventsByStepId, correlationId, event);
+            continue;
+        }
+        runLevelEvents.push(event);
+    }
+    return { eventsByStepId, runLevelEvents, timerEvents, hookEvents };
+}
+// ---------------------------------------------------------------------------
+// Trace construction
+// ---------------------------------------------------------------------------
+/**
+ * Computes the latest known event time from the events list.
+ * Active (in-progress) child spans are capped at this time instead of `now`,
+ * so they only extend as far as our data goes.
+ */
+function computeLatestKnownTime(events, run) {
+    let latest = new Date(run.createdAt).getTime();
+    for (const event of events) {
+        const t = new Date(event.createdAt).getTime();
+        if (t > latest)
+            latest = t;
+    }
+    return new Date(latest);
+}
+function buildSpans(run, groupedEvents, now, latestKnownTime) {
+    // Active child spans cap at latestKnownTime so they don't extend into
+    // unknown territory. Even when the run is completed, we may not have loaded
+    // all events yet, so always use the latest event we've actually seen.
+    const childMaxEnd = latestKnownTime;
+    const stepSpans = Array.from(groupedEvents.eventsByStepId.values())
+        .map((events) => stepToSpan(events, childMaxEnd))
+        .filter((span) => span !== null);
+    const hookSpans = Array.from(groupedEvents.hookEvents.values())
+        .map((events) => hookToSpan(events, childMaxEnd))
+        .filter((span) => span !== null);
+    const waitSpans = Array.from(groupedEvents.timerEvents.values())
+        .map((events) => waitToSpan(events, childMaxEnd))
+        .filter((span) => span !== null);
+    return {
+        runSpan: runToSpan(run, groupedEvents.runLevelEvents, now),
+        spans: [...stepSpans, ...hookSpans, ...waitSpans],
+    };
+}
+function cascadeSpans(runSpan, spans) {
+    const sortedSpans = [
+        runSpan,
+        ...spans.slice().sort((a, b) => {
+            const aStart = otelTimeToMs(a.startTime);
+            const bStart = otelTimeToMs(b.startTime);
+            return aStart - bStart;
+        }),
+    ];
+    return sortedSpans.map((span, index) => {
+        const parentSpanId = index === 0 ? undefined : String(sortedSpans[index - 1].spanId);
+        return {
+            ...span,
+            parentSpanId,
+        };
+    });
+}
+export function buildTrace(run, events, now) {
+    const groupedEvents = groupEventsByCorrelation(events);
+    const latestKnownTime = computeLatestKnownTime(events, run);
+    const { runSpan, spans } = buildSpans(run, groupedEvents, now, latestKnownTime);
+    const sortedCascadingSpans = cascadeSpans(runSpan, spans);
+    // Compute known duration relative to trace start
+    const traceStartMs = otelTimeToMs(runSpan.startTime);
+    const knownDurationMs = latestKnownTime.getTime() - traceStartMs;
+    return {
+        traceId: run.runId,
+        rootSpanId: run.runId,
+        spans: sortedCascadingSpans,
+        resources: [
+            {
+                name: 'workflow',
+                attributes: {
+                    'service.name': WORKFLOW_LIBRARY.name,
+                },
+            },
+        ],
+        knownDurationMs: Math.max(0, knownDurationMs),
+    };
+}
+//# sourceMappingURL=trace-builder.js.map

package/dist/lib/trace-builder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"trace-builder.js","sourceRoot":"","sources":["../../src/lib/trace-builder.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@workflow/web-shared",
   "description": "Shared components for Workflow Observability UI",
-  "version": "4.1.0-beta.61",
+  "version": "4.1.0-beta.63",
   "private": false,
   "files": [
     "dist",
@@ -52,9 +52,9 @@
     "streamdown": "2.3.0",
     "tailwind-merge": "3.5.0",
     "tailwindcss": "4",
-    "@workflow/core": "4.2.0-beta.66",
+    "@workflow/core": "4.2.0-beta.68",
     "@workflow/utils": "4.1.0-beta.13",
-    "@workflow/world": "4.1.0-beta.10"
+    "@workflow/world": "4.1.0-beta.11"
   },
   "devDependencies": {
     "@biomejs/biome": "^2.4.4",

package/src/components/event-list-view.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { parseStepName, parseWorkflowName } from '@workflow/utils/parse-name';
-import type { Event, Step, WorkflowRun } from '@workflow/world';
+import type { Event, WorkflowRun } from '@workflow/world';
 import { Check, ChevronRight, Copy } from 'lucide-react';
 import type { MouseEvent as ReactMouseEvent, ReactNode } from 'react';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
@@ -103,11 +103,11 @@ function getStatusDotColor(eventType: string): string {
 }
 
 /**
- * Build a map from correlationId (stepId) → display name using step entities,
- * and parse the workflow name from the run.
+ * Build a map from correlationId (stepId) → display name using step_created
+ * events, and parse the workflow name from the run.
  */
 function buildNameMaps(
-  steps: Step[] | null,
+  events: Event[] | null,
   run: WorkflowRun | null
 ): {
   correlationNameMap: Map<string, string>;
@@ -115,11 +115,17 @@ function buildNameMaps(
 } {
   const correlationNameMap = new Map<string, string>();
 
-  // Map step correlationId (= stepId) → parsed step name
-  if (steps) {
-    for (const step of steps) {
-      const parsed = parseStepName(String(step.stepName));
-      correlationNameMap.set(step.stepId, parsed?.shortName ?? step.stepName);
+  // Map step correlationId (= stepId) → parsed step name from step_created events
+  if (events) {
+    for (const event of events) {
+      if (event.eventType === 'step_created' && event.correlationId) {
+        const stepName = event.eventData?.stepName ?? '';
+        const parsed = parseStepName(String(stepName));
+        correlationNameMap.set(
+          event.correlationId,
+          parsed?.shortName ?? stepName
+        );
+      }
     }
   }
 
@@ -583,7 +589,6 @@ function PayloadBlock({
 
 interface EventsListProps {
   events: Event[] | null;
-  steps?: Step[] | null;
   run?: WorkflowRun | null;
   onLoadEventData?: (event: Event) => Promise<unknown | null>;
   hasMoreEvents?: boolean;
@@ -960,7 +965,6 @@ function EventRow({
 
 export function EventListView({
   events,
-  steps,
   run,
   onLoadEventData,
   hasMoreEvents = false,
@@ -977,8 +981,8 @@ export function EventListView({
   }, [events]);
 
   const { correlationNameMap, workflowName } = useMemo(
-    () => buildNameMaps(steps ?? null, run ?? null),
-    [steps, run]
+    () => buildNameMaps(events ?? null, run ?? null),
+    [events, run]
   );
 
   const durationMap = useMemo(

package/src/components/run-trace-view.tsx

@@ -7,8 +7,6 @@ import { WorkflowTraceViewer } from './workflow-trace-view';
 
 interface RunTraceViewProps {
   run: WorkflowRun;
-  steps: Step[];
-  hooks: Hook[];
   events: Event[];
   isLoading?: boolean;
   error?: Error | null;
@@ -34,8 +32,6 @@ interface RunTraceViewProps {
 
 export function RunTraceView({
   run,
-  steps,
-  hooks,
   events,
   isLoading,
   error,
@@ -65,9 +61,7 @@ export function RunTraceView({
     <div className="w-full h-full relative">
       <WorkflowTraceViewer
         error={error}
-        steps={steps}
         events={events}
-        hooks={hooks}
         run={run}
         isLoading={isLoading}
         spanDetailData={spanDetailData}

package/src/components/sidebar/attribute-panel.tsx

@@ -215,7 +215,10 @@ type AttributeKey =
   | 'eventData'
   | 'resumeAt'
   | 'expiredAt'
-  | 'workflowCoreVersion';
+  | 'workflowCoreVersion'
+  | 'receivedCount'
+  | 'lastReceivedAt'
+  | 'disposedAt';
 
 const attributeOrder: AttributeKey[] = [
   'workflowName',
@@ -228,6 +231,9 @@ const attributeOrder: AttributeKey[] = [
   'runId',
   'attempt',
   'token',
+  'receivedCount',
+  'lastReceivedAt',
+  'disposedAt',
   'correlationId',
   'eventType',
   'deploymentId',
@@ -262,6 +268,7 @@ const sortByAttributeOrder = (a: string, b: string): number => {
  */
 const attributeDisplayNames: Partial<Record<AttributeKey, string>> = {
   workflowCoreVersion: '@workflow/core version',
+  receivedCount: 'times resolved',
 };
 
 /**
@@ -353,6 +360,9 @@ const attributeToDisplayFn: Record<
   // Hook details
   token: (value: unknown) => String(value),
   isWebhook: (value: unknown) => String(value),
+  receivedCount: (value: unknown) => String(value),
+  lastReceivedAt: localMillisecondTimeOrNull,
+  disposedAt: localMillisecondTimeOrNull,
   // Event details
   eventType: (value: unknown) => String(value),
   correlationId: (value: unknown) => String(value),
@@ -773,13 +783,18 @@ export const AttributePanel = ({
                 typeof displayValue === 'string'
                   ? displayValue
                   : String(displayValue ?? displayData.moduleSpecifier ?? '');
+              const shouldCapitalizeLabel = attribute !== 'workflowCoreVersion';
               const showDivider = index < orderedBasicAttributes.length - 1;
 
               return (
                 <div key={attribute} className="py-1">
                   <div className="flex min-h-[32px] items-center justify-between gap-4 rounded-sm px-2.5 py-1">
                     <span
-                      className="text-[14px] first-letter:uppercase"
+                      className={
+                        shouldCapitalizeLabel
+                          ? 'text-[14px] first-letter:uppercase'
+                          : 'text-[14px]'
+                      }
                       style={{ color: 'var(--ds-gray-700)' }}
                     >
                       {getAttributeDisplayName(attribute)}

package/src/components/sidebar/detail-card.tsx

@@ -1,3 +1,4 @@
+import { ChevronRight } from 'lucide-react';
 import type { ReactNode } from 'react';
 
 export function DetailCard({
@@ -42,14 +43,21 @@ export function DetailCard({
       onToggle={(e) => onToggle?.((e.target as HTMLDetailsElement).open)}
     >
       <summary
-        className={`cursor-pointer rounded-md border px-2.5 py-1.5 text-xs hover:brightness-95 ${summaryClassName ?? ''}`}
+        className={`cursor-pointer rounded-md border px-2.5 py-1.5 text-xs hover:brightness-95 [&::-webkit-details-marker]:hidden ${summaryClassName ?? ''}`}
         style={{
           borderColor: 'var(--ds-gray-300)',
           backgroundColor: 'var(--ds-gray-100)',
           color: 'var(--ds-gray-900)',
+          listStyle: 'none',
         }}
       >
-        {summary}
+        <span className="flex items-center gap-1.5">
+          <ChevronRight
+            size={14}
+            className="shrink-0 transition-transform group-open:rotate-90"
+          />
+          {summary}
+        </span>
       </summary>
       {/* Expanded content with connecting line */}
       <div className={`relative pl-6 mt-3 ${contentClassName ?? ''}`}>