@monster-orange/den 0.2.4 → 0.2.5

package/src/ui/server/index.ts

@@ -10,7 +10,10 @@
  *   GET /api/run?pillar=X&...    — SSE stream: runs tests, emits output line-by-line
  */
 
-import { composeHealthCmd } from "../../shared/stacks/manifest-commands.js";
+import {
+  composeHealthTarget,
+  type ComposeHealthTarget,
+} from "../../shared/stacks/compose-health.js";
 import { healthCheckFields } from "./health-row.js";
 import { hasRuntime, repoKind } from "../../shared/repo-kind.js";
 import * as http from "http";
@@ -60,7 +63,8 @@ import {
 } from "./log-history.js";
 import {
   pingHttp,
-  pingShell,
+  pingShellCheck,
+  TimeoutStreaks,
   prewarmHealthTls,
 } from "../../shared/environment-manager/health.js";
 import {
@@ -167,7 +171,10 @@ interface HealthResult {
   repoPath: string;
   mode: "dev-managed" | "managed";
   isEntrypoint: boolean;
+  /** true up; false a completed check failed (down); null not known. */
   ok: boolean | null;
+  /** With ok null: a check ran but has not answered (pending, not down). */
+  pending?: boolean;
   status?: number;
   error?: string;
   /** Where the app opens for this env (open-in-new-tab), or null. */
@@ -209,9 +216,23 @@ function viewerRewrite(
 }
 
 const HEALTH_CACHE_TTL_MS = 8_000;
+/** Consecutive timed-out health cycles per check (see TimeoutStreaks). */
+const healthTimeouts = new TimeoutStreaks();
 const healthCache = new Map<string, { results: HealthResult[]; at: number }>();
-/** The full-env health run in flight per cache key: concurrent polls join it. */
-const healthInFlight = new Map<string, Promise<HealthResult[]>>();
+/**
+ * The full-env health run in flight per cache key. Concurrent polls and
+ * streams join it (a stream replays what already landed, then follows), so
+ * each cycle runs every check once: a second concurrent run doubled the
+ * shell checks' processes and pushed them past their budget under load.
+ */
+const healthInFlight = new Map<
+  string,
+  {
+    run: Promise<HealthResult[]>;
+    landed: HealthResult[];
+    listeners: Set<(r: HealthResult) => void>;
+  }
+>();
 /** /api/services builds, shared by concurrent polls and reused briefly. */
 /** The startup sweep of stale daemon records (see below the routes). */
 let startupPrune: Promise<void> = Promise.resolve();
@@ -918,6 +939,8 @@ async function handleRequest(
       org: string;
       /** Codes that count as up for a remote target.url probe. */
       expect?: Expect;
+      /** pingShell options (Den's own `stack health` can report unknown). */
+      compose: ComposeHealthTarget | null;
       meta: Pick<HealthResult, "runs" | "target">;
     }> = [];
     let edgeDomain: string | null = null;
@@ -950,6 +973,7 @@ async function handleRequest(
           openUrl: null,
           links: [],
           org: orgOf(resolved.repoName, catalog),
+          compose: null,
           meta: { runs: "none", target: null },
         });
         continue;
@@ -957,9 +981,9 @@ async function handleRequest(
       const svcCfg = manifest.services?.[resolved.subsystem];
       // A compose-run repo with no declared check gets the stack's own health
       // (container state + Docker healthchecks), as `den status` does.
-      const composeHealth =
+      const compose =
         env === "local"
-          ? composeHealthCmd(
+          ? composeHealthTarget(
               manifest,
               resolved.subsystem,
               resolved.repoName,
@@ -972,7 +996,7 @@ async function handleRequest(
         manifest,
         resolved.subsystem,
         env,
-        composeHealth,
+        compose?.cmd ?? null,
       );
       const healthCfg = plan.check;
       const remote = plan.placement.runs === "remote";
@@ -1031,6 +1055,7 @@ async function handleRequest(
         links: linksFor(manifest, resolved.subsystem, env),
         org: orgOf(resolved.repoName, catalog),
         ...(plan.expect ? { expect: plan.expect } : {}),
+        compose,
         meta: { runs: plan.placement.runs, target: plan.placement.target },
       });
     }
@@ -1060,12 +1085,18 @@ async function handleRequest(
       conventional,
       meta,
       expect,
+      compose,
     }) => {
       if (checkType !== "none") {
         const started = Date.now();
         const ping =
           checkType === "shell"
-            ? await pingShell(target, awsProfileEnv(env), repoPath)
+            ? await pingShellCheck(
+                target,
+                awsProfileEnv(env),
+                repoPath,
+                compose,
+              )
             : await pingHttp(
                 target,
                 env === "local" && meta.runs !== "remote"
@@ -1083,7 +1114,11 @@ async function handleRequest(
           isEntrypoint,
           ...meta,
           ms: Date.now() - started,
-          ...ping,
+          // A first timeout is pending; a repeat on the next cycle is down.
+          ...healthTimeouts.judge(
+            `${env}|${repo}|${service}|${checkType}|${target}`,
+            ping,
+          ),
         };
       }
       // No declared health check: try the conventional probe when eligible.
@@ -1136,6 +1171,37 @@ async function handleRequest(
     return results;
   }
 
+  /** Join the full-env health run in flight for (env, workspace), or start one. */
+  function sharedHealthRun(env: Environment, workspace: string | null) {
+    const key = healthCacheKey(env, workspace);
+    const inFlight = healthInFlight.get(key);
+    if (inFlight) return inFlight;
+    const landed: HealthResult[] = [];
+    const listeners = new Set<(r: HealthResult) => void>();
+    const run = computeHealth(
+      env,
+      null,
+      (r) => {
+        landed.push(r);
+        for (const l of listeners)
+          try {
+            l(r);
+          } catch {
+            /* a gone client must not stop the run */
+          }
+      },
+      workspace,
+    )
+      .then((results) => {
+        healthCache.set(key, { results, at: Date.now() });
+        return results;
+      })
+      .finally(() => healthInFlight.delete(key));
+    const shared = { run, landed, listeners };
+    healthInFlight.set(key, shared);
+    return shared;
+  }
+
   // Full-env health, cached. Every page navigation used to re-run all 30 checks
   // from scratch — and the slowest are shell probes that shell out to the aws
   // CLI (~0.45s each) — so the dots took ~0.6s to resolve on EVERY switch. A
@@ -1162,17 +1228,10 @@ async function handleRequest(
     if (hit && Date.now() - hit.at < HEALTH_CACHE_TTL_MS) {
       return sendJson(res, hit.results.map(forViewer));
     }
-    let run = healthInFlight.get(cacheKey);
-    if (!run) {
-      run = computeHealth(env, null, undefined, wsParam)
-        .then((results) => {
-          healthCache.set(cacheKey, { results, at: Date.now() });
-          return results;
-        })
-        .finally(() => healthInFlight.delete(cacheKey));
-      healthInFlight.set(cacheKey, run);
-    }
-    return sendJson(res, (await run).map(forViewer));
+    return sendJson(
+      res,
+      (await sharedHealthRun(env, wsParam).run).map(forViewer),
+    );
   }
 
   // Same checks, streamed: each result is sent the moment it lands so the fast
@@ -1204,13 +1263,16 @@ async function handleRequest(
     }
 
     try {
-      const results = await computeHealth(
-        env,
-        null,
-        (r) => send({ type: "result", result: forViewer(r) }),
-        wsParam,
-      );
-      healthCache.set(cacheKey, { results, at: Date.now() });
+      const shared = sharedHealthRun(env, wsParam);
+      const forward = (r: HealthResult): void =>
+        send({ type: "result", result: forViewer(r) });
+      for (const r of shared.landed) forward(r);
+      shared.listeners.add(forward);
+      try {
+        await shared.run;
+      } finally {
+        shared.listeners.delete(forward);
+      }
       send({ type: "done", cached: false });
     } catch (e) {
       send({ type: "error", error: (e as Error).message });

package/src/ui/server/public/changelog-view.js

@@ -0,0 +1,16 @@
+/**
+ * What the version pop-up shows: the newest release only, or every
+ * version once the reader asks for them, plus the one button that toggles
+ * between the two (null when there is nothing earlier to show).
+ */
+export function changelogView(entries, showAll) {
+  const list = Array.isArray(entries) ? entries : [];
+  const earlier = list.length - 1;
+  if (earlier < 1) return { shown: list.slice(0, 1), toggle: null };
+  return {
+    shown: showAll ? list : list.slice(0, 1),
+    toggle: showAll
+      ? { label: "Show latest only", expanded: true }
+      : { label: `Show all versions (${earlier} earlier)`, expanded: false },
+  };
+}

package/src/ui/server/public/header.js

@@ -15,6 +15,7 @@ import {
   buildWorkspaceMenuModel,
   buildWorkspacePillModel,
 } from "./workspace-picker.js";
+import { changelogView } from "./changelog-view.js";
 
 // 5s between polls — measured from each poll's COMPLETION (schedulePoll
 // re-arms after renderHealthDots resolves), so slow probes can't overlap.
@@ -80,6 +81,8 @@ function _injectNavStyles() {
 const LS_CHANGELOG_SEEN = "__DEN_CLI__-changelog-seen";
 let _changelogEntries = [];
 let _changelogInjected = false;
+/** The pop-up lists every version only after the reader asks. */
+let _clShowAll = false;
 
 function _injectChangelogStyles() {
   if (_changelogInjected) return;
@@ -134,6 +137,7 @@ function _injectChangelogStyles() {
     .cl-entry { margin-bottom: 18px; }
     .cl-ver-row { display: flex; align-items: baseline; gap: 8px; margin-bottom: 8px; }
     .cl-ver {
+      margin: 0;
       font-family: var(--mono, monospace); font-size: 13px; font-weight: 700;
       color: var(--accent, #58a6ff);
     }
@@ -166,6 +170,13 @@ function _injectChangelogStyles() {
       display: inline-flex; align-items: center; justify-content: center;
       transition: color .1s, border-color .1s;
     }
+    .cl-more-btn {
+      margin-right: auto; padding: 4px 12px;
+      font: inherit; font-size: 11px; color: var(--muted, #8b949e);
+      background: none; border: 1px solid var(--border, #30363d); border-radius: 6px;
+      cursor: pointer;
+    }
+    .cl-more-btn:hover { color: var(--accent, #58a6ff); border-color: var(--accent, #58a6ff); }
     .cl-copy-btn:hover { color: var(--accent, #58a6ff); border-color: var(--accent, #58a6ff); }
     .cl-copy-btn.copied { color: #3fb950; border-color: #3fb950; }
     .cl-slack-btn:hover { color: #e01e5a; border-color: #e01e5a; }
@@ -189,12 +200,18 @@ function _injectChangelogStyles() {
   overlay.id = "cl-overlay";
   overlay.className = "cl-overlay";
   overlay.innerHTML =
-    '<div class="cl-box">' +
-    '<div class="cl-hdr"><h3>What\'s new</h3><button class="cl-close" id="cl-close-btn" title="Close">×</button></div>' +
+    '<div class="cl-box" role="dialog" aria-modal="true" aria-labelledby="cl-title">' +
+    '<div class="cl-hdr"><h3 id="cl-title" tabindex="-1">What\'s new</h3><button type="button" class="cl-close" id="cl-close-btn" title="Close" aria-label="Close">×</button></div>' +
     '<div class="cl-body" id="cl-body"></div>' +
-    '<div class="cl-footer"><button class="cl-got-it" id="cl-got-it-btn">Got it</button></div>' +
+    '<div class="cl-footer"><button type="button" class="cl-more-btn" id="cl-more" aria-controls="cl-body" aria-expanded="false" hidden></button><button class="cl-got-it" id="cl-got-it-btn">Got it</button></div>' +
     "</div>";
   document.body.appendChild(overlay);
+  document.getElementById("cl-more")?.addEventListener("click", () => {
+    _clShowAll = !_clShowAll;
+    _renderChangelogBody(_changelogEntries);
+    const body = document.getElementById("cl-body");
+    if (body) body.scrollTop = 0;
+  });
 
   overlay.addEventListener("click", (e) => {
     if (e.target === overlay) window.closeChangelog();
@@ -207,10 +224,44 @@ function _injectChangelogStyles() {
     ?.addEventListener("click", () => window.closeChangelog());
 
   document.addEventListener("keydown", (e) => {
+    if (!_changelogIsOpen()) return;
     if (e.key === "Escape") window.closeChangelog();
+    else if (e.key === "Tab") _trapChangelogTab(e);
   });
 }
 
+function _changelogIsOpen() {
+  return !!document.getElementById("cl-overlay")?.classList.contains("open");
+}
+
+/** The dialog's focusable controls, in order (hidden ones excluded). */
+function _changelogFocusables() {
+  const box = document.querySelector("#cl-overlay .cl-box");
+  if (!box) return [];
+  return [...box.querySelectorAll("button, a[href], [tabindex]")].filter(
+    (el) => !el.hidden && el.getAttribute("tabindex") !== "-1",
+  );
+}
+
+/** Keep Tab inside the open dialog (aria-modal). */
+function _trapChangelogTab(e) {
+  const els = _changelogFocusables();
+  if (!els.length) return;
+  const first = els[0];
+  const last = els[els.length - 1];
+  const inside = els.includes(document.activeElement);
+  if (e.shiftKey && (document.activeElement === first || !inside)) {
+    e.preventDefault();
+    last.focus();
+  } else if (!e.shiftKey && (document.activeElement === last || !inside)) {
+    e.preventDefault();
+    first.focus();
+  }
+}
+
+/** What had focus before the dialog opened; it gets it back on close. */
+let _clReturnFocus = null;
+
 function _renderChangelogBody(entries) {
   const body = document.getElementById("cl-body");
   if (!body) return;
@@ -228,22 +279,25 @@ function _renderChangelogBody(entries) {
     escHtml(s)
       .replace(/\*\*([^*]+)\*\*/g, "<strong>$1</strong>")
       .replace(/`([^`]+)`/g, "<code>$1</code>");
-  body.innerHTML = entries
+  const view = changelogView(entries, _clShowAll);
+  body.innerHTML = view.shown
     .map(
       (entry, i) =>
         (i > 0 ? '<hr class="cl-divider">' : "") +
         '<div class="cl-entry">' +
         '<div class="cl-ver-row">' +
-        '<span class="cl-ver">v' +
+        '<h4 class="cl-ver">v' +
         escHtml(entry.version) +
-        "</span>" +
+        "</h4>" +
         '<span class="cl-date">' +
         escHtml(entry.date) +
         "</span>" +
         '<div class="cl-copy-group">' +
         '<button class="cl-copy-btn" data-cl-version="' +
         escHtml(entry.version) +
-        '" title="Copy as Markdown">' +
+        '" title="Copy as Markdown" aria-label="Copy v' +
+        escHtml(entry.version) +
+        ' as Markdown">' +
         '<svg width="13" height="13" viewBox="0 0 13 13" fill="none" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">' +
         '<rect x="4" y="0.5" width="8.5" height="8.5" rx="1.5"/>' +
         '<path d="M8.5 9v2.5a1 1 0 0 1-1 1H1a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h2.5"/>' +
@@ -251,7 +305,9 @@ function _renderChangelogBody(entries) {
         "</button>" +
         '<button class="cl-slack-btn" data-cl-version="' +
         escHtml(entry.version) +
-        '" title="Copy for Slack">' +
+        '" title="Copy for Slack" aria-label="Copy v' +
+        escHtml(entry.version) +
+        ' for Slack">' +
         '<svg width="13" height="13" viewBox="0 0 13 13" fill="none" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">' +
         '<path d="M1 2a1 1 0 0 1 1-1h9a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1H7.5L5 12v-3H2a1 1 0 0 1-1-1V2z"/>' +
         "</svg>" +
@@ -290,6 +346,17 @@ function _renderChangelogBody(entries) {
     )
     .join("");
 
+  // The toggle lives in the footer, so it is in view however long the
+  // newest entry is.
+  const more = document.getElementById("cl-more");
+  if (more) {
+    more.hidden = !view.toggle;
+    if (view.toggle) {
+      more.textContent = view.toggle.label;
+      more.setAttribute("aria-expanded", String(view.toggle.expanded));
+    }
+  }
+
   const _slackIcon =
     '<svg width="13" height="13" viewBox="0 0 13 13" fill="none" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">' +
     '<path d="M1 2a1 1 0 0 1 1-1h9a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1H7.5L5 12v-3H2a1 1 0 0 1-1-1V2z"/>' +
@@ -455,15 +522,39 @@ function _buildMarkdown(entry) {
 }
 
 window.openChangelog = function () {
+  _clShowAll = false;
   _injectChangelogStyles();
   _renderChangelogBody(_changelogEntries);
   const overlay = document.getElementById("cl-overlay");
-  if (overlay) overlay.classList.add("open");
+  if (!overlay) return;
+  if (!overlay.classList.contains("open")) {
+    // A first-visit auto-open has nothing focused: return to the pill.
+    const active = document.activeElement;
+    _clReturnFocus =
+      active && active !== document.body
+        ? active
+        : document.getElementById("version-pill");
+  }
+  overlay.classList.add("open");
+  // After .open: while the overlay is display:none the body cannot scroll,
+  // and a reset made then does not stick. Always open at the newest release.
+  const body = document.getElementById("cl-body");
+  if (body) body.scrollTop = 0;
+  // The heading first, so a screen reader starts at the latest notes.
+  document.getElementById("cl-title")?.focus();
 };
 
 window.closeChangelog = function () {
   const overlay = document.getElementById("cl-overlay");
+  const wasOpen = !!overlay?.classList.contains("open");
   if (overlay) overlay.classList.remove("open");
+  if (wasOpen) {
+    const back = _clReturnFocus?.isConnected
+      ? _clReturnFocus
+      : document.getElementById("version-pill");
+    _clReturnFocus = null;
+    back?.focus();
+  }
   if (_changelogEntries[0]?.version) {
     try {
       localStorage.setItem(LS_CHANGELOG_SEEN, _changelogEntries[0].version);
@@ -490,6 +581,17 @@ export async function initChangelog() {
   if (pill && latest?.version) {
     pill.querySelector(".v-txt").textContent = "v" + latest.version;
   }
+  // The pill names the running build (0.2.5-dev.2, not the changelog's
+  // newest heading, 0.2.5), so a prerelease under test says what it is.
+  fetch("/api/server-info")
+    .then((r) => r.json())
+    .then((info) => {
+      const txt = pill?.querySelector(".v-txt");
+      if (txt && typeof info?.version === "string" && info.version) {
+        txt.textContent = "v" + info.version;
+      }
+    })
+    .catch(() => {});
 
   let lastSeen = null;
   try {
@@ -1043,7 +1145,9 @@ function _repoHealthItem(repo, items, escAttr) {
     const state = ok === true ? "ok" : ok === false ? "err" : "";
     const tip =
       ok == null
-        ? "no health check"
+        ? error
+          ? `${what} — ${error}`
+          : "no health check"
         : error
           ? `${what} — ${error}`
           : `${what} → ${status}`;
@@ -1063,14 +1167,19 @@ function _repoHealthItem(repo, items, escAttr) {
     overallState = entry.ok === true ? "ok" : entry.ok === false ? "err" : "";
     tip =
       entry.ok == null
-        ? "no health check"
+        ? entry.error
+          ? `${entry.url ?? entry.check} — ${entry.error}`
+          : "no health check"
         : entry.error
           ? `${entry.url ?? entry.check} — ${entry.error}`
           : `${entry.url ?? entry.check} → ${entry.status}`;
   } else {
+    // Only a completed, failed check (ok false) is down; ok null (no check,
+    // or no answer yet) is unknown and never turns the dot red.
     const allOk = items.every((i) => i.ok === true);
     const anyOk = items.some((i) => i.ok === true);
-    overallState = allOk ? "ok" : anyOk ? "running" : "err";
+    const anyDown = items.some((i) => i.ok === false);
+    overallState = allOk ? "ok" : anyOk ? "running" : anyDown ? "err" : "";
     tip = `${items.length} services`;
   }
   return `<div class="health-item" title="${escAttr(tip)}">

package/src/ui/server/ui-assets.ts

@@ -19,6 +19,7 @@ export const UI_MODULES: readonly string[] = [
   "/graph-model.js",
   "/panel.js",
   "/graph.css",
+  "/changelog-view.js",
 ];
 
 /** URL path → file inside node_modules. */

package/src/ui/server/workspace-routes.ts

@@ -90,6 +90,7 @@ import {
 } from "../../shared/environment-manager/catalog.js";
 import { getReposRoot, readUserConfig } from "../../shared/den-config.js";
 import { getDistRoot } from "../../shared/paths.js";
+import { recordRemovedFromWorkspace } from "../../shared/environment-manager/default-workspace.js";
 import { getSudoEnv, prewarmSudo } from "./sudo-store.js";
 import {
   devManagedPaths,
@@ -994,6 +995,12 @@ export async function handleWorkspaceRoutes(
         // Delete exact match, or all subsystem entries for the repo
         // (handles both bare-key workspaces like "shop" and
         //  explicit-subsystem workspaces like "shop/api", "shop/db").
+        // Removal is deliberate: top-up must never bring the repo back.
+        recordRemovedFromWorkspace(
+          file,
+          wsName,
+          parseAddress(address, catalog).repoName,
+        );
         if (services[address] !== undefined) {
           delete services[address];
         } else {