@workflow/web-shared 5.0.0-beta.43 → 5.0.0-beta.44

package/dist/lib/zstd-browser-decoder.js

@@ -8,7 +8,7 @@
  *
  * The package leaves WASM sourcing to the caller; we resolve the shipped
  * `zstd.wasm` as a bundler asset (`new URL(..., import.meta.url)`, the same
- * pattern the trace-viewer Worker uses) and compile it once, lazily — the
+ * pattern the trace-viewer Worker uses) and compile it once, lazily: the
  * WASM is fetched only the first time a zstd payload is actually decoded.
  */
 import { registerZstdDecoder } from '@workflow/core/serialization-format';
@@ -38,4 +38,4 @@ export function ensureZstdDecoderRegistered() {
         return decompressBytes(wasmModule, payload);
     });
 }
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoienN0ZC1icm93c2VyLWRlY29kZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvbGliL3pzdGQtYnJvd3Nlci1kZWNvZGVyLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7Ozs7Ozs7Ozs7R0FZRztBQUNILE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLHFDQUFxQyxDQUFDO0FBRTFFLElBQUksVUFBVSxHQUFHLEtBQUssQ0FBQztBQUN2QixJQUFJLGFBQXNELENBQUM7QUFFM0QsU0FBUyxjQUFjO0lBQ3JCLElBQUksQ0FBQyxhQUFhLEVBQUUsQ0FBQztRQUNuQixNQUFNLEdBQUcsR0FBRyxJQUFJLEdBQUcsQ0FBQyxrQ0FBa0MsRUFBRSxNQUFNLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO1FBQ3pFLGFBQWEsR0FBRyxLQUFLLENBQUMsR0FBRyxDQUFDO2FBQ3ZCLElBQUksQ0FBQyxDQUFDLEdBQUcsRUFBRSxFQUFFLENBQUMsR0FBRyxDQUFDLFdBQVcsRUFBRSxDQUFDO2FBQ2hDLElBQUksQ0FBQyxDQUFDLEtBQUssRUFBRSxFQUFFLENBQUMsV0FBVyxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDO0lBQ2pELENBQUM7SUFDRCxPQUFPLGFBQWEsQ0FBQztBQUN2QixDQUFDO0FBRUQ7Ozs7R0FJRztBQUNILE1BQU0sVUFBVSwyQkFBMkI7SUFDekMsSUFBSSxVQUFVO1FBQUUsT0FBTztJQUN2QixVQUFVLEdBQUcsSUFBSSxDQUFDO0lBQ2xCLG1CQUFtQixDQUFDLEtBQUssRUFBRSxPQUFPLEVBQUUsRUFBRTtRQUNwQyxNQUFNLEVBQUUsZUFBZSxFQUFFLEdBQUcsTUFBTSxNQUFNLENBQUMsd0JBQXdCLENBQUMsQ0FBQztRQUNuRSxNQUFNLFVBQVUsR0FBRyxNQUFNLGNBQWMsRUFBRSxDQUFDO1FBQzFDLE9BQU8sZUFBZSxDQUFDLFVBQVUsRUFBRSxPQUFPLENBQUMsQ0FBQztJQUM5QyxDQUFDLENBQUMsQ0FBQztBQUNMLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEJyb3dzZXIgenN0ZCBkZWNvZGVyIGZvciB0aGUgbzExeSByZWFkIHBhdGguXG4gKlxuICogVGhlIFdlYiBgRGVjb21wcmVzc2lvblN0cmVhbWAgaGFzIG5vIHpzdGQgc3VwcG9ydCwgc28gYEB3b3JrZmxvdy9jb3JlYCdzXG4gKiBgaHlkcmF0ZURhdGFXaXRoS2V5YCBkZWxlZ2F0ZXMgenN0ZCBpbmZsYXRpb24gdG8gYSBkZWNvZGVyIHJlZ2lzdGVyZWQgdmlhXG4gKiBgcmVnaXN0ZXJac3RkRGVjb2RlcmAuIFRoaXMgbW9kdWxlIHN1cHBsaWVzIHRoYXQgZGVjb2RlciwgYmFja2VkIGJ5IHRoZVxuICogYEB0b290YWxsbmF0ZS96c3RkLXdhc21gIHNpbmdsZS1maWxlIFdBU00gZGVjb2Rlci5cbiAqXG4gKiBUaGUgcGFja2FnZSBsZWF2ZXMgV0FTTSBzb3VyY2luZyB0byB0aGUgY2FsbGVyOyB3ZSByZXNvbHZlIHRoZSBzaGlwcGVkXG4gKiBgenN0ZC53YXNtYCBhcyBhIGJ1bmRsZXIgYXNzZXQgKGBuZXcgVVJMKC4uLiwgaW1wb3J0Lm1ldGEudXJsKWAsIHRoZSBzYW1lXG4gKiBwYXR0ZXJuIHRoZSB0cmFjZS12aWV3ZXIgV29ya2VyIHVzZXMpIGFuZCBjb21waWxlIGl0IG9uY2UsIGxhemlseSDigJQgdGhlXG4gKiBXQVNNIGlzIGZldGNoZWQgb25seSB0aGUgZmlyc3QgdGltZSBhIHpzdGQgcGF5bG9hZCBpcyBhY3R1YWxseSBkZWNvZGVkLlxuICovXG5pbXBvcnQgeyByZWdpc3RlclpzdGREZWNvZGVyIH0gZnJvbSAnQHdvcmtmbG93L2NvcmUvc2VyaWFsaXphdGlvbi1mb3JtYXQnO1xuXG5sZXQgcmVnaXN0ZXJlZCA9IGZhbHNlO1xubGV0IG1vZHVsZVByb21pc2U6IFByb21pc2U8V2ViQXNzZW1ibHkuTW9kdWxlPiB8IHVuZGVmaW5lZDtcblxuZnVuY3Rpb24gbG9hZFdhc21Nb2R1bGUoKTogUHJvbWlzZTxXZWJBc3NlbWJseS5Nb2R1bGU+IHtcbiAgaWYgKCFtb2R1bGVQcm9taXNlKSB7XG4gICAgY29uc3QgdXJsID0gbmV3IFVSTCgnQHRvb3RhbGxuYXRlL3pzdGQtd2FzbS96c3RkLndhc20nLCBpbXBvcnQubWV0YS51cmwpO1xuICAgIG1vZHVsZVByb21pc2UgPSBmZXRjaCh1cmwpXG4gICAgICAudGhlbigocmVzKSA9PiByZXMuYXJyYXlCdWZmZXIoKSlcbiAgICAgIC50aGVuKChieXRlcykgPT4gV2ViQXNzZW1ibHkuY29tcGlsZShieXRlcykpO1xuICB9XG4gIHJldHVybiBtb2R1bGVQcm9taXNlO1xufVxuXG4vKipcbiAqIFJlZ2lzdGVyIHRoZSBicm93c2VyIHpzdGQgZGVjb2RlciB3aXRoIGBAd29ya2Zsb3cvY29yZWAgKGlkZW1wb3RlbnQpLlxuICogQ2FsbCB0aGlzIGJlZm9yZSBoeWRyYXRpbmcgcGF5bG9hZHMgdGhhdCBtYXkgYmUgenN0ZC1jb21wcmVzc2VkOyB0aGVcbiAqIGFjdHVhbCBXQVNNIGNvbXBpbGUgKyBkZWNvZGUgaGFwcGVucyBsYXppbHkgb24gZmlyc3QgdXNlLlxuICovXG5leHBvcnQgZnVuY3Rpb24gZW5zdXJlWnN0ZERlY29kZXJSZWdpc3RlcmVkKCk6IHZvaWQge1xuICBpZiAocmVnaXN0ZXJlZCkgcmV0dXJuO1xuICByZWdpc3RlcmVkID0gdHJ1ZTtcbiAgcmVnaXN0ZXJac3RkRGVjb2Rlcihhc3luYyAocGF5bG9hZCkgPT4ge1xuICAgIGNvbnN0IHsgZGVjb21wcmVzc0J5dGVzIH0gPSBhd2FpdCBpbXBvcnQoJ0B0b290YWxsbmF0ZS96c3RkLXdhc20nKTtcbiAgICBjb25zdCB3YXNtTW9kdWxlID0gYXdhaXQgbG9hZFdhc21Nb2R1bGUoKTtcbiAgICByZXR1cm4gZGVjb21wcmVzc0J5dGVzKHdhc21Nb2R1bGUsIHBheWxvYWQpO1xuICB9KTtcbn1cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoienN0ZC1icm93c2VyLWRlY29kZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvbGliL3pzdGQtYnJvd3Nlci1kZWNvZGVyLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7Ozs7Ozs7Ozs7R0FZRztBQUNILE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLHFDQUFxQyxDQUFDO0FBRTFFLElBQUksVUFBVSxHQUFHLEtBQUssQ0FBQztBQUN2QixJQUFJLGFBQXNELENBQUM7QUFFM0QsU0FBUyxjQUFjO0lBQ3JCLElBQUksQ0FBQyxhQUFhLEVBQUUsQ0FBQztRQUNuQixNQUFNLEdBQUcsR0FBRyxJQUFJLEdBQUcsQ0FBQyxrQ0FBa0MsRUFBRSxNQUFNLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO1FBQ3pFLGFBQWEsR0FBRyxLQUFLLENBQUMsR0FBRyxDQUFDO2FBQ3ZCLElBQUksQ0FBQyxDQUFDLEdBQUcsRUFBRSxFQUFFLENBQUMsR0FBRyxDQUFDLFdBQVcsRUFBRSxDQUFDO2FBQ2hDLElBQUksQ0FBQyxDQUFDLEtBQUssRUFBRSxFQUFFLENBQUMsV0FBVyxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDO0lBQ2pELENBQUM7SUFDRCxPQUFPLGFBQWEsQ0FBQztBQUN2QixDQUFDO0FBRUQ7Ozs7R0FJRztBQUNILE1BQU0sVUFBVSwyQkFBMkI7SUFDekMsSUFBSSxVQUFVO1FBQUUsT0FBTztJQUN2QixVQUFVLEdBQUcsSUFBSSxDQUFDO0lBQ2xCLG1CQUFtQixDQUFDLEtBQUssRUFBRSxPQUFPLEVBQUUsRUFBRTtRQUNwQyxNQUFNLEVBQUUsZUFBZSxFQUFFLEdBQUcsTUFBTSxNQUFNLENBQUMsd0JBQXdCLENBQUMsQ0FBQztRQUNuRSxNQUFNLFVBQVUsR0FBRyxNQUFNLGNBQWMsRUFBRSxDQUFDO1FBQzFDLE9BQU8sZUFBZSxDQUFDLFVBQVUsRUFBRSxPQUFPLENBQUMsQ0FBQztJQUM5QyxDQUFDLENBQUMsQ0FBQztBQUNMLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEJyb3dzZXIgenN0ZCBkZWNvZGVyIGZvciB0aGUgbzExeSByZWFkIHBhdGguXG4gKlxuICogVGhlIFdlYiBgRGVjb21wcmVzc2lvblN0cmVhbWAgaGFzIG5vIHpzdGQgc3VwcG9ydCwgc28gYEB3b3JrZmxvdy9jb3JlYCdzXG4gKiBgaHlkcmF0ZURhdGFXaXRoS2V5YCBkZWxlZ2F0ZXMgenN0ZCBpbmZsYXRpb24gdG8gYSBkZWNvZGVyIHJlZ2lzdGVyZWQgdmlhXG4gKiBgcmVnaXN0ZXJac3RkRGVjb2RlcmAuIFRoaXMgbW9kdWxlIHN1cHBsaWVzIHRoYXQgZGVjb2RlciwgYmFja2VkIGJ5IHRoZVxuICogYEB0b290YWxsbmF0ZS96c3RkLXdhc21gIHNpbmdsZS1maWxlIFdBU00gZGVjb2Rlci5cbiAqXG4gKiBUaGUgcGFja2FnZSBsZWF2ZXMgV0FTTSBzb3VyY2luZyB0byB0aGUgY2FsbGVyOyB3ZSByZXNvbHZlIHRoZSBzaGlwcGVkXG4gKiBgenN0ZC53YXNtYCBhcyBhIGJ1bmRsZXIgYXNzZXQgKGBuZXcgVVJMKC4uLiwgaW1wb3J0Lm1ldGEudXJsKWAsIHRoZSBzYW1lXG4gKiBwYXR0ZXJuIHRoZSB0cmFjZS12aWV3ZXIgV29ya2VyIHVzZXMpIGFuZCBjb21waWxlIGl0IG9uY2UsIGxhemlseTogdGhlXG4gKiBXQVNNIGlzIGZldGNoZWQgb25seSB0aGUgZmlyc3QgdGltZSBhIHpzdGQgcGF5bG9hZCBpcyBhY3R1YWxseSBkZWNvZGVkLlxuICovXG5pbXBvcnQgeyByZWdpc3RlclpzdGREZWNvZGVyIH0gZnJvbSAnQHdvcmtmbG93L2NvcmUvc2VyaWFsaXphdGlvbi1mb3JtYXQnO1xuXG5sZXQgcmVnaXN0ZXJlZCA9IGZhbHNlO1xubGV0IG1vZHVsZVByb21pc2U6IFByb21pc2U8V2ViQXNzZW1ibHkuTW9kdWxlPiB8IHVuZGVmaW5lZDtcblxuZnVuY3Rpb24gbG9hZFdhc21Nb2R1bGUoKTogUHJvbWlzZTxXZWJBc3NlbWJseS5Nb2R1bGU+IHtcbiAgaWYgKCFtb2R1bGVQcm9taXNlKSB7XG4gICAgY29uc3QgdXJsID0gbmV3IFVSTCgnQHRvb3RhbGxuYXRlL3pzdGQtd2FzbS96c3RkLndhc20nLCBpbXBvcnQubWV0YS51cmwpO1xuICAgIG1vZHVsZVByb21pc2UgPSBmZXRjaCh1cmwpXG4gICAgICAudGhlbigocmVzKSA9PiByZXMuYXJyYXlCdWZmZXIoKSlcbiAgICAgIC50aGVuKChieXRlcykgPT4gV2ViQXNzZW1ibHkuY29tcGlsZShieXRlcykpO1xuICB9XG4gIHJldHVybiBtb2R1bGVQcm9taXNlO1xufVxuXG4vKipcbiAqIFJlZ2lzdGVyIHRoZSBicm93c2VyIHpzdGQgZGVjb2RlciB3aXRoIGBAd29ya2Zsb3cvY29yZWAgKGlkZW1wb3RlbnQpLlxuICogQ2FsbCB0aGlzIGJlZm9yZSBoeWRyYXRpbmcgcGF5bG9hZHMgdGhhdCBtYXkgYmUgenN0ZC1jb21wcmVzc2VkOyB0aGVcbiAqIGFjdHVhbCBXQVNNIGNvbXBpbGUgKyBkZWNvZGUgaGFwcGVucyBsYXppbHkgb24gZmlyc3QgdXNlLlxuICovXG5leHBvcnQgZnVuY3Rpb24gZW5zdXJlWnN0ZERlY29kZXJSZWdpc3RlcmVkKCk6IHZvaWQge1xuICBpZiAocmVnaXN0ZXJlZCkgcmV0dXJuO1xuICByZWdpc3RlcmVkID0gdHJ1ZTtcbiAgcmVnaXN0ZXJac3RkRGVjb2Rlcihhc3luYyAocGF5bG9hZCkgPT4ge1xuICAgIGNvbnN0IHsgZGVjb21wcmVzc0J5dGVzIH0gPSBhd2FpdCBpbXBvcnQoJ0B0b290YWxsbmF0ZS96c3RkLXdhc20nKTtcbiAgICBjb25zdCB3YXNtTW9kdWxlID0gYXdhaXQgbG9hZFdhc21Nb2R1bGUoKTtcbiAgICByZXR1cm4gZGVjb21wcmVzc0J5dGVzKHdhc21Nb2R1bGUsIHBheWxvYWQpO1xuICB9KTtcbn1cbiJdfQ==

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@workflow/web-shared",
   "description": "Shared components for Workflow Observability UI",
-  "version": "5.0.0-beta.43",
+  "version": "5.0.0-beta.44",
   "private": false,
   "files": [
     "dist",
@@ -55,9 +55,9 @@
     "streamdown": "2.3.0",
     "tailwind-merge": "3.5.0",
     "tailwindcss": "4",
-    "@workflow/core": "5.0.0-beta.43",
-    "@workflow/utils": "5.0.0-beta.8",
-    "@workflow/world": "5.0.0-beta.28"
+    "@workflow/core": "5.0.0-beta.44",
+    "@workflow/utils": "5.0.0-beta.9",
+    "@workflow/world": "5.0.0-beta.29"
   },
   "devDependencies": {
     "@biomejs/biome": "^2.4.4",
@@ -67,7 +67,7 @@
     "ai": "6.0.116",
     "typescript": "^6.0.3",
     "vitest": "^4.1.10",
-    "@workflow/errors": "5.0.0-beta.17",
+    "@workflow/errors": "5.0.0-beta.18",
     "@workflow/tsconfig": "5.0.0-beta.0"
   },
   "scripts": {

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

@@ -10,7 +10,10 @@ import type {
 } from 'react';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { Virtuoso, type VirtuosoHandle } from 'react-virtuoso';
-import { findDuplicateEventIds } from '../lib/duplicate-events';
+import {
+  DUPLICATE_EVENT_MESSAGE,
+  findDuplicateEventIds,
+} from '../lib/duplicate-events';
 import {
   type ExactIdSearchResult,
   type ExactWorkflowSearchIdKind,
@@ -18,13 +21,14 @@ import {
   parseExactWorkflowSearchId,
 } from '../lib/exact-event-search-id';
 import { isEncryptedMarker } from '../lib/hydration';
+import { isSealedNoopEvent, SEALED_EVENT_MESSAGE } from '../lib/sealed-events';
 import { useToast } from '../lib/toast';
 import { formatDuration } from '../lib/utils';
 import { AttrSetEventBlock } from './sidebar/attributes-block';
 import { ContextCardProvider } from './ui/context-card';
 import { DataInspector, DecryptClickContext } from './ui/data-inspector';
 import { DecryptButton } from './ui/decrypt-button';
-import { DuplicateEventTooltip } from './ui/duplicate-event-tooltip';
+import { EventNoticeTooltip } from './ui/duplicate-event-tooltip';
 import {
   ErrorStackBlock,
   isStructuredError,
@@ -142,6 +146,11 @@ function getStatusDotColor(eventType: string): string {
   ) {
     return 'var(--ds-blue-700)';
   }
+  // Sealed positions → dim gray, one step quieter than pending: the row is
+  // log filler the run never observed.
+  if (eventType === 'noop') {
+    return 'var(--ds-gray-500)';
+  }
   // Created/pending → gray
   return 'var(--ds-gray-600)';
 }
@@ -150,7 +159,7 @@ function getStatusDotColor(eventType: string): string {
  * Build a map from correlationId (stepId) → display name using step_created
  * events, and parse the workflow name from the run.
  */
-function buildNameMaps(
+export function buildNameMaps(
   events: Event[] | null,
   run: WorkflowRun | null
 ): {
@@ -164,7 +173,9 @@ function buildNameMaps(
     for (const event of events) {
       if (event.eventType === 'step_created' && event.correlationId) {
         const stepName = event.eventData?.stepName ?? '';
-        const parsed = parseStepName(String(stepName));
+        const parsed =
+          parseStepName(String(stepName)) ??
+          parseWorkflowName(String(stepName));
         correlationNameMap.set(
           event.correlationId,
           parsed?.shortName ?? stepName
@@ -235,7 +246,7 @@ export function buildDurationMap(
       type === 'workflow_started'
     ) {
       startedTimes.set(key, ts);
-      // The queued duration is anchored on the first start event only —
+      // The queued duration is anchored on the first start event only, since
       // subsequent step_started events come from retries.
       if (!firstStartedTimes.has(key)) {
         firstStartedTimes.set(key, ts);
@@ -295,14 +306,15 @@ function isRunLevel(eventType: string): boolean {
     eventType === 'workflow_started' ||
     eventType === 'workflow_completed' ||
     eventType === 'workflow_failed' ||
-    // attr_set carries a dedup correlationId rather than a child entity ID,
-    // so it groups and labels with the run itself.
-    eventType === 'attr_set'
+    // attr_set and noop carry a dedup/positional correlationId rather than a
+    // child entity ID, so they group and label with the run itself.
+    eventType === 'attr_set' ||
+    eventType === 'noop'
   );
 }
 
 // ──────────────────────────────────────────────────────────────────────────
-// Tree gutter — fixed-width, shows branch lines only for the selected group
+// Tree gutter: fixed-width, shows branch lines only for the selected group
 // ──────────────────────────────────────────────────────────────────────────
 
 /** Fixed gutter width: 20px root area + 16px for one branch lane */
@@ -453,7 +465,7 @@ function TreeGutter({
 }
 
 // ──────────────────────────────────────────────────────────────────────────
-// Copyable cell — shows a copy button on hover
+// Copyable cell: shows a copy button on hover
 // ──────────────────────────────────────────────────────────────────────────
 
 function CopyableCell({
@@ -545,7 +557,7 @@ function deepParseJson(value: unknown): unknown {
   }
   if (value !== null && typeof value === 'object') {
     // Preserve objects with custom constructors (e.g., encrypted markers,
-    // class instance refs) — don't destructure them into plain objects
+    // class instance refs); don't destructure them into plain objects
     if (value.constructor !== Object) {
       return value;
     }
@@ -633,13 +645,13 @@ function PayloadBlock({
     );
   }
 
-  // Attribute changes — render the changed keys and the writer instead of
+  // Attribute changes: render the changed keys and the writer instead of
   // the raw JSON payload.
   if (eventType === 'attr_set') {
     return <AttrSetEventBlock data={cleaned} />;
   }
 
-  // Cancellation reason — render the free-text reason as a readable line
+  // Cancellation reason: render the free-text reason as a readable line
   // instead of a raw JSON payload (the only field run_cancelled carries).
   if (eventType === 'run_cancelled') {
     const cancelReason =
@@ -809,6 +821,10 @@ interface EventsListProps {
   onDecrypt?: () => void;
   /** Whether the encryption key is currently being fetched. */
   isDecrypting?: boolean;
+  /** Whether decryption is unavailable. */
+  isDecryptDisabled?: boolean;
+  /** Explains why decryption is unavailable. */
+  decryptDisabledReason?: string;
   /** Run-level hint: the run contains encrypted data (from probe). */
   hasEncryptedData?: boolean;
   /** Fetch events for an exact correlation or event ID. */
@@ -896,6 +912,12 @@ export function EventRow({
     ? '__run__'
     : (event.correlationId ?? undefined);
 
+  const isSealed = isSealedNoopEvent(event);
+  const rowNotice = isDuplicate
+    ? DUPLICATE_EVENT_MESSAGE
+    : isSealed
+      ? SEALED_EVENT_MESSAGE
+      : undefined;
   const statusDotColor = getStatusDotColor(event.eventType);
   const createdAt = new Date(event.createdAt);
   const occurredAt = parseEventDate(event.occurredAt);
@@ -1061,7 +1083,7 @@ export function EventRow({
           isLaneEnd={isLaneEnd}
         />
 
-        {/* Content area — dims when unrelated */}
+        {/* Content area: dims when unrelated */}
         <div
           className="flex items-center flex-1 min-w-0"
           style={{ opacity: contentOpacity, transition: 'opacity 150ms' }}
@@ -1109,11 +1131,11 @@ export function EventRow({
 
           {/* Event Type */}
           <div className="font-medium min-w-0 px-4" style={{ flex: '2 1 0%' }}>
-            <DuplicateEventTooltip isDuplicate={isDuplicate}>
+            <EventNoticeTooltip notice={rowNotice}>
               <span
                 className="inline-flex items-center gap-1.5"
                 style={{
-                  color: isDuplicate
+                  color: rowNotice
                     ? 'var(--ds-gray-700)'
                     : 'var(--ds-gray-900)',
                 }}
@@ -1151,7 +1173,7 @@ export function EventRow({
                 </span>
                 {formatEventType(event.eventType)}
               </span>
-            </DuplicateEventTooltip>
+            </EventNoticeTooltip>
           </div>
 
           {/* Name */}
@@ -1179,10 +1201,10 @@ export function EventRow({
         </div>
       </div>
 
-      {/* Expanded details — tree lines continue through this area */}
+      {/* Expanded details: tree lines continue through this area */}
       {isExpanded && (
         <div className="flex">
-          {/* Continuation gutter — lane line continues if not at lane end */}
+          {/* Continuation gutter: lane line continues if not at lane end */}
           <TreeGutter
             isFirst={false}
             isLast={isLast}
@@ -1286,6 +1308,8 @@ function EventListViewInner({
   onSortOrderChange,
   onDecrypt,
   isDecrypting = false,
+  isDecryptDisabled = false,
+  decryptDisabledReason,
   hasEncryptedData: hasEncryptedDataProp = false,
   onExactIdSearch,
   showSeparateEventOccurrenceTimestamps = false,
@@ -1414,7 +1438,7 @@ function EventListViewInner({
     });
   }, []);
 
-  // Event data cache — ref avoids re-renders when cache updates
+  // Event data cache: ref avoids re-renders when cache updates
   const eventDataCacheRef = useRef<Map<string, unknown>>(new Map());
   const cacheEventData = useCallback((eventId: string, data: unknown) => {
     eventDataCacheRef.current.set(eventId, data);
@@ -1645,7 +1669,16 @@ function EventListViewInner({
 
   return (
     <DecryptClickContext.Provider
-      value={onDecrypt ? { onDecrypt, isDecrypting } : undefined}
+      value={
+        onDecrypt
+          ? {
+              onDecrypt,
+              isDecrypting,
+              isDecryptDisabled,
+              decryptDisabledReason,
+            }
+          : undefined
+      }
     >
       <div className="h-full flex flex-col overflow-hidden">
         <style>{`@keyframes workflow-dot-pulse{0%{transform:scale(1);opacity:.7}70%,100%{transform:scale(2.2);opacity:0}}`}</style>
@@ -1741,6 +1774,8 @@ function EventListViewInner({
             <DecryptButton
               decrypted={!!encryptionKey}
               loading={isDecrypting}
+              disabled={isDecryptDisabled}
+              disabledReason={decryptDisabledReason}
               onClick={onDecrypt}
             />
           )}
@@ -1852,7 +1887,7 @@ function EventListViewInner({
           />
         )}
 
-        {/* Fixed footer — count + load more */}
+        {/* Fixed footer: count + load more */}
         <div
           className="relative flex-shrink-0 flex items-center h-10 border-t px-4 text-label-12"
           style={{

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

@@ -199,7 +199,7 @@ function EncryptedFieldBlock() {
 }
 
 /**
- * Inline display for an expired field — flat label indicating data is no longer available.
+ * Inline display for an expired field: flat label indicating data is no longer available.
  */
 function ExpiredFieldBlock() {
   return (
@@ -299,7 +299,7 @@ const attributeOrder: AttributeKey[] = [
 
 /**
  * Rank of an attribute in {@link attributeOrder}. Keys absent from that list
- * sort after every listed one rather than before them — `indexOf` reports a
+ * sort after every listed one rather than before them: `indexOf` reports a
  * miss as `-1`, which is truthy, so a `|| 0` fallback never fires.
  */
 const attributeOrderIndex = (attribute: string): number => {
@@ -449,7 +449,7 @@ const attributeToDisplayFn: Record<
   receivedCount: (value: unknown) => String(value),
   lastReceivedAt: localMillisecondTimeOrNull,
   disposedAt: localMillisecondTimeOrNull,
-  // Internal resume plumbing — not surfaced in the UI
+  // Internal resume plumbing, not surfaced in the UI
   resumeContext: (_value: unknown) => null,
   resumeId: (_value: unknown) => null,
   resumeCapabilities: (_value: unknown) => null,
@@ -467,14 +467,14 @@ const attributeToDisplayFn: Record<
   projectId: (_value: unknown) => null,
   environment: (_value: unknown) => null,
   executionContext: (_value: unknown) => null,
-  // Attributes — string-string metadata attached to the run.
+  // Attributes: string-string metadata attached to the run.
   // Rendered as key-value rows in its own collapsible section;
   // if empty/missing, hidden by the hasDisplayContent gate.
   attributes: (value: unknown) => {
     if (!hasDisplayContent(value)) return null;
     return <RunAttributesCard attributes={value as Record<string, string>} />;
   },
-  // Dates — wrapped with TimestampTooltip showing UTC/local + relative time
+  // Dates: wrapped with TimestampTooltip showing UTC/local + relative time
   occurredAt: timestampWithTooltipOrNull,
   createdAt: timestampWithTooltipOrNull,
   startedAt: timestampWithTooltipOrNull,
@@ -678,7 +678,7 @@ const attributeToDisplayFn: Record<
   },
   // Internal encryption plumbing: the run's X25519 public key, used by
   // cross-run writers to seal payloads to this run. Not actionable for users
-  // and not secret — hidden rather than rendered as 44 opaque base64 chars.
+  // and not secret, so hidden rather than rendered as 44 opaque base64 chars.
   encryptionPublicKey: (_value: unknown) => null,
 };
 
@@ -836,6 +836,8 @@ export const AttributePanel = ({
   onRunClick,
   onDecrypt,
   isDecrypting = false,
+  isDecryptDisabled = false,
+  decryptDisabledReason,
   resource,
 }: {
   data: Record<string, unknown>;
@@ -852,7 +854,11 @@ export const AttributePanel = ({
   onDecrypt?: () => void;
   /** Whether decryption is currently in progress */
   isDecrypting?: boolean;
-  /** Resource type of the selected span — used to show targeted loading skeletons. */
+  /** Whether decryption is unavailable */
+  isDecryptDisabled?: boolean;
+  /** Explains why decryption is unavailable */
+  decryptDisabledReason?: string;
+  /** Resource type of the selected span, used to show targeted loading skeletons. */
   resource?: string;
 }) => {
   // Extract workflowCoreVersion from executionContext for display
@@ -943,6 +949,8 @@ export const AttributePanel = ({
     ? {
         onDecrypt,
         isDecrypting,
+        isDecryptDisabled,
+        decryptDisabledReason,
         hasEncryptedData: outerDecryptCtx?.hasEncryptedData,
       }
     : outerDecryptCtx;

package/src/components/sidebar/copyable-data-block.tsx

@@ -25,7 +25,14 @@ export function EncryptedDataBlock() {
       </pre>
       <div className="absolute inset-0 flex items-center justify-center">
         {ctx ? (
-          <Button onClick={ctx.onDecrypt} disabled={ctx.isDecrypting} size="xs">
+          <Button
+            onClick={ctx.onDecrypt}
+            disabled={ctx.isDecrypting || ctx.isDecryptDisabled}
+            title={
+              ctx.isDecryptDisabled ? ctx.decryptDisabledReason : undefined
+            }
+            size="xs"
+          >
             {ctx.isDecrypting ? (
               <Spinner size={10} />
             ) : (

package/src/components/sidebar/entity-detail-panel.tsx

@@ -57,7 +57,7 @@ export interface SelectedSpanInfo {
 /**
  * Panel component for workflow traces that displays entity details.
  *
- * This component is rendered OUTSIDE the trace viewer context — it
+ * This component is rendered OUTSIDE the trace viewer context: it
  * receives all data via props rather than reading from context.
  */
 export function EntityDetailPanel({
@@ -71,6 +71,8 @@ export function EntityDetailPanel({
   encryptionKey,
   onDecrypt,
   isDecrypting = false,
+  isDecryptDisabled = false,
+  decryptDisabledReason,
   selectedSpan,
   showSeparateEventOccurrenceTimestamps = false,
   getModuleSourceUrl,
@@ -100,6 +102,10 @@ export function EntityDetailPanel({
   onDecrypt?: () => void;
   /** Whether the encryption key is currently being fetched */
   isDecrypting?: boolean;
+  /** Whether decryption is unavailable */
+  isDecryptDisabled?: boolean;
+  /** Explains why decryption is unavailable */
+  decryptDisabledReason?: string;
   /** Info about the currently selected span from the trace viewer */
   selectedSpan: SelectedSpanInfo | null;
   /** Show occurredAt separately instead of folding it into the Created timestamp. */
@@ -315,7 +321,15 @@ export function EntityDetailPanel({
     <div className="flex h-full flex-col">
       <DecryptClickContext.Provider
         value={
-          onDecrypt ? { onDecrypt, isDecrypting, hasEncryptedData } : undefined
+          onDecrypt
+            ? {
+                onDecrypt,
+                isDecrypting,
+                isDecryptDisabled,
+                decryptDisabledReason,
+                hasEncryptedData,
+              }
+            : undefined
         }
       >
         <div className="flex-1 overflow-y-auto px-4 pb-8">
@@ -394,6 +408,8 @@ export function EntityDetailPanel({
             onRunClick={onRunClick}
             onDecrypt={onDecrypt}
             isDecrypting={isDecrypting}
+            isDecryptDisabled={isDecryptDisabled}
+            decryptDisabledReason={decryptDisabledReason}
             resource={resource}
           />
 

package/src/components/sidebar/events-list.tsx

@@ -2,7 +2,12 @@
 
 import { type Event, getEventDataRefFields } from '@workflow/world';
 import { useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import { DUPLICATE_EVENT_MESSAGE } from '../../lib/duplicate-events';
 import { hasEncryptedFields, isExpiredMarker } from '../../lib/hydration';
+import {
+  isSealedNoopEvent,
+  SEALED_EVENT_MESSAGE,
+} from '../../lib/sealed-events';
 import {
   Collapsible,
   CollapsibleContent,
@@ -10,7 +15,7 @@ import {
   CollapsibleTrigger,
 } from '../ui/collapsible';
 import { RunClickContext, StreamClickContext } from '../ui/data-inspector';
-import { DuplicateEventTooltip } from '../ui/duplicate-event-tooltip';
+import { EventNoticeTooltip } from '../ui/duplicate-event-tooltip';
 import { ErrorCard } from '../ui/error-card';
 import { ErrorStackBlock, isStructuredError } from '../ui/error-stack-block';
 import { Skeleton } from '../ui/skeleton';
@@ -110,6 +115,11 @@ function EventItem({
     void loadEventData(true);
   }, [encryptionKey, loadEventData]);
 
+  const rowNotice = isDuplicate
+    ? DUPLICATE_EVENT_MESSAGE
+    : isSealedNoopEvent(event)
+      ? SEALED_EVENT_MESSAGE
+      : undefined;
   const createdAt = new Date(event.createdAt);
   const occurredAt = parseDateValue(event.occurredAt);
   const displayedCreatedAt = showSeparateEventOccurrenceTimestamps
@@ -139,15 +149,15 @@ function EventItem({
     >
       <CollapsibleTrigger className="px-3 py-2">
         <div className="flex w-full items-center justify-between gap-3">
-          <DuplicateEventTooltip isDuplicate={isDuplicate}>
+          <EventNoticeTooltip notice={rowNotice}>
             <span
               className={`text-label-12 font-mono ${
-                isDuplicate ? 'text-gray-700' : 'text-gray-1000'
+                rowNotice ? 'text-gray-700' : 'text-gray-1000'
               }`}
             >
               {event.eventType}
             </span>
-          </DuplicateEventTooltip>
+          </EventNoticeTooltip>
           <span className="shrink-0 text-label-13 text-gray-900">
             {displayedCreatedAtTime}
           </span>
@@ -242,7 +252,7 @@ function EventDataBlock({
   eventType: string;
   data: unknown;
 }) {
-  // Expired data — show a simple message instead of the raw stub.
+  // Expired data: show a message instead of the raw stub.
   // Check both the top-level eventData and nested sub-fields (result, input, etc.)
   // since the server stubs each ref field independently.
   if (isExpiredMarker(data) || hasOnlyExpiredFields(data, eventType)) {
@@ -264,7 +274,7 @@ function EventDataBlock({
     return <EncryptedDataBlock />;
   }
 
-  // Attribute changes — render the changed keys and the writer instead of
+  // Attribute changes: render the changed keys and the writer instead of
   // the raw JSON payload.
   if (eventType === 'attr_set') {
     return <AttrSetEventBlock data={data} />;

package/src/components/sidebar/resolve-hook-modal.tsx

@@ -116,13 +116,13 @@ export function ResolveHookModal({
       aria-modal="true"
       aria-labelledby="resolve-hook-modal-title"
     >
-      {/* Backdrop — matches Geist dialog ::backdrop */}
+      {/* Backdrop: matches Geist dialog ::backdrop */}
       <div
         className="absolute inset-0 bg-black/70"
         onClick={isSubmitting ? undefined : onClose}
       />
 
-      {/* Modal card — matches Geist dialog.geist-dialog */}
+      {/* Modal card: matches Geist dialog.geist-dialog */}
       <div className="relative z-10 w-[480px] max-w-[calc(100%_-_32px)] overflow-hidden !border-none bg-background-100 text-gray-1000 material-menu">
         {/* Header */}
         <div className="flex items-center justify-between px-6 py-4">

package/src/components/sidebar/sidebar-data-context.tsx

@@ -29,6 +29,8 @@ export interface SidebarDataContextValue {
   encryptionKey?: Uint8Array;
   onDecrypt?: () => void;
   isDecrypting?: boolean;
+  isDecryptDisabled?: boolean;
+  decryptDisabledReason?: string;
   hasEncryptedData?: boolean;
   /** Show occurredAt separately instead of folding it into the Created timestamp. */
   showSeparateEventOccurrenceTimestamps?: boolean;

package/src/components/stream-viewer.tsx

@@ -30,7 +30,7 @@ interface StreamViewerProps {
 }
 
 // ──────────────────────────────────────────────────────────────────────────
-// Chunk row — memoized to prevent remounts during polling
+// Chunk row: memoized to prevent remounts during polling
 // ──────────────────────────────────────────────────────────────────────────
 
 const ChunkRow = React.memo(function ChunkRow({ chunk }: { chunk: Chunk }) {

package/src/components/trace-viewer/components/detail-panel-width.ts

@@ -2,11 +2,11 @@
  * Width model for the span detail panel: the stored value is the user's
  * preferred width (absolute px, persisted to localStorage on explicit
  * interaction only), while the container-relative maximum is applied at
- * render time — so a width preferred on a wide screen survives a narrower
+ * render time, so a width preferred on a wide screen survives a narrower
  * session and restores when the viewer grows again.
  */
 
-/** Floor for the detail panel — matches the previous `clamp(280px, …)` floor. */
+/** Floor for the detail panel; matches the previous `clamp(280px, …)` floor. */
 export const PANEL_MIN_WIDTH = 280;
 
 /**
@@ -15,13 +15,13 @@ export const PANEL_MIN_WIDTH = 280;
  */
 export const PANEL_HARD_MAX_WIDTH = 1300;
 
-/** Default width — matches the previous fixed 360px column. */
+/** Default width; matches the previous fixed 360px column. */
 export const PANEL_DEFAULT_WIDTH = 360;
 
 /**
  * Width the main (event list + timeline) area keeps while the panel is
  * resized or the container shrinks. Below `PANEL_MIN_WIDTH + MAIN_MIN_WIDTH`
- * of container the panel gives way first, compressing below its own floor —
+ * of container the panel gives way first, compressing below its own floor:
  * the list and timeline stay usable at the panel's expense.
  */
 export const MAIN_MIN_WIDTH = 400;

package/src/components/trace-viewer/components/detail-panel.tsx

@@ -64,7 +64,7 @@ function useSelectedSpanInfo(): SelectedSpanInfo | null {
  * The span detail aside: content, prev/next/close header, J/K navigation, and
  * the resizable left border with its width model (see detail-panel-width.ts).
  *
- * Always mounted — it renders null without a selection — so the panel width
+ * Always mounted (it renders null without a selection) so the panel width
  * survives closing and reopening within a session.
  */
 export function TraceDetailPanel({
@@ -261,6 +261,8 @@ export function TraceDetailPanel({
             encryptionKey={sidebar.encryptionKey}
             onDecrypt={sidebar.onDecrypt}
             isDecrypting={sidebar.isDecrypting}
+            isDecryptDisabled={sidebar.isDecryptDisabled}
+            decryptDisabledReason={sidebar.decryptDisabledReason}
             selectedSpan={selectedSpan}
             showSeparateEventOccurrenceTimestamps={
               sidebar.showSeparateEventOccurrenceTimestamps

package/src/components/trace-viewer/components/draggable-border.tsx

@@ -35,7 +35,7 @@ interface DraggableBorderProps {
  * double-click reset, pointer-capture dragging (works with touch/pen, no
  * ghost image), and keyboard/ARIA window-splitter support.
  *
- * The panel's positioning ancestor must not clip overflow — the strip hangs
+ * The panel's positioning ancestor must not clip overflow: the strip hangs
  * ~8px past the panel edge.
  */
 export function DraggableBorder({

package/src/components/trace-viewer/components/minimap.tsx

@@ -200,9 +200,9 @@ export const Minimap = memo(function Minimap({
 
   // Density canvas: one thin line per span across the full run. Sizing is
   // read live and redraws run straight from the ResizeObserver (which fires
-  // before paint), so layout changes — e.g. the detail panel opening — never
+  // before paint), so layout changes (e.g. the detail panel opening) never
   // paint a frame with a stale, stretched bitmap.
-  // biome-ignore lint/correctness/useExhaustiveDependencies: themeVersion is a redraw trigger — the canvas re-resolves its token colors when the theme flips
+  // biome-ignore lint/correctness/useExhaustiveDependencies: themeVersion is a redraw trigger; the canvas re-resolves its token colors when the theme flips
   useLayoutEffect(() => {
     const canvas = canvasRef.current;
     const container = containerRef.current;
@@ -276,7 +276,7 @@ export const Minimap = memo(function Minimap({
         return { mode: 'resize-right' };
       }
       // Panning a full-extent window is a no-op, so let a drag on the brush
-      // start a selection instead — the natural first gesture on the map.
+      // start a selection instead, the natural first gesture on the map.
       const { start, end } = viewportRef.current;
       const isFullExtent =
         start - rootStartMs < rootDurationMs * 0.001 &&