niceeval 0.8.1 → 0.9.0

package/src/view/data.ts

@@ -267,8 +267,8 @@ export async function loadViewScan(input?: string, opts: ViewScanOptions = {}):
     }
   }
 
-  // 全局最新快照(跨全部实验):hero 的「最近一次运行」时刻从这里取。
-  // hero 标题不从这里取——它走标题回退链(resolveReportTitle,进 viewData.report.title)。
+  // 全局最新快照(跨全部实验):viewData.lastRunAt 从这里取。页内 hero 的「最后运行」
+  // 显示由 Hero 组件按 heroData(scope) 自己算,不吃这份字段。
   let latestSnapshot: Snapshot | undefined;
   for (const exp of results.experiments) {
     const candidate = exp.snapshots[0];

package/src/view/shared/types.ts

@@ -33,8 +33,9 @@ export interface ViewReportPageMeta {
 /**
  * 规范化后的报告外壳声明(docs/feature/reports/library/shell.md):壳(导航 / 页脚)由前端
  * 渲染,页内容消费 <template> 静态块。title 已走完回退链(def.title → 唯一且相同的快照 name →
- * 内置文案「Eval 运行结果 / Eval Results」),落点是首页 hero 与浏览器标题——页头品牌位恒为
- * NiceEval 字标,不归 title;scripts / styles 是注入资产,不进 viewData。
+ * 内置文案「Eval 运行结果 / Eval Results」),宿主落点只有浏览器 <title>(文档单例);
+ * 页内 hero 标题由 Hero 组件消费同一取值链,品牌是组件、宿主页头不渲染任何品牌位。
+ * scripts / styles 是注入资产,不进 viewData。
  * link 的 icon 是内联 SVG 字符串(原样透传、原样内联),不收组件——viewData 就是序列化边界。
  */
 export interface ViewReportMeta {
@@ -70,7 +71,11 @@ export interface ViewSnapshot {
   results: ViewEvalResult[];
 }
 
-/** 目录扫描里被跳过的 run 在页面顶部的提示条目;三种原因与 niceeval/results 的 skipped 一致。 */
+/**
+ * 目录扫描里被跳过的 run 的结构化条目;三种原因与 niceeval/results 的 skipped 一致。
+ * 页面上的呈现不走它:不可读快照已形成 `unreadable-snapshot` Scope warning,由报告页内的
+ * `ScopeWarnings` 组件显示;这里只随 viewData 携带原始事实。
+ */
 export interface SkippedRunNotice {
   /** run 目录,相对 cwd。 */
   dir: string;
@@ -92,11 +97,11 @@ export interface SkippedRunNotice {
 export interface ViewData {
   /** 最近一次 run 的 startedAt(ISO);没有历史 run 时缺省。 */
   lastRunAt?: string;
-  /** 报告槽 Selection 合成自几个物理 run;hero「合成来源」标注。 */
+  /** 报告槽 Selection 合成自几个物理 run。 */
   composedRuns: number;
-  /** 全部历史快照(跨快照按身份键去重后);修复 prompt 吃 latest,Attempts / Traces 吃全部。 */
+  /** 全部历史快照(跨快照按身份键去重后);attempt 详情路由对这份完整集合解析,不随报告 Scope 收窄。 */
   snapshots: ViewSnapshot[];
-  /** 读不了的落盘(三种原因);前端顶部横幅展示,不静默。 */
+  /** 读不了的落盘(三种原因);呈现走报告页内的 ScopeWarnings(unreadable-snapshot warning)。 */
   skippedRuns?: SkippedRunNotice[];
   /** 报告外壳与页导航的声明(规范化后);缺省时前端按单页 `report` 兜底。 */
   report?: ViewReportMeta;

package/src/view/styles.css

@@ -63,8 +63,8 @@ a { color: inherit; }
   align-items: center;
   justify-content: space-between;
   /* space-between 只在有富余空间时才撑开相邻项;.shell-links 的 margin-left:auto 会把富余
-     空间全部吸收到它左侧,导致品牌与导航贴脸、shell-links 与语言切换贴脸。显式 gap 保证
-     每一对相邻项(品牌—导航、shell-links—语言切换)恒有最小间距,不依赖富余空间。 */
+     空间全部吸收到它左侧,导致相邻项贴脸。显式 gap 保证每一对相邻项(导航—shell-links、
+     shell-links—语言切换)恒有最小间距,不依赖富余空间。 */
   gap: 28px;
   padding: 0 clamp(20px, 5vw, 80px);
   background: color-mix(in oklch, var(--bg), transparent 4%);
@@ -73,20 +73,7 @@ a { color: inherit; }
   z-index: 10;
   backdrop-filter: blur(10px);
 }
-.brand {
-  display: flex;
-  align-items: baseline;
-  gap: 12px;
-  font-weight: 690;
-  font-size: 20px;
-}
-.mark {
-  width: 18px;
-  height: 18px;
-  border: 1.25px solid var(--text);
-  transform: rotate(45deg);
-  display: inline-block;
-}
+/* 页头无品牌位:品牌是页内组件(PoweredBy / Hero 的品牌行,nre-powered-by),宿主不渲染。 */
 /* 顶部导航 .nav / .nav-tab → components/ui/tabs.tsx(Radix Tabs + Tailwind utilities)。 */
 .lang-switch {
   display: inline-flex;
@@ -121,219 +108,13 @@ main {
   margin: 0 auto;
   padding: clamp(52px, 7vw, 82px) 0 72px;
 }
-.hero {
-  text-align: center;
-  max-width: 740px;
-  margin: 0 auto clamp(38px, 6vw, 58px);
-}
-h1 {
-  margin: 0;
-  font-size: clamp(42px, 5.6vw, 66px);
-  line-height: 0.94;
-  font-weight: 760;
-  letter-spacing: 0;
-}
-.subtitle {
-  margin: 20px auto 0;
-  color: color-mix(in oklch, var(--muted), var(--text) 12%);
-  font-size: clamp(17px, 2vw, 21px);
-  line-height: 1.58;
-  max-width: 660px;
-}
-.meta {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-  gap: 14px;
-  margin-top: 24px;
-  color: var(--muted);
-  font-size: 14px;
-}
-.meta b { color: var(--text); font-weight: 570; }
-/* --report 报告槽:server 侧渲染好的静态报告 HTML(nre-* 类的样式随包 styles.css 注入),
-   这里只给槽位留呼吸空间,不覆盖报告自己的样式。 */
+/* 报告槽:server 侧渲染好的静态报告 HTML(nre-* 类的样式随包 styles.css 注入),
+   这里只给槽位留呼吸空间,不覆盖报告自己的样式。hero、警告区、批量修复 prompt 都是
+   页内组件(nre-hero / nre-warnings / nre-copy-fix-prompt),宿主不再有对应 chrome。 */
 .report-slot {
   margin: 0 auto 36px;
 }
-/* schemaVersion 不匹配等读不了的 run:报告槽不解析它们,这里占位提示。同一原因(且文案
-   完全相同)的条目按 SkippedRunsBanner 分组折叠,不逐条重复整句原因 + 命令——那是原实现
-   把首屏挤满、警示色又淡到看不出来的根因。 */
-.incompatible-banner {
-  border: 1px solid color-mix(in oklch, var(--warn), var(--line) 35%);
-  border-left: 3px solid var(--warn);
-  border-radius: 8px;
-  background: color-mix(in oklch, var(--warn), var(--panel) 85%);
-  padding: 12px 16px 14px;
-  margin: 0 auto 36px;
-  font-size: 13px;
-}
-.ib-head {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-.ib-head b { font-weight: 640; }
-.ib-icon {
-  width: 16px;
-  height: 16px;
-  flex-shrink: 0;
-  color: var(--warn);
-  stroke-width: 2;
-}
-.ib-groups {
-  display: grid;
-  gap: 10px;
-  margin-top: 10px;
-}
-.ib-group-head {
-  display: flex;
-  align-items: baseline;
-  gap: 8px;
-}
-.ib-group-count {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  min-width: 20px;
-  height: 20px;
-  padding: 0 6px;
-  flex-shrink: 0;
-  border-radius: 999px;
-  background: color-mix(in oklch, var(--warn), var(--panel) 72%);
-  color: var(--text);
-  font-size: 11px;
-  font-weight: 640;
-  font-variant-numeric: tabular-nums;
-}
-.ib-group-desc { color: var(--soft); }
-.ib-group ul {
-  margin: 5px 0 0;
-  padding: 0;
-  list-style: none;
-  display: grid;
-  gap: 3px;
-}
-.ib-group li {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  min-height: 22px;
-}
-.ib-dir {
-  font-family: var(--mono, ui-monospace, monospace);
-  font-weight: 560;
-}
-.ib-more {
-  color: var(--soft);
-  font-size: 12px;
-}
-.ib-copy {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 22px;
-  height: 22px;
-  flex-shrink: 0;
-  border: 1px solid var(--line);
-  border-radius: 5px;
-  background: var(--panel);
-  color: var(--muted);
-  cursor: pointer;
-  transition: color 0.12s, border-color 0.12s;
-}
-.ib-copy svg { width: 12px; height: 12px; stroke: currentColor; fill: none; stroke-width: 2; }
-.ib-copy:hover { color: var(--text); border-color: var(--line-strong); }
-.ib-copy.is-copied { color: var(--good); border-color: color-mix(in oklch, var(--good), var(--line) 40%); }
-.ib-toggle {
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-  margin-top: 10px;
-  border: 0;
-  background: none;
-  color: var(--muted);
-  font: inherit;
-  font-size: 12px;
-  cursor: pointer;
-  padding: 0;
-}
-.ib-toggle svg { width: 12px; height: 12px; transition: transform 0.12s; }
-.ib-toggle svg.is-open { transform: rotate(90deg); }
-.ib-toggle:hover { color: var(--text); }
-
-.section-head {
-  display: flex;
-  align-items: end;
-  justify-content: space-between;
-  gap: 18px;
-  margin-bottom: 16px;
-}
-h2 {
-  margin: 0;
-  font-size: clamp(24px, 2.6vw, 31px);
-  line-height: 1.1;
-  font-weight: 720;
-}
-.controls {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-  flex-wrap: wrap;
-}
-.search {
-  height: 36px;
-  min-width: 320px;
-  border: 1px solid var(--line);
-  border-radius: 7px;
-  padding: 0 12px;
-  background: var(--panel);
-  color: var(--text);
-  outline: none;
-}
-.search:focus { border-color: var(--focus); }
-.table-wrap {
-  border: 1px solid var(--line);
-  border-radius: 8px;
-  overflow: auto;
-  background: var(--panel);
-}
-table {
-  width: 100%;
-  border-collapse: collapse;
-  min-width: 1040px;
-}
-th, td {
-  border-bottom: 1px solid var(--line);
-  padding: 0 16px;
-  height: 52px;
-  text-align: left;
-  vertical-align: middle;
-  font-size: 14px;
-}
-th {
-  color: var(--muted);
-  font-weight: 500;
-  background: var(--panel);
-  position: sticky;
-  top: 0;
-  z-index: 2;
-}
-tbody tr:last-child td { border-bottom: 0; }
-.section-sub-head {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 18px;
-  margin-bottom: 16px;
-  min-height: 36px;
-}
-.group-detail-label {
-  font-size: 15px;
-  font-weight: 680;
-  color: var(--text);
-}
 .name { font-weight: 610; }
-.sub { color: var(--muted); font-size: 12px; margin-top: 3px; }
 .num {
   font-variant-numeric: tabular-nums;
   white-space: nowrap;
@@ -343,12 +124,6 @@ tbody tr:last-child td { border-bottom: 0; }
 .bad { color: var(--bad); }
 .warn { color: var(--warn); }
 .infra-err { color: var(--warn); }
-.eval-id {
-  display: flex;
-  align-items: center;
-  overflow-wrap: anywhere;
-  font-weight: 560;
-}
 .copy-all-errors {
   height: 36px;
   display: inline-flex;
@@ -702,41 +477,10 @@ pre {
   font-size: 12px;
   line-height: 1.5;
 }
-.empty {
-  border: 1px dashed var(--line-strong);
-  border-radius: 8px;
-  padding: 40px 24px;
-  color: var(--muted);
-  text-align: center;
-  background: var(--panel);
-}
-a.brand { text-decoration: none; color: inherit; }
-a.brand:hover { opacity: 0.75; }
-.traces-entry {
-  border: 1px solid var(--line);
-  border-radius: 8px;
-  background: var(--panel);
-  margin-bottom: 12px;
-  padding: 14px 18px;
-}
-.traces-entry-head {
-  display: flex;
-  align-items: baseline;
-  gap: 12px;
-  margin-bottom: 8px;
-  font-size: 13px;
-}
-.traces-verdict { font-weight: 600; min-width: 52px; }
-.traces-exp { color: var(--muted); flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.traces-dur { color: var(--soft); }
 @media (max-width: 760px) {
   .topbar { padding: 0 20px; }
   .lang-switch button { min-width: 40px; }
   main { width: min(100vw - 28px, 1120px); padding-top: 42px; }
-  .hero { text-align: left; margin-left: 0; }
-  .meta { justify-content: flex-start; }
-  .section-head { align-items: stretch; flex-direction: column; }
-  .search { width: 100%; min-width: 0; }
   .detail { padding: 18px 16px 20px; }
   .config-strip { gap: 6px; }
   .detail-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 10px; }
@@ -1194,8 +938,4 @@ li.tnode-row::before { content: ""; width: 4px; flex-shrink: 0; }
   color: var(--soft);
   font-size: 12px;
 }
-/* 品牌行:hero 之下、品牌蓝,恒带官网链接(shell.md「行为约束」)。 */
-.hero .powered-by { display: block; margin-top: 16px; font-size: 12px; }
-.hero .powered-by a { color: var(--blue); text-decoration: none; }
-.hero .powered-by a:hover { text-decoration: underline; }
 .nre-page-error pre { white-space: pre-wrap; }

package/src/view/view-report.test.ts

@@ -139,33 +139,55 @@ describe("resolveViewInput · 输入语义", () => {
 });
 
 
-/** 单页报告(裸跑 / 树形态 --report)的报告槽 HTML:规范化后唯一页 id 恒为 `report`。 */
+/** 单页报告(树形态 --report)的报告槽 HTML:规范化后唯一页 id 恒为 `report`。 */
 function slotHtml(scan: ViewScan): { en: string; "zh-CN": string } {
   expect(scan.reportPages).toHaveLength(1);
   expect(scan.reportPages[0]!.id).toBe("report");
   return scan.reportPages[0]!.html as { en: string; "zh-CN": string };
 }
 
+/** 多页定义(裸跑装载的内建报告是三页)按页 id 取报告槽 HTML。 */
+function pageHtml(scan: ViewScan, id: string): { en: string; "zh-CN": string } {
+  const page = scan.reportPages.find((p) => p.id === id);
+  expect(page, `page ${id}`).toBeTruthy();
+  return page!.html as { en: string; "zh-CN": string };
+}
+
+/** 裸跑的首页(内建报告的 report 页):先断言内建三页齐全,再取首页 HTML。 */
+function bareReportHtml(scan: ViewScan): { en: string; "zh-CN": string } {
+  expect(scan.reportPages.map((p) => p.id)).toEqual(["report", "attempts", "traces"]);
+  return pageHtml(scan, "report");
+}
+
 // ───────────────────────── 组合语义(与 show 对齐) ─────────────────────────
 
 describe("loadViewScan · 组合语义", () => {
-  it("位置前缀收窄报告槽 Selection;证据室快照不收窄,深链恒可达", async () => {
+  it("位置前缀收窄对全部页生效(含内建 Attempts 页);attempt 详情路由对完整结果根解析,被滤掉的深链仍可达", async () => {
     const root = await seedRoot();
     const scan = await loadViewScan(root, { patterns: ["weather"] });
     const { viewData } = scan;
-    const reportHtml = slotHtml(scan);
-    // 报告槽:两实验都只剩 weather/brooklyn 一题,范围外的失败不再出现。
+    const reportHtml = bareReportHtml(scan);
+    // 报告页:两实验都只剩 weather/brooklyn 一题,范围外的失败不再出现。
     expect(reportHtml.en).toContain("compare/bub");
     expect(reportHtml.en).toContain("compare/codex");
     expect(reportHtml.en).not.toContain("fixtures/button");
-    // 证据室:快照明细仍含 fixtures/button(attempt 深链在收窄下也能解析)。
-    const allIds = viewData.snapshots.flatMap((s) => s.results.map((r) => r.id));
-    expect(allIds).toContain("fixtures/button");
+    // Attempts / Traces 是普通页,共享同一收窄后 Scope:行集同样缩小。
+    expect(pageHtml(scan, "attempts").en).not.toContain("fixtures/button");
+    expect(pageHtml(scan, "traces").en).not.toContain("fixtures/button");
+    const bare = await loadViewScan(root);
+    expect(pageHtml(bare, "attempts").en).toContain("fixtures/button"); // 不收窄时在场,对照
+    // attempt 详情路由不是页:viewData.snapshots 全量通道保留,被滤掉的 attempt 深链仍解析成功。
+    const filteredOut = viewData.snapshots
+      .flatMap((s) => s.results)
+      .find((r) => r.id === "fixtures/button");
+    expect(filteredOut?.locator).toBeTruthy();
+    const { resolveAttemptLocator } = await import("./app/lib/attempt-route.ts");
+    expect(resolveAttemptLocator(viewData.snapshots, filteredOut!.locator!)).toBe(filteredOut);
   });
 
   it("--experiment 过滤:报告槽 Selection 只留该实验", async () => {
     const root = await seedRoot();
-    const reportHtml = slotHtml(await loadViewScan(root, { experiment: "compare/codex" }));
+    const reportHtml = bareReportHtml(await loadViewScan(root, { experiment: "compare/codex" }));
     expect(reportHtml.en).toContain("compare/codex");
     expect(reportHtml.en).not.toContain("compare/bub");
   });
@@ -177,34 +199,43 @@ describe("loadViewScan · 组合语义", () => {
     await expect(loadViewScan(root, { experiment: "nosuch" })).rejects.toBeInstanceOf(ViewInputError);
   });
 
-  it("全部缺省:报告槽使用现刻水位口径(与 show 相同的合成规则)", async () => {
+  it("全部缺省:报告槽使用现刻水位口径(与 show 相同的合成规则);导航页即内建三页", async () => {
     const root = await seedRoot();
-    const reportHtml = slotHtml(await loadViewScan(root));
+    const scan = await loadViewScan(root);
+    const reportHtml = bareReportHtml(scan);
     // 默认报告的榜单含两个实验;官方组件的稳定类名在场。
     expect(reportHtml.en).toContain("compare/bub");
     expect(reportHtml.en).toContain("compare/codex");
     expect(reportHtml.en).toContain("nre-");
+    // 导航 = 报告定义声明的页(声明序),宿主不追加:裸 view 的三个 tab 就是内建三页。
+    expect(scan.viewData.report?.pages.map((p) => p.id)).toEqual(["report", "attempts", "traces"]);
+    expect(scan.viewData.report?.pages.map((p) => p.title)).toEqual([
+      { en: "Report", "zh-CN": "报告" },
+      "Attempts",
+      { en: "Traces", "zh-CN": "追踪" },
+    ]);
   });
 });
 
 // ─────────────────── 报告槽恒在:裸跑 ≡ --report <ExperimentComparison> ───────────────────
 
 describe("loadViewScan · 默认报告槽(裸跑)", () => {
-  it("裸跑产出的报告槽 HTML 与 --report <re-export ExperimentComparison 的文件> 完全一致(双语)", async () => {
+  it("裸跑产出的报告槽 HTML 与 --report <re-export 内建报告的文件> 逐页完全一致(双语)", async () => {
     const root = await seedRoot();
-    const bare = slotHtml(await loadViewScan(root));
-    const viaReport = slotHtml(
-      await loadViewScan(root, {
-        report: { path: DEFAULT_REPORT_REEXPORT, cwd: root },
-      }),
-    );
-    expect(bare.en).toBe(viaReport.en);
-    expect(bare["zh-CN"]).toBe(viaReport["zh-CN"]);
+    const bare = await loadViewScan(root);
+    const viaReport = await loadViewScan(root, {
+      report: { path: DEFAULT_REPORT_REEXPORT, cwd: root },
+    });
+    expect(viaReport.reportPages.map((p) => p.id)).toEqual(bare.reportPages.map((p) => p.id));
+    for (const pageId of ["report", "attempts", "traces"]) {
+      expect(pageHtml(viaReport, pageId).en).toBe(pageHtml(bare, pageId).en);
+      expect(pageHtml(viaReport, pageId)["zh-CN"]).toBe(pageHtml(bare, pageId)["zh-CN"]);
+    }
   });
 
   it("报告槽双语渲染:同一棵树按 locale 渲染两遍,chrome 文案分语言、数据不分语言", async () => {
     const root = await seedRoot();
-    const reportHtml = slotHtml(await loadViewScan(root));
+    const reportHtml = bareReportHtml(await loadViewScan(root));
     expect(reportHtml.en).toContain("End-to-end pass rate"); // ExperimentList 主行(en)
     expect(reportHtml["zh-CN"]).toContain("端到端成功率"); // ExperimentList 主行(zh-CN)
     for (const html of [reportHtml.en, reportHtml["zh-CN"]]) {
@@ -216,11 +247,17 @@ describe("loadViewScan · 默认报告槽(裸跑)", () => {
     }
   });
 
-  it("失败清单与警告住在报告槽里:ExperimentList 列出失败,壳的 viewData 不携带统计产物", async () => {
+  it("失败清单与警告住在报告页里:ExperimentList 列出失败,壳的 viewData 不携带统计产物", async () => {
     const root = await seedRoot();
     const scan = await loadViewScan(root);
     const { viewData } = scan;
-    expect(slotHtml(scan).en).toContain("fixtures/button");
+    expect(bareReportHtml(scan).en).toContain("fixtures/button");
+    // 品牌行是页内组件(Hero 恒含),不是宿主 chrome:每页 web 面都带官网品牌行。
+    for (const pageId of ["report", "attempts", "traces"]) {
+      const html = pageHtml(scan, pageId).en;
+      expect(html).toContain("nre-powered-by");
+      expect(html).toContain("https://niceeval.com/?utm_source=report&amp;utm_medium=powered-by");
+    }
     // viewData 只有证据室数据:快照 + skipped + 壳元信息。
     expect(viewData).not.toHaveProperty("overview");
     expect(viewData).not.toHaveProperty("table");

package/src/view/app/components/LazyArtifact.tsx

@@ -1,51 +0,0 @@
-import { useEffect, useState } from "react";
-import type { LazyArtifactType, T } from "../shared.ts";
-import { artifactUrl } from "../lib/artifact-url.ts";
-import { asEvents, asSpans } from "../lib/guards.ts";
-import { Trace } from "./Trace.tsx";
-import { Transcript } from "./Transcript.tsx";
-
-export function LazyArtifact({ type, src, autoLoad = false, t }: { type: LazyArtifactType; src: string; autoLoad?: boolean; t: T }) {
-  const [open, setOpen] = useState(autoLoad);
-  const [loaded, setLoaded] = useState(false);
-  const [content, setContent] = useState<unknown>(null);
-  const [error, setError] = useState("");
-
-  const load = async () => {
-    if (loaded) return;
-    setLoaded(true);
-    try {
-      const resp = await fetch(artifactUrl(src));
-      if (!resp.ok) throw new Error("HTTP " + resp.status);
-      const body = await resp.json();
-      setContent(body);
-      setError("");
-    } catch (e) {
-      setLoaded(false);
-      setError(`${t("trace.loadFailed")} ${String(e)}`);
-    }
-  };
-
-  useEffect(() => {
-    if (autoLoad) void load();
-  }, []);
-
-  return (
-    <details
-      className="trace-details"
-      open={open}
-      onToggle={(e) => {
-        const isOpen = e.currentTarget.open;
-        setOpen(isOpen);
-        if (isOpen) void load();
-      }}
-    >
-      <summary>{type === "transcript" ? t("trace.transcript") : t("trace.timing")}</summary>
-      <div className="trace-slot">
-        {error ? <div className="trace-span-meta">{error}</div> : !content ? <div className="trace-span-meta">{t("trace.loading")}</div> : null}
-        {content && type === "transcript" ? <Transcript events={asEvents(content) ?? []} t={t} /> : null}
-        {content && type === "trace" ? <Trace spans={asSpans(content) ?? []} t={t} /> : null}
-      </div>
-    </details>
-  );
-}