import { esc, number, icon, enhance, table as sharedTable } from "./ui.js";
import { versionsView, versionFromHash } from "./versions.js?v=history-20261103";
let content,
  versionHistory,
  registry = [],
  snapshot,
  root,
  timer,
  ageTimer,
  request,
  generation = 0;
let selectedCampaign = null,
  selectedVersion = "006",
  selectedJobs = "active",
  registryQuery = "",
  registryPage = 0;
const clock = (t) =>
  new Date(t * 1000).toLocaleString("zh-CN", {
    timeZone: "Asia/Kuala_Lumpur",
    month: "2-digit",
    day: "2-digit",
    hour: "2-digit",
    minute: "2-digit",
    hour12: false,
  }) + " MYT";
const table = (heads, rows) => sharedTable(heads, rows, "synth-table");
const phases = {
  WAIT_SSD_CAPACITY: "等待存储准入",
  WAIT_CAPACITY: "等待容量",
  WAIT_SHARED_GPU_FOR_CYCLES: "等待GPU",
  V5_APPEARANCE_CANONICAL_SURFACE: "表面与材质",
  V5_THREE_MOUNT_INDEPENDENT_CAMERA: "相机轨迹",
  V5_RANDOMIZED_SCENE_CANONICAL_SURFACE: "场景组装",
  CYCLES_OPTIX_16SPP_GPU_OIDN: "RGB渲染",
  VIDEO_POST_AND_DEPTH_OVERLAPPED: "视频后处理 / 深度",
  PACKAGE_NATIVE_RENDER_CHANNELS: "打包",
  VERIFIED_SEQUENTIAL_NAS_PUBLICATION: "NAS归档",
  INITIALIZING: "初始化",
  FAILED: "待定点修复",
  WAIT_UPSTREAM_ASSET: "等待上游资产",
};
const sections = [
  ["progress", "进度"],
  ["versions", "版本"],
  ["reading", "数据读取"],
  ["samples", "样例"],
];
const tab = () => location.hash.split("/")[1] || "progress";
function section(title, body) {
  return `<section class="synth-section"><h2>${esc(title)}</h2>${body}</section>`;
}
function code(title, text) {
  return `<section><h3 class="synth-code-title">${esc(title)}</h3><div class="synth-code">${icon("copy", "复制代码", "data-copy")}<pre><code>${esc(text)}</code></pre></div></section>`;
}
function icons() {
  enhance();
}
export function valid(value) {
  const c = value && value.counts;
  return (
    value &&
    value.schema === "egorenderer.public_progress.v1" &&
    Number.isFinite(value.collected_at) &&
    c &&
    ["complete", "running", "ready", "failed", "total"].every(
      (k) => Number.isInteger(c[k]) && c[k] >= 0,
    ) &&
    c.total > 0 &&
    c.complete + c.running + c.ready + c.failed === c.total
  );
}
function header() {
  return `<div class="synth-head"><div class="synth-title"><h1>EgoRenderer</h1><span class="release-label">V006</span><select id="synth-campaign" aria-label="生产数据集"><option value="OakInk2">OakInk2</option><option value="ARCTIC">ARCTIC</option></select><span class="synth-identity" id="synth-execution"></span></div><div class="synth-status" id="synth-status" aria-live="polite"><span class="synth-dot"></span><span id="synth-freshness">读取快照</span>${icon("refresh-cw", "刷新进度", 'id="synth-refresh"')}</div></div>
      <nav class="synth-nav" aria-label="合成数据">${sections.map(([id, label]) => `<a href="#synthetic/${id}" ${tab() === id ? 'aria-current="page"' : ""}>${label}</a>`).join("")}</nav>`;
}
function progressView() {
  return `<div id="synth-summary" class="synth-kpis" aria-live="polite"></div><div class="part"><div id="synth-progress" class="synth-progress" role="progressbar" aria-label="ARCTIC随机化包生成进度"></div><div id="synth-facts" class="synth-facts"></div></div>
      <div id="synth-notices"></div>${section("数据范围", '<div id="synth-cohorts"></div>')}
      <section class="synth-section"><div class="synth-toolbar"><h2>当前任务</h2><select id="synth-job-filter" aria-label="任务状态"><option value="active">运行中</option><option value="failed">失败</option><option value="inputs">待上游资产</option><option value="all">全部未完成</option></select></div><div id="synth-jobs"></div></section>
      <details class="reference-details"><summary>主机与存储</summary><div id="synth-resources" class="synth-resource"></div><div id="synth-storage" class="synth-facts"></div></details>
      ${section("最近归档", '<div id="synth-recent"></div>')}`;
}
export function progressState(value, error = false, now = Date.now() / 1000) {
  if (!value)
    return { state: "error", prefix: error ? "状态暂不可用" : "读取快照" };
  if (error) return { state: "stale", prefix: "连接中断 · " };
  if (now - value.collected_at > 180)
    return { state: "stale", prefix: "更新已过期 · " };
  const c = value.counts;
  if (
    c.complete === c.total &&
    c.running === 0 &&
    c.ready === 0 &&
    c.failed === 0
  )
    return { state: "complete", prefix: "生成队列结束 · " };
  if (
    !value.queue_alive &&
    c.waiting_assets > 0 &&
    !c.running &&
    !c.ready &&
    !c.failed
  )
    return { state: "waiting", prefix: "等待上游资产 · " };
  if (!value.queue_alive) return { state: "stopped", prefix: "队列已停 · " };
  if (value.admission_held) return { state: "stopped", prefix: "暂停新增 · " };
  return { state: "live", prefix: "" };
}
export function campaignSnapshot(value, selected = null) {
  if (!value) return null;
  const choice = selected || value.default_campaign || "ARCTIC";
  const view =
    choice === "OakInk2" && value.oakink_render
      ? value.oakink_render
      : { dataset: "ARCTIC" };
  return {
    ...value,
    ...view,
    arctic_render: {
      counts: value.counts,
      scope: value.scope,
      coverage: value.coverage,
      known_gt_missing: value.known_gt_missing,
    },
  };
}
function updateFreshness(error) {
  if (!root) return;
  const status = root.querySelector("#synth-status"),
    label = root.querySelector("#synth-freshness");
  if (!snapshot) {
    status.dataset.state = "error";
    label.textContent = error ? "状态暂不可用" : "读取快照";
    return;
  }
  const current = campaignSnapshot(snapshot, selectedCampaign);
  const selector = root.querySelector("#synth-campaign");
  selector.querySelector('option[value="OakInk2"]').disabled =
    !snapshot.oakink_render;
  selector.value = current.dataset;
  const display = progressState(current, error);
  status.dataset.state = display.state;
  label.textContent = display.prefix + clock(snapshot.collected_at);
  root.querySelector("#synth-execution").textContent =
    "执行 " + current.execution_revision;
}
function updateProgress() {
  if (!root || tab() !== "progress") return;
  if (!snapshot) {
    root.querySelector("#synth-summary").innerHTML =
      '<p class="synth-empty">状态暂不可用。不会以零值替代上次进度。</p>';
    return;
  }
  const s = campaignSnapshot(snapshot, selectedCampaign),
    c = s.counts;
  const metrics = [
    ["渲染与深度完成", `${number(c.complete)} / ${number(c.total)}`],
    ["运行中", number(c.running)],
    ["待领取", number(c.ready)],
    ["失败", number(c.failed)],
  ];
  if (c.waiting_assets) metrics.push(["待上游资产", number(c.waiting_assets)]);
  root.querySelector("#synth-summary").dataset.columns = metrics.length;
  root.querySelector("#synth-summary").innerHTML = metrics
    .map(
      ([k, v]) =>
        `<div class="synth-kpi"><strong>${v}</strong><span>${k}</span></div>`,
    )
    .join("");
  const progress = root.querySelector("#synth-progress");
  progress.setAttribute("aria-label", s.dataset + "包生成进度");
  progress.setAttribute("aria-valuemin", "0");
  progress.setAttribute("aria-valuemax", c.total);
  progress.setAttribute("aria-valuenow", c.complete);
  progress.innerHTML = [
    ["done", c.complete],
    ["running", c.running],
    ["failed", c.failed],
  ]
    .map(
      ([cl, n]) =>
        `<span class="${cl}" style="width:${(100 * n) / c.total}%"></span>`,
    )
    .join("");
  root.querySelector("#synth-facts").innerHTML =
    `<span>完成 <b>${((100 * c.complete) / c.total).toFixed(1)}%</b></span><span>已生成帧 <b>${number(s.coverage.completed_variant_frames)} / ${number(s.scope.expected_variant_frames)}</b></span><span>最近1小时 <b>${number(s.throughput.packages_last_hour)}包</b></span><span>队列预计（不含失败） <b>${s.throughput.queued_eta_hours == null ? "—" : number(s.throughput.queued_eta_hours) + "小时"}</b></span>`;
  root.querySelector("#synth-notices").innerHTML =
    `<div class="synth-callout">训练资格待确认 · 辅助拟合待交付${s.dataset === "OakInk2" ? " · 下半身为生成结果" : ""}${s.known_gt_missing.length ? ` · <b>${s.known_gt_missing.length}</b> 个历史包缺GT深度` : ""}</div>`;
  const oak = s.oakink_assets,
    hc = s.hardcases;
  root.querySelector("#synth-cohorts").innerHTML = table(
    ["数据", "规模", "当前口径"],
    [
      `<tr><td>ARCTIC · V006</td><td class="num">${number(s.arctic_render.counts.complete)} / ${number(s.arctic_render.counts.total)}包</td><td>${number(s.arctic_render.scope.source_frames)}源帧；每条动作1份${s.arctic_render.known_gt_missing.length ? "；" + s.arctic_render.known_gt_missing.length + "个历史包缺GT深度" : ""}</td></tr>`,
      `<tr><td>Hard Cases · V006</td><td class="num">${hc.complete} / ${hc.expected}条样例</td><td>${number(hc.frames)}主源帧；三类各5条，独立于主队列</td></tr>`,
      `<tr><td>OakInk2 · V006</td><td class="num">${snapshot.oakink_render ? number(snapshot.oakink_render.counts.complete) + " / " + number(snapshot.oakink_render.counts.total) + "包" : number(oak.total) + "源"}</td><td>${number(oak.counts.COMPLETE || 0)}条人体资产就绪${snapshot.oakink_render ? "；" + number(snapshot.oakink_render.counts.waiting_assets) + "条待上游；每条动作1份" : "；尚无最终合成包计数"}</td></tr>`,
      '<tr><td>GRAB · V005</td><td class="num">1,314源组 / 2,425包</td><td>历史参数附件更新完成；V006新深度尚未据此宣称完成</td></tr>',
    ],
  );
  const selected = root.querySelector("#synth-job-filter");
  selected.value = selectedJobs;
  const jobs = s.jobs.filter(
    (j) =>
      selectedJobs === "all" ||
      (selectedJobs === "failed"
        ? j.state === "FAILED"
        : selectedJobs === "inputs"
          ? j.state === "WAIT_UPSTREAM_ASSET"
          : ["RUNNING", "RECOVERING_DEPTH"].includes(j.state)),
  );
  const multi = s.scope.variants > 1;
  root.querySelector("#synth-jobs").innerHTML = jobs.length
    ? table(
        ["源动作", ...(multi ? ["变体"] : []), "帧数", "存储", "阶段"],
        jobs.map(
          (j) =>
            `<tr><td class="source">${esc(j.source)}</td>${multi ? `<td class="num">${j.variant}</td>` : ""}<td class="num">${number(j.frames)}</td><td>${esc(j.storage || "待准入")}</td><td class="status-text ${j.state === "FAILED" ? "synth-error" : ""}">${esc(phases[j.phase] || j.phase)}</td></tr>`,
        ),
      )
    : '<p class="synth-empty">当前没有此类任务。</p>';
  const gpu = s.hardware.gpus || [];
  root.querySelector("#synth-resources").innerHTML = gpu
    .map(
      (g) =>
        `<dl><dt>GPU ${g.index}</dt><dd>${g.utilization}%</dd><progress aria-label="GPU ${g.index}利用率" max="100" value="${g.utilization}"></progress><dt>显存 GiB</dt><dd>${number(g.used_mib / 1024)} / ${number(g.total_mib / 1024)}</dd></dl>`,
    )
    .join("");
  root.querySelector("#synth-storage").innerHTML =
    `<span>CPU（主机） <b>${number(s.hardware.cpu_percent)}%</b></span><span>SSD预留 <b>${number(s.storage.ssd_reserved_gib)} / ${number(s.storage.ssd_budget_gib)} GiB</b></span><span>SSD可用 <b>${number(s.storage.ssd_available_gib)} GiB</b></span><span>NAS可用 <b>${number(s.storage.nas_available_gib / 1024)} TiB</b></span><span>NAS通道 <b>${s.storage.nas_active} / ${s.storage.nas_limit}</b></span>`;
  root.querySelector("#synth-recent").innerHTML = table(
    ["源动作", ...(multi ? ["变体"] : []), "归档时间"],
    s.recent.map(
      (j) =>
        `<tr><td class="source">${esc(j.source)}</td>${multi ? `<td class="num">${j.variant}</td>` : ""}<td>${clock(j.at)}</td></tr>`,
    ),
  );
}
function versionPage() {
  return `${versionsView(content, versionHistory, selectedVersion)}
      ${section(
        "V006关键执行修订",
        table(
          ["修订", "主题", "变化"],
          content.milestones.map(
            (r) => `<tr>${r.map((x) => `<td>${esc(x)}</td>`).join("")}</tr>`,
          ),
        ),
      )}
      <section class="synth-section"><div class="synth-toolbar"><h2>执行登记簿</h2><input id="synth-registry-search" type="search" aria-label="搜索执行修订" placeholder="版本、模块或状态" value="${esc(registryQuery)}"></div><div class="subtle">登记状态不是实时任务状态；执行修订不等同数据发布版本。</div><div id="synth-registry"></div></section>`;
}
function updateRegistry() {
  const target = root.querySelector("#synth-registry");
  if (!target) return;
  const rows = registry
    .filter((r) =>
      [r.id, r.title, r.status, r.scope]
        .join(" ")
        .toLowerCase()
        .includes(registryQuery.toLowerCase()),
    )
    .slice()
    .reverse();
  registryPage = Math.max(
    0,
    Math.min(registryPage, Math.ceil(rows.length / 25) - 1),
  );
  const start = registryPage * 25;
  target.innerHTML =
    table(
      ["修订", "模块", "登记状态 / 范围"],
      rows
        .slice(start, start + 25)
        .map(
          (r) =>
            `<tr><td class="num">${esc(r.id)}</td><td>${esc(r.title)}</td><td><details><summary>${esc(r.status)}</summary><p>${esc(r.scope || "范围见对应冻结合同。")}</p><p class="mono">SHA256 ${esc(r.sha256)}</p></details></td></tr>`,
        ),
    ) +
    `<div class="synth-pager"><span>${rows.length ? start + 1 : 0}–${Math.min(start + 25, rows.length)} / ${rows.length}</span>${icon("chevron-left", "上一页", "data-registry-prev")}${icon("chevron-right", "下一页", "data-registry-next")}</div>`;
  const prev = target.querySelector("[data-registry-prev]"),
    next = target.querySelector("[data-registry-next]");
  prev.disabled = registryPage === 0;
  next.disabled = start + 25 >= rows.length;
  prev.onclick = () => {
    registryPage--;
    updateRegistry();
  };
  next.onclick = () => {
    registryPage++;
    updateRegistry();
  };
  icons();
}
function readingView() {
  const active = campaignSnapshot(snapshot, selectedCampaign);
  const isOak = active?.dataset === "OakInk2";
  const indexPath = isOak
    ? active.package_index
    : "ARCTIC/packages/final_surface279_v287_20261030/INDEX.json";
  const index = `import json, os\nfrom pathlib import Path\n\nroot = Path(os.environ["EGORENDER_ROOT"])\nindex = json.loads((root / "${indexPath}").read_text())\nfor item in index["complete"]:\n    package = Path(item["package"])\n    meta = json.loads((package / "metadata.json").read_text())\n    print(meta["sequence_index"], meta["frames"], meta["dataset_release"])\n    # complete 是渲染终态；另查深度缺口与辅助标注。`;
  const depth = `from egorender_reader import DepthReader, depth_pair\nimport numpy as np\n\ngt_path, sensor_path = depth_pair(package)\nwith DepthReader(gt_path) as gt, DepthReader(sensor_path) as sensor:\n    assert np.array_equal(gt.frames, sensor.frames)\n    z_gt, valid_gt, source_frame = gt.frame(0)\n    z_sensor, valid_sensor, other_frame = sensor.frame(0)\n    assert source_frame == other_frame\n    # z: float32 米，相机轴向Z；分别使用各自的valid。\n    # 每个DataLoader worker长期持有reader，不逐帧重新打开整个NPZ。`;
  const camera = `with np.load(package / "camera_parameters.npz", allow_pickle=False) as c:\n    source_frames = c["source_frame_index"]\n    K = c["K"]\n    world_to_camera = c["world_to_camera"]\n    camera_to_world = c["camera_to_world"]\n    print(c["camera_coordinates"], c["world_coordinates"])\n    # 先核对坐标约定和K是否逐帧，不额外套一次坐标轴翻转。\n\nfrom egorender_reader import unpack_class_frame\nwith np.load(package / "masks_visible_2bit.npz", allow_pickle=False) as m:\n    width, height = map(int, m["image_size"])\n    classes = unpack_class_frame(m["packed_classes"][0], (height, width))\n    print(m["classes"], m["bitorder"])\n    # 当前常见: 0背景 / 1人体及衣物 / 2交互物体 / 3桌面；以文件为准。`;
  const native = isOak
    ? `descriptor = json.loads((package / "native_mano_descriptor.json").read_text())\nassert descriptor["quaternion_layout"] == "wxyz"\nwith np.load(package / "mano_parameters.npz", allow_pickle=False) as h:\n    print(h.files)  # 保留原始字段，不转成ARCTIC的axis-angle表示\nsource_offsets = np.load(package / "source_offsets.npy", allow_pickle=False)\nwith np.load(package / "native_object_poses.npz", allow_pickle=False) as p:\n    object_ids = p["object_ids"]\n    object_to_oakink = p["object_to_oakink"]\nwith np.load(package / "object_membership.npz", allow_pickle=False) as m:\n    print(m.files)\n# 原始source_offsets与30fps动作索引分别保留。\n# 物体姿态在原始OakInk坐标；按descriptor.transform_chain及metadata.source_to_world变换一次。\nassert meta["lower_motion_is_gt"] is False`
    : `with np.load(package / "mano_parameters.npz", allow_pickle=False) as h:\n    print(h.files)\n    left_pose = h["left_pose"]\n    left_translation = h["left_trans"]\n    source_frames = h["source_frames"]\n    # left/right_rot, pose, trans, shape来自原始数据集参数。\n    # 参数化/手均值/坐标系遵循原始模型与包内来源，不把shape当拟合真值。\n\n# V005辅助附件不是render输入:\nfit_ref = json.loads((legacy_package / "mano_fit_current.json").read_text())\n# 按fit_ref和对应合同加载参数；左手必须搭配V005修正基底。`;
  const relocation = `from egorender_reader import DatasetLocations\n\nloc = DatasetLocations(package / "artifact_locations.json")\n# 给定包内记录的 {"path": ..., "sha256": ...} 引用：\nresolved = loc.read_bound_json(binding)\n# 先检查原JSON字节SHA，再解析历史路径及path-keyed字典。\n# 不覆盖immutable报告，也不要通过字符串替换伪造新SHA。`;
  return `${section(
    "文件与语义",
    table(
      ["通道", "文件", "表示", "读取约束"],
      content.channels.map(
        (r) => `<tr>${r.map((x) => `<td>${esc(x)}</td>`).join("")}</tr>`,
      ),
    ),
  )}
      <section class="synth-section"><div class="synth-toolbar"><h2>Python读取</h2><a href="downloads/egorender_reader.py" download>下载读取器.py</a></div><div class="synth-steps">${code("1. 按包索引定位", index)}${code("2. 两套深度与有效掩码", depth)}${code("3. 相机与可见分割", camera)}${code("4. 原始手参数与辅助拟合分开", native)}${code("5. 历史路径显式解析", relocation)}</div></section>
      ${section("训练边界", content.quality.map((q, i) => `<details ${i === 0 ? "open" : ""}><summary>${["完成与训练资格", "公开split与视角", "历史深度格式", "防止变体泄漏", "模拟传感器边界", "数据许可"][i]}</summary><p>${esc(q)}</p></details>`).join(""))}
      ${section("来源", `<div class="synth-links">${content.references.map(([name, url]) => `<a href="${esc(url)}" target="_blank" rel="noopener noreferrer">${esc(name)}</a>`).join("")}</div>`)}`;
}
function samplesView() {
  return `${section("Hard Cases · V006", `<div class="synth-facts"><span>三类各 <b>5</b> 条</span><span><b>10,838</b> 主源帧</span><span>执行修订 <b>320</b></span></div><div class="synth-samples">${content.samples.map((s) => `<figure><a href="${esc(s.image)}" target="_blank" rel="noopener"><img src="${esc(s.image)}" alt="${esc(s.title)}的实际合成场景预览" loading="lazy"></a><figcaption><b>${esc(s.title)}</b><small>${esc(s.source)}</small><p>${esc(s.note)}</p></figcaption></figure>`).join("")}</div>`)}
      <div class="synth-callout">这些是同源动作的历史参考帧，不是当前全部随机变体的逐帧验收。镜面样例在完整生产前另外加入固定种子的污渍材质。</div>
      ${section(
        "样本组织",
        table(
          ["类别", "场景来源", "读取差异"],
          [
            "<tr><td>bimanual_crossing</td><td>公开源动作中的真实双手交叉</td><td>不改变原始手部运动来制造交叉</td></tr>",
            "<tr><td>mirror_reflection</td><td>真实镜面几何与反射</td><td>镜面深度为物理首交点；反射的人不新增instance</td></tr>",
            "<tr><td>multiple_people</td><td>多个源人体及各自衣物</td><td>检查scene_instances.json的每人源时钟；主源帧数不能直接当所有演员帧总数</td></tr>",
          ],
        ),
      )}`;
}
function paint() {
  if (!root || !content) return;
  const body =
    tab() === "versions"
      ? versionPage()
      : tab() === "reading"
        ? readingView()
        : tab() === "samples"
          ? samplesView()
          : progressView();
  root.innerHTML = header() + body;
  root.querySelector("#synth-refresh").onclick = () => refresh();
  root.querySelector("#synth-campaign").onchange = (event) => {
    selectedCampaign = event.target.value;
    if (tab() === "reading") {
      paint();
      return;
    }
    updateFreshness();
    updateProgress();
  };
  const filter = root.querySelector("#synth-job-filter");
  if (filter)
    filter.onchange = () => {
      selectedJobs = filter.value;
      updateProgress();
    };
  const search = root.querySelector("#synth-registry-search");
  if (search)
    search.oninput = () => {
      registryQuery = search.value;
      registryPage = 0;
      updateRegistry();
    };
  root.querySelectorAll("[data-copy]").forEach(
    (b) =>
      (b.onclick = async () => {
        try {
          await navigator.clipboard.writeText(
            b.parentNode.querySelector("code").textContent,
          );
          b.title = "已复制";
          b.setAttribute("aria-label", "已复制");
        } catch (_) {
          b.title = "复制失败";
        }
      }),
  );
  updateFreshness();
  updateProgress();
  updateRegistry();
  icons();
}
async function refresh() {
  if (!content || !root || request) return;
  const own = generation,
    button = root.querySelector("#synth-refresh");
  button.disabled = true;
  const controller = new AbortController();
  request = controller;
  const timeout = setTimeout(() => controller.abort(), 10000);
  try {
    const response = await fetch(content.status_url + "?t=" + Date.now(), {
      cache: "no-store",
      signal: controller.signal,
    });
    if (!response.ok) throw new Error("HTTP");
    const value = await response.json();
    if (!valid(value)) throw new Error("schema");
    if (own !== generation) return;
    if (!snapshot || value.collected_at >= snapshot.collected_at)
      snapshot = value;
    updateFreshness();
    updateProgress();
  } catch (_) {
    if (own === generation) updateFreshness(true);
  } finally {
    clearTimeout(timeout);
    if (request === controller) request = null;
    if (own === generation && root)
      root.querySelector("#synth-refresh").disabled = false;
  }
}
function unmount() {
  generation++;
  clearInterval(timer);
  clearInterval(ageTimer);
  if (request) request.abort();
  request = null;
  root = null;
}
async function mount() {
  root = document.getElementById("synthetic-root");
  selectedVersion = versionFromHash(location.hash);
  const own = generation;
  try {
    if (!content) {
      const responses = await Promise.all(
        ["egorender", "egorender-registry", "egorender-progress", "egorender-versions"].map((n) =>
          fetch("data/" + n + ".json"),
        ),
      );
      if (!responses[0].ok || !responses[3].ok) throw new Error("content");
      versionHistory = await responses[3].json();
      content = await responses[0].json();
      registry = responses[1].ok ? await responses[1].json() : [];
      const cached = responses[2].ok ? await responses[2].json() : null;
      if (
        valid(cached) &&
        (!snapshot || cached.collected_at > snapshot.collected_at)
      )
        snapshot = cached;
    }
    if (own !== generation || !root) return;
    paint();
    refresh();
    timer = setInterval(refresh, 60000);
    ageTimer = setInterval(() => updateFreshness(), 15000);
  } catch (_) {
    if (root)
      root.innerHTML =
        '<p class="synth-error">合成数据文档暂不可用，请刷新重试。</p>';
  }
}
export default {
  render: () =>
    '<section class="view synth" id="synthetic-root"><div class="synth-skeleton">正在读取合成数据…</div></section>',
  mount,
  unmount,
};