dashboard: figures root in title

1 files changed, 23 insertions, 14 deletions

diff --git a/src/api/dashboard/dashboard.html b/src/api/dashboard/dashboard.html
index 8bec226..9a395bb 100644
--- a/src/api/dashboard/dashboard.html
+++ b/src/api/dashboard/dashboard.html
@@ -655,7 +655,7 @@ function reachesCell(reaches, ours, id) {
 }
 
 // --- Figures: a tree, its open branches kept across renders ---
-const open = new Set(["stats", "peer", "links", "from", "to", "paths", "paths.destination"]);
+const open = new Set(["links", "from", "to", "paths", "paths.destination"]);
 // As the page it was opened from had them (`handOver`).
 if (handOver && Array.isArray(handOver.figures)) {
   open.clear();
@@ -787,20 +787,29 @@ function renderStats() {
   }
   if (focused === null) {
     what.textContent = name(state.node.id) + " (this node)";
-    shown = [tree("stats", state.stats, "stats")];
-  } else {
-    // Its alias (if it has one) and its node ID, in full.
-    const alias = (state.graph.members[focused] || {}).alias ||
-      (state.peers.peers[focused] || {}).alias;
-    what.replaceChildren(...(alias ? [alias, " "] : []), el("span", { class: "id" }, focused));
-    const peer = state.peers.peers[focused];
-    const report = state.graph.measured[focused];
-    shown = [];
-    if (peer) shown.push(tree("peer", peer, "peer"));
-    else shown.push(el("div", { class: "key leaf" }, "Not a peer of this node."));
-    if (report) shown.push(tree("links", report, "links"));
+    // Its stats are the box: their keys at the top level, how many in the title.
+    const entries = Object.entries(state.stats || {});
+    shown = entries.map(([k, v]) => tree(k, v, "stats." + k));
+    title.replaceChildren("Figures: ", what,
+      el("span", { class: "count" }, describe({ type: "map", size: entries.length })));
+    retitle(title, title.textContent);
+    document.getElementById("stats").replaceChildren(...shown);
+    return;
   }
-  title.replaceChildren(focused === null ? "Figures: " : "Peer: ", what);
+  // Its alias (if it has one) and its node ID, in full.
+  const alias = (state.graph.members[focused] || {}).alias ||
+    (state.peers.peers[focused] || {}).alias;
+  what.replaceChildren(...(alias ? [alias, " "] : []), el("span", { class: "id" }, focused));
+  const peer = state.peers.peers[focused];
+  const report = state.graph.measured[focused];
+  // Its `/peers` entry is the box, as this node's stats are: its keys at the top level,
+  // and after them the links the member reports.
+  const entries = Object.entries(peer || {});
+  shown = entries.map(([k, v]) => tree(k, v, "peer." + k));
+  if (!peer) shown.push(el("div", { class: "key leaf" }, "Not a peer of this node."));
+  if (report) shown.push(tree("links", report, "links"));
+  title.replaceChildren("Peer: ", what, ...(peer ? [el("span", { class: "count" },
+    describe({ type: "map", size: entries.length + (report ? 1 : 0) }))] : []));
   retitle(title, title.textContent);
   document.getElementById("stats").replaceChildren(...shown);
 }