1 files changed, 16 insertions, 3 deletions

diff --git a/src/api/dashboard/dashboard.html b/src/api/dashboard/dashboard.html
index 5ab5ac8..3b0f8fa 100644
--- a/src/api/dashboard/dashboard.html
+++ b/src/api/dashboard/dashboard.html
@@ -77,6 +77,7 @@
     border-radius: 50%; background: var(--fg); }
   .legend .node.silent::before { background: var(--panel); }
   .legend .node.self::before { border-color: var(--self); background: var(--self); }
+  .legend .node.dormant-node::before { border: 2.5px solid var(--bad); }
   .legend .node.focus::before { width: 14px; height: 14px; background: none;
     border: 2px solid var(--self); opacity: .5; }
   .scroll { overflow: auto; min-height: 0; }
@@ -130,6 +131,7 @@
       <span class="node self">this node</span>
       <span class="node">reports its links</span>
       <span class="node silent">reports none (no LINKS_REPLY)</span>
+      <span class="node dormant-node">dormant (to this node)</span>
       <span class="node focus">in focus (click a node)</span>
     </div>
     <div class="legend" id="legend"></div>
@@ -373,10 +375,17 @@ function edges() {
       const knownTimed = known && typeof known.link.rttMs === "number";
       if (!known || (timed && !knownTimed) ||
           (timed === knownTimed && report.secsAgo < known.secsAgo)) {
-        measured.set(key, { a, b: link.peer, link, secsAgo: report.secsAgo });
+        measured.set(key, { a, b: link.peer, link, secsAgo: report.secsAgo,
+          dormant: link.dormant || (known && known.dormant) });
+      } else if (link.dormant) {
+        known.dormant = true;
       }
     }
   }
+  // Dormant if either end holds the other so, whichever report is drawn.
+  for (const edge of measured.values()) {
+    if (edge.dormant && !edge.link.dormant) edge.link = { ...edge.link, dormant: true };
+  }
   return { intended, measured };
 }
 
@@ -548,11 +557,15 @@ function renderGraph() {
       children.push(svg("circle", { cx: p.x, cy: p.y, r: 13, fill: "none",
         stroke: "var(--self)", "stroke-width": 2, "stroke-opacity": .5 }));
     }
+    // Dormant as this node sees it (`/peers`): a red outline.
+    const dormant = (state.peers.peers[id] || {}).status === "dormant";
     const circle = svg("circle", { cx: p.x, cy: p.y, r: member.self ? 8 : 6,
       fill: member.self ? "var(--self)" : reported ? "var(--fg)" : "var(--panel)",
-      stroke: member.self ? "var(--self)" : "var(--fg)", "stroke-width": 1.5 });
+      stroke: member.self ? "var(--self)" : dormant ? "var(--bad)" : "var(--fg)",
+      "stroke-width": dormant ? 2.5 : 1.5 });
     const title = svg("title");
-    title.textContent = id + (reported ? "" : " (no links reported)");
+    title.textContent = id + (reported ? "" : " (no links reported)") +
+      (dormant ? " (dormant)" : "");
     circle.append(title);
     circle.addEventListener("click", event => { event.stopPropagation(); focus(id); });
     hoverable(circle, id);