thurview 0.7.0 → 0.8.1

package/dist/ui/app.js

@@ -162,6 +162,17 @@
   init_dom();
 
   // src/ui/state.ts
+  var VIEWS = {
+    review: ["review", "commits", "files", "map"],
+    explainer: ["review", "map", "coverage"]
+  };
+  function kind() {
+    return state.data?.review.kind === "explainer" ? "explainer" : "review";
+  }
+  function view() {
+    const allowed = VIEWS[kind()];
+    return allowed.includes(state.view) ? state.view : allowed[0];
+  }
   var NARROW = "(max-width: 900px)";
   function isNarrow() {
     return window.matchMedia(NARROW).matches;
@@ -196,16 +207,16 @@
     if (t.type === "map") return `map \xB7 ${t.node}`;
     return "review";
   }
-  function navigate(view, params = {}) {
+  function navigate(view2, params = {}) {
     const p = new URLSearchParams();
     for (const [k, v] of Object.entries(params)) if (v !== void 0 && v !== "") p.set(k, String(v));
     const q = p.toString();
-    location.hash = `#/${view}${q ? `?${q}` : ""}`;
+    location.hash = `#/${view2}${q ? `?${q}` : ""}`;
   }
   function readHash() {
     const m2 = /^#\/(\w+)(?:\?(.*))?$/.exec(location.hash);
-    const view = m2?.[1] ?? "review";
-    state.view = ["review", "commits", "files", "map"].includes(view) ? view : "review";
+    const v = m2?.[1] ?? "review";
+    state.view = ["review", "commits", "files", "map", "coverage"].includes(v) ? v : "review";
     state.params = new URLSearchParams(m2?.[2] ?? "");
   }
   function isTerminal() {
@@ -484,12 +495,14 @@
   }
   function submitDialog() {
     const pending = (state.data?.threads ?? []).filter((t) => !t.submitted).length;
+    const explainer = kind() === "explainer";
+    const words = explainer ? { title: "Send this back or finish", accept: "Done reading", back: "Send it back" } : { title: "Submit review", accept: "Approve", back: "Request changes" };
     const ta = h("textarea", { rows: 4, placeholder: "Summary for the agent (optional)" });
     const d = dialog(
       h(
         "div",
         null,
-        h("h3", null, "Submit review"),
+        h("h3", null, words.title),
         h(
           "p",
           { class: "muted" },
@@ -502,11 +515,14 @@
           h("button", { class: "ghost", onclick: () => d.close() }, "Cancel"),
           h(
             "button",
-            { title: "End the review without approving it", onclick: () => decide("close") },
+            {
+              title: explainer ? "End it without reading it through" : "End the review without approving it",
+              onclick: () => decide("close")
+            },
             "Close"
           ),
-          h("button", { onclick: () => decide("request-changes") }, "Request changes"),
-          h("button", { class: "ok", onclick: () => decide("approve") }, "Approve")
+          h("button", { onclick: () => decide("request-changes") }, words.back),
+          h("button", { class: "ok", onclick: () => decide("approve") }, words.accept)
         )
       )
     );
@@ -788,7 +804,7 @@
     const frame = h("div", { class: "code" });
     const draw = () => {
       frame.innerHTML = "";
-      const bar = (dir) => {
+      const bar2 = (dir) => {
         const can = dir === "up" ? p.from > 1 : p.to < p.total;
         return h(
           "div",
@@ -800,7 +816,7 @@
           ) : h("span", { class: "muted" }, dir === "up" ? "start of file" : "end of file")
         );
       };
-      frame.appendChild(bar("up"));
+      frame.appendChild(bar2("up"));
       frame.appendChild(
         codeTable({
           path: p.path,
@@ -811,7 +827,7 @@
           commentable: true
         })
       );
-      frame.appendChild(bar("down"));
+      frame.appendChild(bar2("down"));
     };
     const expand = async (dir) => {
       if (dir === "up") {
@@ -901,12 +917,12 @@
       } else {
         g.appendChild(svg("line", { x1, y1: y, x2: x2 + (x2 > x1 ? -4 : 4), y2: y }));
       }
-      const label = svg(
+      const label2 = svg(
         "text",
         { x: self ? x1 + 36 : (x1 + x2) / 2, y: y - 6, "text-anchor": self ? "start" : "middle" },
         `${i + 1}. ${m2.label}`
       );
-      label.addEventListener("click", (e) => {
+      label2.addEventListener("click", (e) => {
         if (m2.anchor) openAnchor(m2.anchor);
         else if (m2.code)
           popover(
@@ -918,7 +934,7 @@
             { x: e.pageX, y: e.pageY + 8 }
           );
       });
-      g.appendChild(label);
+      g.appendChild(label2);
       el.appendChild(g);
     });
     return h("div", { class: "diagram" }, h("div", { class: "dhead" }, b.label), el);
@@ -1067,7 +1083,9 @@
       );
       return;
     }
-    root.appendChild(interfaceDelta(doc.interfaces));
+    root.appendChild(
+      kind() === "explainer" ? coveragePanel(state.data?.coverage ?? null) : interfaceDelta(doc.interfaces)
+    );
     const layout = h("div", { class: "doc-layout" });
     const toc = h(
       "nav",
@@ -1140,6 +1158,7 @@
     docEl.querySelectorAll(".block.heading").forEach((el) => io.observe(el));
   }
   var DELTA_BLOCK = "interface-delta";
+  var COVERAGE_BLOCK = "coverage";
   var DELTA_SHOWN = 12;
   var CHANGE_CLASS = {
     removed: "del",
@@ -1216,6 +1235,71 @@
       wrap.appendChild(h("div", { class: "thread-pins" }, threads.map(threadPinRow)));
     return wrap;
   }
+  function coveragePanel(cov) {
+    const wrap = h("div", { class: "block ifd", "data-block": COVERAGE_BLOCK });
+    const threads = threadsFor((t) => t.type === "document" && t.blockId === COVERAGE_BLOCK);
+    if (threads.length) wrap.classList.add("has-threads");
+    const actions = h(
+      "div",
+      { class: "block-actions" },
+      h(
+        "button",
+        {
+          class: threads.length ? "count" : "",
+          title: "Comment on coverage",
+          onclick: (e) => {
+            if (state.viewingRevision !== null) return;
+            popover(commentPopover({ type: "document", blockId: COVERAGE_BLOCK }), {
+              x: e.pageX + 10,
+              y: e.pageY
+            });
+          }
+        },
+        threads.length ? String(threads.length) : "+"
+      )
+    );
+    const body = h("div", { class: "ifd-body" });
+    const toggle = h("span", { class: "heading-toggle" }, "hide");
+    toggle.addEventListener("click", () => {
+      const hidden = body.hidden;
+      body.hidden = !hidden;
+      toggle.textContent = hidden ? "hide" : "show";
+    });
+    wrap.appendChild(
+      h(
+        "div",
+        { class: "ifd-head" },
+        h("span", { class: "t" }, "Coverage"),
+        cov ? h("span", { class: "badge" }, `${cov.states.uncovered} not examined`) : null,
+        h("span", { class: "spacer" }),
+        toggle,
+        actions
+      )
+    );
+    body.appendChild(
+      h(
+        "p",
+        { class: "ifd-verdict" },
+        cov ? cov.verdict : "Unavailable: coverage could not be derived for this revision."
+      )
+    );
+    body.appendChild(
+      h(
+        "p",
+        { class: "ifd-verdict" },
+        "A codebase does not fit in one document, so this one selects. ",
+        h(
+          "button",
+          { class: "small", onclick: () => navigate("coverage") },
+          "See what it left out \u25B8"
+        )
+      )
+    );
+    wrap.appendChild(body);
+    if (threads.length)
+      wrap.appendChild(h("div", { class: "thread-pins" }, threads.map(threadPinRow)));
+    return wrap;
+  }
   function interfaceRow(e) {
     return h(
       "div",
@@ -1416,15 +1500,15 @@
       list.appendChild(
         h("div", { class: "empty-state" }, "No changed files: base and head are the same commit.")
       );
-    const view = h("div", { class: "file-view", "data-path": path });
-    root.appendChild(h("div", { class: "files-layout" }, list, view));
-    if (path) void renderDiff(view, path);
+    const view2 = h("div", { class: "file-view", "data-path": path });
+    root.appendChild(h("div", { class: "files-layout" }, list, view2));
+    if (path) void renderDiff(view2, path);
   }
-  async function renderDiff(view, path) {
+  async function renderDiff(view2, path) {
     const inChanges = state.data?.changes.some((c) => c.path === path);
     const line = Number(state.params.get("line") ?? 0);
     const side2 = state.params.get("side") === "base" ? "base" : "head";
-    view.appendChild(h("div", { class: "muted", style: { padding: "12px" } }, "Loading\u2026"));
+    view2.appendChild(h("div", { class: "muted", style: { padding: "12px" } }, "Loading\u2026"));
     let d;
     try {
       if (inChanges) d = await api.diff(state.id, path);
@@ -1453,11 +1537,11 @@
         };
       }
     } catch (e) {
-      view.innerHTML = "";
-      view.appendChild(h("div", { class: "empty-state" }, e.message));
+      view2.innerHTML = "";
+      view2.appendChild(h("div", { class: "empty-state" }, e.message));
       return;
     }
-    view.innerHTML = "";
+    view2.innerHTML = "";
     const split = state.splitDiff && inChanges && !isNarrow();
     const toggle = h(
       "button",
@@ -1466,8 +1550,8 @@
         onclick: () => {
           state.splitDiff = !state.splitDiff;
           localStorage.setItem("thurview.split", state.splitDiff ? "1" : "0");
-          view.innerHTML = "";
-          void renderDiff(view, path);
+          view2.innerHTML = "";
+          void renderDiff(view2, path);
         }
       },
       state.splitDiff ? "Unified" : "Split"
@@ -1475,7 +1559,7 @@
     const fileThreads = (state.data?.threads ?? []).filter(
       (t) => t.target.type === "file" && t.target.path === path && t.target.line === 0
     );
-    view.appendChild(
+    view2.appendChild(
       h(
         "div",
         { class: "file-head" },
@@ -1502,7 +1586,7 @@
       )
     );
     if (fileThreads.length)
-      view.appendChild(
+      view2.appendChild(
         h(
           "div",
           { class: "thread-pins", style: { margin: "8px 14px" } },
@@ -1510,15 +1594,15 @@
         )
       );
     if (d.binary) {
-      view.appendChild(h("div", { class: "empty-state" }, "Binary file"));
+      view2.appendChild(h("div", { class: "empty-state" }, "Binary file"));
       return;
     }
     const threads = (state.data?.threads ?? []).filter(
       (t) => t.target.type === "file" && t.target.path === path
     );
     const el = split ? splitView(d, threads) : unifiedView(d, threads);
-    view.appendChild(el);
-    codeSelectionHandler(view);
+    view2.appendChild(el);
+    codeSelectionHandler(view2);
     if (line) {
       const tr = el.querySelector(`tr[data-${side2}="${line}"]`);
       if (tr) {
@@ -1878,9 +1962,21 @@
   var statusClass = (s) => s === "added" ? "ok" : s === "removed" ? "del" : "warn";
   function renderMap(root) {
     const map = state.data?.map;
+    const explainer = kind() === "explainer";
     if (!map || !map.head.nodes.length) {
       append(root, [
-        h(
+        explainer ? h(
+          "div",
+          { class: "empty-state" },
+          h("p", null, "No map in this explainer."),
+          h(
+            "p",
+            null,
+            "The map is where an explainer carries breadth: it places the parts the prose ",
+            "had no room for. Without one, every file the document does not anchor counts ",
+            "as not examined on the Coverage tab."
+          )
+        ) : h(
           "div",
           { class: "empty-state" },
           h("p", null, "No map in this review."),
@@ -1909,7 +2005,29 @@
       level = id;
       draw();
     };
-    const intro = () => {
+    const intro2 = () => {
+      if (explainer)
+        return h(
+          "div",
+          { class: "map-intro" },
+          h("h2", null, "The parts of the system"),
+          h(
+            "p",
+            null,
+            "The document carries depth on the parts it selected; this carries breadth over the",
+            " rest \u2014 what the parts are, what they own, and what they connect to at the pinned",
+            " commit. Open a part to see its files, its code and its neighbours."
+          ),
+          h(
+            "div",
+            { class: "map-route" },
+            h(
+              "button",
+              { class: "small", onclick: () => navigate("coverage") },
+              "What this explainer left out \u25B8"
+            )
+          )
+        );
       const counts = [
         [map.diff.added.length, "ok", "added"],
         [map.diff.changed.length, "warn", "changed"],
@@ -1965,7 +2083,7 @@
       return h(
         "div",
         {
-          class: `map-node ${n.status} ${touched(all, n) ? "" : "quiet"} ${n.id === selected ? "selected" : ""}`,
+          class: `map-node ${n.status} ${explainer || touched(all, n) ? "" : "quiet"} ${n.id === selected ? "selected" : ""}`,
           onclick: () => navigate("map", { node: n.id }),
           ondblclick: () => inside && openLevel(n.id)
         },
@@ -2003,6 +2121,7 @@
         title ? h("h3", null, title) : null,
         h("div", { class: "map-grid" }, items.map(card))
       ) : null;
+      if (explainer) return group(null, kids) ?? h("div", null);
       if (!hot.length)
         return h(
           "div",
@@ -2017,7 +2136,7 @@
         group("Context \u2014 unchanged here", cold)
       );
     };
-    const links = () => {
+    const links2 = () => {
       const here = new Set(childrenOf(all, level, map.filesByNode).map((k) => k.id));
       const top = (id) => {
         let x = id;
@@ -2041,7 +2160,7 @@
         h(
           "div",
           { class: "muted map-note" },
-          "A link touching a changed part is where the two sides can fall out of step."
+          explainer ? "A link is a dependency the parts have on each other, drawn as the author declared it." : "A link touching a changed part is where the two sides can fall out of step."
         ),
         rankEdges(folded, all).map(
           ({ edge, touchesChange }) => h(
@@ -2065,7 +2184,7 @@
     };
     const draw = () => {
       canvas.innerHTML = "";
-      append(canvas, [intro(), crumbs(), board(), links()]);
+      append(canvas, [intro2(), crumbs(), board(), links2()]);
       drawSide();
     };
     const drawSide = () => {
@@ -2076,7 +2195,7 @@
           h(
             "div",
             { class: "muted" },
-            "Pick a part to see what changed in it, the code behind it, and what it connects to."
+            explainer ? "Pick a part to see what it owns, the code behind it, and what it connects to." : "Pick a part to see what changed in it, the code behind it, and what it connects to."
           )
         );
         return;
@@ -2182,12 +2301,282 @@
     draw();
   }
 
+  // src/ui/views/coverage.ts
+  init_dom();
+  var SHOWN = 8;
+  function renderCoverage(root) {
+    const cov = state.data?.coverage;
+    if (!cov) {
+      append(root, [
+        h(
+          "div",
+          { class: "empty-state" },
+          h("p", null, "No coverage recorded for this revision."),
+          h("p", null, "Coverage is derived when an explainer is published.")
+        )
+      ]);
+      return;
+    }
+    append(root, [intro(cov), clusters(cov), links(cov), sharedNames(cov), unread(cov)]);
+  }
+  function bar(cov) {
+    const total = Math.max(cov.files.total, 1);
+    const seg = (n, cls, label2) => n ? h("span", {
+      class: `cov-seg ${cls}`,
+      style: { width: `${n / total * 100}%` },
+      title: `${n} ${label2}`
+    }) : null;
+    return h(
+      "div",
+      { class: "cov-bar" },
+      seg(cov.states.explained, "explained", "anchored in the document"),
+      seg(cov.states.placed, "placed", "placed on the map only"),
+      seg(cov.states.uncovered, "uncovered", "not examined")
+    );
+  }
+  function intro(cov) {
+    const key = [
+      [cov.states.explained, "explained", "anchored in the document"],
+      [cov.states.placed, "placed", "placed on the map only"],
+      [cov.states.uncovered, "uncovered", "not examined"]
+    ];
+    return h(
+      "div",
+      { class: "cov-intro" },
+      h("h2", null, "What this explainer covers"),
+      h(
+        "p",
+        null,
+        "A codebase does not fit in a short document, so this one selects. Here is the",
+        " selection, counted rather than claimed: every file in scope at the pinned commit,",
+        " and which of the three states it is in."
+      ),
+      bar(cov),
+      h(
+        "div",
+        { class: "cov-key" },
+        key.map(
+          ([n, cls, label2]) => h("span", { class: "cov-key-item" }, h("i", { class: `cov-dot ${cls}` }), `${n} ${label2}`)
+        )
+      ),
+      h(
+        "div",
+        { class: "cov-facts" },
+        fact("scope", cov.scope === "**" ? "the whole repository" : cov.scope),
+        fact("commit", cov.commit.slice(0, 12)),
+        fact("files in scope", String(cov.files.total)),
+        fact("read by the code graph", `${cov.files.inGraph} of ${cov.files.total}`),
+        cov.unresolved ? fact("references the graph could not place", String(cov.unresolved)) : null,
+        cov.truncated ? fact("file list capped", "the graph is partial; treat every count as a floor") : null
+      )
+    );
+  }
+  function fact(label2, value) {
+    return h("div", { class: "cov-fact" }, h("b", null, value), h("span", { class: "muted" }, label2));
+  }
+  function fileList(files, cls) {
+    if (!files.length) return null;
+    const wrap = h("div", { class: `cov-files ${cls}` });
+    const chip = (f) => h("code", { class: "cov-file", title: f }, f.split("/").slice(-2).join("/"));
+    files.slice(0, SHOWN).forEach((f) => wrap.appendChild(chip(f)));
+    const rest = files.slice(SHOWN);
+    if (rest.length) {
+      const more = h(
+        "button",
+        {
+          class: "small ghost",
+          onclick: () => more.replaceWith(...rest.map(chip))
+        },
+        `show ${rest.length} more`
+      );
+      wrap.appendChild(more);
+    }
+    return wrap;
+  }
+  function clusterRow(c) {
+    const anchors = state.data?.document?.anchors ?? {};
+    const firstAnchor = c.explained.length ? Object.values(anchors).find((a) => a.peek && c.explained.includes(a.peek.file)) : void 0;
+    return h(
+      "div",
+      { class: "cov-cluster" },
+      h(
+        "div",
+        { class: "cov-cluster-head" },
+        h("code", { class: "cov-label" }, c.label),
+        h("span", { class: "muted" }, `${c.files} files \xB7 ${c.symbols} symbols`),
+        h("span", { class: "spacer" }),
+        c.explained.length ? h("span", { class: "badge cov-b-explained" }, `${c.explained.length} anchored`) : null,
+        c.placed.length ? h("span", { class: "badge cov-b-placed" }, `${c.placed.length} placed`) : null,
+        c.uncovered.length ? h("span", { class: "badge cov-b-uncovered" }, `${c.uncovered.length} not examined`) : null,
+        firstAnchor ? h("button", { class: "small", onclick: () => openAnchorPeek(firstAnchor) }, "Peek code \u25B8") : null
+      ),
+      c.hubs.length ? h(
+        "div",
+        { class: "muted cov-hubs" },
+        "most referenced here: ",
+        c.hubs.map((n) => h("code", null, n))
+      ) : null,
+      fileList(c.uncovered, "uncovered")
+    );
+  }
+  function clusters(cov) {
+    return h(
+      "div",
+      { class: "cov-section" },
+      h("h3", null, "By part of the system"),
+      h(
+        "p",
+        { class: "muted" },
+        "Files clustered by how they reference each other at the pinned commit, largest first.",
+        " The files listed under a part are the ones this explainer never examined."
+      ),
+      cov.clusters.map(clusterRow)
+    );
+  }
+  function links(cov) {
+    if (!cov.links.length) return null;
+    return h(
+      "div",
+      { class: "cov-section" },
+      h("h3", null, "What reaches what"),
+      h(
+        "p",
+        { class: "muted" },
+        "References that cross from one part to another, with how many there are.",
+        " A pair marked both ways references each other in both directions."
+      ),
+      h(
+        "div",
+        { class: "cov-links" },
+        cov.links.slice(0, 24).map(
+          (l) => h(
+            "div",
+            { class: "cov-link" },
+            h("code", null, label(cov, l.from)),
+            h("span", { class: "muted" }, "\u2192"),
+            h("code", null, label(cov, l.to)),
+            h("span", { class: "muted mono" }, `${l.references} refs`),
+            l.bothWays ? h("span", { class: "badge" }, "both ways") : null
+          )
+        )
+      )
+    );
+  }
+  function label(cov, id) {
+    return cov.clusters.find((c) => c.id === id)?.label ?? id;
+  }
+  function sharedNames(cov) {
+    if (!cov.sharedNames.length) return null;
+    return h(
+      "div",
+      { class: "cov-section" },
+      h("h3", null, "Names defined in more than one part"),
+      h(
+        "p",
+        { class: "muted" },
+        `${cov.sharedNamesTotal} name${cov.sharedNamesTotal === 1 ? " at this commit is" : "s at this commit are"}`,
+        " defined in two or more parts. What that means here - the same idea in two places,",
+        " two different ideas sharing a word, or a name too common to mean anything - is",
+        " what the code says and this page does not."
+      ),
+      h(
+        "div",
+        { class: "cov-shared" },
+        cov.sharedNames.map(
+          (n) => h(
+            "div",
+            { class: "cov-link" },
+            h("code", null, n.name),
+            h("span", { class: "muted mono" }, `${n.clusters.length} parts`),
+            h("span", { class: "muted" }, n.files.join(" \xB7 "))
+          )
+        )
+      )
+    );
+  }
+  function unread(cov) {
+    if (!cov.outsideGraph.length && !cov.files.capped && !cov.owners.length) return null;
+    return h(
+      "div",
+      { class: "cov-section" },
+      h("h3", null, "Outside the code graph"),
+      cov.outsideGraph.length ? h(
+        "div",
+        null,
+        h(
+          "p",
+          { class: "muted" },
+          `${cov.files.outsideGraph} files in scope are not in a language the graph reads,`,
+          " so they are in no part above. They are absent from the structure, not empty."
+        ),
+        h(
+          "div",
+          { class: "cov-links" },
+          cov.outsideGraph.slice(0, 16).map(
+            (e) => h(
+              "div",
+              { class: "cov-link" },
+              h("code", null, `.${e.extension}`),
+              h("span", { class: "muted mono" }, `${e.files} files`)
+            )
+          )
+        ),
+        fileList(
+          cov.unclustered.filter((u) => u.state === "uncovered" && u.reason === "outsideGraph").map((u) => u.file),
+          "uncovered"
+        )
+      ) : null,
+      cov.files.capped ? h(
+        "div",
+        null,
+        h(
+          "p",
+          { class: "muted" },
+          `${cov.files.capped} files in scope are in a language the graph reads, but the`,
+          " repo-wide file cap was hit before this scope was read, so they were never parsed."
+        ),
+        fileList(
+          cov.unclustered.filter((u) => u.state === "uncovered" && u.reason === "capped").map((u) => u.file),
+          "uncovered"
+        )
+      ) : null,
+      cov.owners.length ? h(
+        "div",
+        null,
+        h("h4", null, "What each map node owns"),
+        h(
+          "p",
+          { class: "muted" },
+          "A file counts as placed because a map node's globs match it. The globs are here",
+          " so a broad one is visible rather than silently inflating the count."
+        ),
+        h(
+          "div",
+          { class: "cov-links" },
+          cov.owners.map(
+            (o) => h(
+              "div",
+              {
+                class: "cov-link",
+                onclick: () => navigate("map", { node: o.node }),
+                style: { cursor: "pointer" }
+              },
+              h("code", null, o.node),
+              h("span", { class: "muted" }, o.globs.join(" ")),
+              h("span", { class: "muted mono" }, `${o.files} files`)
+            )
+          )
+        )
+      ) : null
+    );
+  }
+
   // src/ui/app.ts
   var app = document.getElementById("app");
   async function home() {
     clear(app);
     const reviews = await api.reviews();
-    const el = h("div", { class: "home" }, h("h2", null, "Reviews"));
+    const el = h("div", { class: "home" }, h("h2", null, "Reviews and explainers"));
     const active = reviews.filter((r) => !r.dismissed);
     const dismissed = reviews.filter((r) => r.dismissed);
     const item = (r) => h(
@@ -2196,16 +2585,16 @@
       h("span", { class: "t" }, r.title),
       h("span", { class: `badge ${statusClass2(r.status)}` }, r.status),
       r.openThreads ? h("span", { class: "badge accent" }, `${r.openThreads} open`) : null,
-      h(
-        "span",
-        { class: "muted mono", style: { fontSize: "12px" } },
-        r.binding.kind === "pr" ? `PR #${r.binding.name}` : r.binding.name
-      ),
+      h("span", { class: "muted mono", style: { fontSize: "12px" } }, bindingLabel(r)),
       h("span", { class: "muted", style: { fontSize: "12px" } }, timeAgo(r.updatedAt))
     );
     if (!active.length)
       el.appendChild(
-        h("div", { class: "empty-state" }, "No reviews. Ask your agent to scaffold and publish one.")
+        h(
+          "div",
+          { class: "empty-state" },
+          "Nothing published yet. Ask your agent for a review of a change, or an explainer of the codebase."
+        )
       );
     active.forEach((r) => el.appendChild(item(r)));
     if (dismissed.length) {
@@ -2214,6 +2603,11 @@
     }
     app.appendChild(el);
   }
+  function bindingLabel(r) {
+    if (r.binding.kind === "pr") return `PR #${r.binding.name}`;
+    if (r.binding.kind === "codebase") return r.binding.name === "**" ? "codebase" : r.binding.name;
+    return r.binding.name;
+  }
   function statusClass2(s) {
     return s === "accepted" ? "ok" : s === "awaiting-agent-updates" ? "warn" : s === "closed" ? "del" : s === "awaiting-review" ? "accent" : "";
   }
@@ -2253,12 +2647,16 @@
     const r = d.review;
     const pending = d.threads.filter((t) => !t.submitted).length;
     const open = d.threads.filter((t) => t.status === "open").length;
-    const tabs = [
-      ["review", "Review"],
-      ["commits", "Commits"],
-      ["files", `Files${d.changes.length ? ` (${d.changes.length})` : ""}`],
-      ["map", "Map"]
-    ];
+    const explainer = kind() === "explainer";
+    const labels = {
+      review: explainer ? "Explainer" : "Review",
+      commits: "Commits",
+      files: `Files${d.changes.length ? ` (${d.changes.length})` : ""}`,
+      map: "Map",
+      coverage: "Coverage"
+    };
+    const current2 = view();
+    const tabs = VIEWS[kind()].map((v) => [v, labels[v]]);
     const revSel = h("select", {
       class: "small",
       style: { font: "inherit", fontSize: "12px" },
@@ -2289,7 +2687,7 @@
           style: { fontSize: "12px" },
           title: `${r.pins.base} \u2192 ${r.pins.head}`
         },
-        r.binding.kind === "pr" ? `PR #${r.binding.name}` : r.binding.name
+        bindingLabel(r)
       )
     ]);
     const actions = h("div", { class: "bar-row bar-actions" }, [
@@ -2297,7 +2695,7 @@
         "div",
         { class: "tabs" },
         tabs.map(
-          ([v, label]) => h("button", { class: v === state.view ? "active" : "", onclick: () => navigate(v) }, label)
+          ([v, label2]) => h("button", { class: v === current2 ? "active" : "", onclick: () => navigate(v) }, label2)
         )
       ),
       h("span", { class: "spacer" }),
@@ -2382,7 +2780,7 @@
       h(
         "div",
         { class: "item muted" },
-        `base ${r.pins.base.slice(0, 12)} \xB7 head ${r.pins.head.slice(0, 12)}`
+        kind() === "explainer" ? `commit ${r.pins.head.slice(0, 12)}` : `base ${r.pins.base.slice(0, 12)} \xB7 head ${r.pins.head.slice(0, 12)}`
       ),
       h(
         "div",
@@ -2395,7 +2793,7 @@
   function renderCenter() {
     const scroll = center.scrollTop;
     clear(center);
-    switch (state.view) {
+    switch (view()) {
       case "review":
         renderReview(center);
         break;
@@ -2408,6 +2806,9 @@
       case "map":
         renderMap(center);
         break;
+      case "coverage":
+        renderCoverage(center);
+        break;
     }
     center.scrollTop = scroll;
   }