@azure-id/orc 0.56.1 → 1.1.0

package/bin/webui/js/panels/lanes.js

@@ -0,0 +1,259 @@
+"use strict";
+/* panels/lanes.js — orc ui client
+   The `orc lane` noun, rendered: which lanes exist, which SHARED phases each
+   one runs, and the whole call catalogue.
+
+   Loaded by app.html in the order its numeric prefix names. Classic
+   script, no import/export: an ES module import carries no query string,
+   and every static request here needs the per-launch session token. */
+
+
+/* =================================================================== LANES == */
+
+// TWO TABS, on this panel's own precedent (Crosslink's two, Knowledge's five,
+// Extra's six). Phases and Calls answer two different questions about the same
+// noun — what a lane READS, in order, and what a lane RUNS — and stacking both
+// down one column made the second one something you had to know was there.
+//
+// The tab survives a re-render, exactly as `KN_TAB` and `EX_TAB` do: losing
+// your place because a fetch resolved is the small rudeness that makes a panel
+// feel unreliable.
+let LN_TAB = "phases";
+// The selected lane likewise. A lane picker that snaps back to `orc` every time
+// the panel repaints is a picker nobody uses twice.
+let LN_LANE = "orc";
+
+PANELS.lanes = function (host) {
+  head(host, t("lanes.title"), t("lanes.sub"));
+  section(
+    host,
+    () => read("/api/lanes").then((r) => r.data),
+    (d) => {
+      const out = frag();
+      const lanes = d.lanes || [];
+      if (!lanes.length) {
+        out.append(el("div", "empty", t("lanes.none")));
+        return out;
+      }
+      if (!lanes.some((l) => l.lane === LN_LANE)) LN_LANE = lanes[0].lane;
+
+      const body = el("div", "stack");
+      const paint = () => {
+        body.replaceChildren();
+        if (LN_TAB === "phases") phasesTab(body, lanes);
+        else callsTab(body);
+      };
+
+      // The panel's own `.tabs` convention: a flat strip driven by
+      // `aria-selected`, exactly as Knowledge and Runs build theirs. Keys are
+      // written out IN FULL rather than assembled from the tab id — a key built
+      // from a fragment is invisible to every check that looks for one.
+      const strip = el("div", "tabs");
+      const select = (which) => {
+        LN_TAB = which;
+        for (const b of strip.children) b.setAttribute("aria-selected", String(b.dataset.tab === which));
+        paint();
+      };
+      for (const [which, label] of [
+        ["phases", t("lanes.tab.phases")],
+        ["calls", t("lanes.tab.calls")],
+      ]) {
+        const b = el("button", null, label);
+        b.type = "button";
+        b.dataset.tab = which;
+        b.setAttribute("aria-selected", String(which === LN_TAB));
+        b.addEventListener("click", () => select(which));
+        strip.append(b);
+      }
+      out.append(strip, body);
+      paint();
+      return out;
+    }
+  );
+};
+
+/* ------------------------------------------------------------------ phases -- */
+
+function phasesTab(host, lanes) {
+  const picker = card(t("lanes.picker.title"));
+  picker.append(el("div", "note", t("lanes.picker.note")));
+
+  const sel = el("select", "text-input");
+  sel.setAttribute("aria-label", t("lanes.picker.aria"));
+  for (const l of lanes) {
+    const o = el("option", null, l.lane + (l.command ? "  " + l.command : ""));
+    o.value = l.lane;
+    if (l.lane === LN_LANE) o.selected = true;
+    sel.append(o);
+  }
+  picker.append(sel);
+  host.append(picker);
+
+  const slot = el("div", "stack");
+  host.append(slot);
+
+  const load = () => {
+    slot.replaceChildren(skeleton(3));
+    read("/api/lane/phases?lane=" + encodeURIComponent(LN_LANE))
+      .then((r) => slot.replaceChildren(phasesCard(r.data)))
+      .catch((e) => slot.replaceChildren(failBox(e)));
+  };
+  sel.addEventListener("change", () => {
+    LN_LANE = sel.value;
+    load();
+  });
+  load();
+}
+
+function phasesCard(d) {
+  const one = (d.lanes || [])[0];
+  const c = card(t("lanes.phases.title"));
+  if (!one) {
+    c.append(el("div", "empty", t("lanes.phases.unknown")));
+    return c;
+  }
+
+  // The trace tier and token are the CLI's words for how this lane narrates.
+  // They belong at the top because every phase below closes into one of them.
+  const meta = el("div", "lane-meta");
+  meta.append(el("span", "lane-meta-label", t("lanes.phases.trace")));
+  if (one.trace_tier) meta.append(chip(one.trace_tier));
+  if (one.trace_token) meta.append(chip("lane token " + one.trace_token, "lane"));
+  c.append(meta);
+
+  const phases = one.phases || [];
+  if (!phases.length) {
+    // AN EMPTY ANSWER IS AN ANSWER (v0.43.0). Five lanes keep their pipeline in
+    // their own spine on purpose, so "no shared phases" is a fact about this
+    // lane and not a fetch that failed. Saying nothing here would make the two
+    // look identical.
+    c.append(el("div", "empty", t("lanes.phases.inSpine")));
+    return c;
+  }
+
+  for (const p of phases) {
+    const row = el("div", "phase-row");
+    row.append(el("span", "phase-ord", String(p.ord)));
+
+    const mid = el("div", "phase-mid");
+    mid.append(el("div", "phase-id", p.id));
+    // A row names a FILE or a HEADING, never both and never neither — the
+    // manifest rule the two-way lint enforces. Whichever it is, it is a CLI
+    // string and is printed verbatim.
+    if (p.file) mid.append(el("div", "phase-file", p.file));
+    if (p.heading) mid.append(el("div", "phase-file", p.heading));
+    if ((p.calls || []).length) {
+      const calls = el("div", "phase-calls");
+      calls.append(el("span", "phase-calls-label", t("lanes.phases.calls")));
+      for (const id of p.calls) calls.append(chip(id, "lane"));
+      mid.append(calls);
+    }
+    row.append(mid);
+
+    const right = el("div", "phase-right");
+    // `when` is one of the CLI's own words (`always`, `on-phase`,
+    // `compile-time`, …). It is never softened into "sometimes".
+    if (p.when) right.append(chip(p.when, p.when === "always" ? "ok" : null));
+    if (p.read) right.append(el("div", "phase-read", p.read));
+    if ((p.layers || []).length) right.append(el("div", "phase-layers", p.layers.join(" · ")));
+    row.append(right);
+
+    if (p.optional_when) row.append(el("div", "phase-why", p.optional_when));
+    c.append(row);
+  }
+
+  if ((d.phase_files || []).length || (d.layer_set || []).length) {
+    const foot = el("div", "note");
+    foot.append(document.createTextNode(t("lanes.phases.foot")));
+    c.append(foot);
+  }
+  return c;
+}
+
+/* ------------------------------------------------------------------- calls -- */
+
+function callsTab(host) {
+  const slot = el("div", "stack");
+  host.append(slot);
+  slot.replaceChildren(skeleton(4));
+  read("/api/lane/calls")
+    .then((r) => slot.replaceChildren(callsCard(r.data)))
+    .catch((e) => slot.replaceChildren(failBox(e)));
+}
+
+function callsCard(d) {
+  const calls = d.calls || [];
+  const c = card(t("lanes.calls.title", { n: calls.length }));
+  c.append(el("div", "note", t("lanes.calls.note")));
+  if (!calls.length) {
+    c.append(el("div", "empty", t("lanes.calls.none")));
+    return c;
+  }
+
+  for (const call of calls) {
+    // EXPANDS IN PLACE, one row at a time — the Runs-row rule (v0.43.6). A
+    // detail box below a list means reading a row and then looking somewhere
+    // else for what it said.
+    const row = el("div", "call-row");
+    const h = el("button", "call-head");
+    h.type = "button";
+    h.setAttribute("aria-expanded", "false");
+    h.append(el("span", "call-caret", "▸"));
+    h.append(el("span", "call-cmd", call.cmd));
+    if (call.cost) h.append(chip(call.cost, call.cost === "free" ? "ok" : "warn"));
+    h.append(el("span", "call-lanes-n", tn((call.lanes || []).length, "lanes.calls.lanes")));
+
+    const detail = el("div", "call-detail");
+    detail.hidden = true;
+    // Every string below is the CLI's registry text and is never translated: it
+    // names commands, exit codes and reference files by their real ids.
+    const rows = [];
+    if (call.what) rows.push([t("lanes.calls.what"), call.what]);
+    if (call.when) rows.push([t("lanes.calls.when"), call.when]);
+    if (call.on_absent) rows.push([t("lanes.calls.onAbsent"), call.on_absent]);
+    if (call.never) rows.push([t("lanes.calls.never"), call.never]);
+    if (call.canonical) rows.push([t("lanes.calls.canonical"), call.canonical]);
+    detail.append(kvList(rows));
+
+    // The exit codes are a CONTRACT, so they are drawn as a table rather than
+    // folded into a sentence — a lane branches on these numbers.
+    const exits = call.exits || {};
+    const codes = Object.keys(exits);
+    if (codes.length) {
+      const ex = el("div", "call-exits");
+      ex.append(el("span", "call-exits-label", t("lanes.calls.exits")));
+      for (const code of codes) ex.append(el("span", "call-exit", code + " = " + exits[code]));
+      detail.append(ex);
+    }
+    if ((call.states || []).length) {
+      const st = el("div", "call-exits");
+      st.append(el("span", "call-exits-label", t("lanes.calls.states")));
+      for (const s of call.states) st.append(chip(s));
+      detail.append(st);
+    }
+    if ((call.lanes || []).length) {
+      const ls = el("div", "call-lane-chips");
+      ls.append(el("span", "call-exits-label", t("lanes.calls.calledBy")));
+      for (const l of call.lanes) ls.append(chip(l, "lane"));
+      detail.append(ls);
+    }
+
+    h.addEventListener("click", () => {
+      const open = h.getAttribute("aria-expanded") === "true";
+      // ONE ROW OPEN AT A TIME, the Runs-row rule again: thirty open rows is
+      // the wall this panel replaced.
+      for (const other of c.querySelectorAll(".call-head[aria-expanded='true']")) {
+        other.setAttribute("aria-expanded", "false");
+        other.parentElement.querySelector(".call-detail").hidden = true;
+      }
+      if (!open) {
+        h.setAttribute("aria-expanded", "true");
+        detail.hidden = false;
+      }
+    });
+
+    row.append(h, detail);
+    c.append(row);
+  }
+  return c;
+}

package/bin/webui/js/panels/overview.js

@@ -54,6 +54,16 @@ const FINDING_ROUTE = {
   // evicts the old package first), and `upgrade` is an action row on
   // MAINTENANCE — so that is genuinely the panel that can clear it.
   "legacy-global-package": { panel: "maintenance", cta: "overview.item.legacyGlobalPackage.cta" },
+  // v1.0.0 W5. The rule again: a demoted run is cleared by `orc extra promote`,
+  // and Recovery is the Extra tab where every other journal-shaped state is
+  // already rendered — so that is genuinely the panel that can clear it.
+  "extra-demoted-run": { panel: "extra", cta: "overview.item.extraDemotedRun.cta" },
+  // v1.0.0 W16. An INSTALL-FOOTPRINT finding, so it takes the documented
+  // default rather than an interesting exception: the thing that clears it is
+  // `orc update`, which is an action row on MAINTENANCE. It is spelled out
+  // rather than left to DEFAULT_FINDING_ROUTE because the CTA is specific --
+  // a reader who sees "lane config drifted" should be told which button.
+  "lane-keys-drifted": { panel: "maintenance", cta: "overview.item.laneKeysDrifted.cta" },
 };
 const DEFAULT_FINDING_ROUTE = { panel: "maintenance", cta: "overview.item.doctor.cta" };
 const findingRoute = (id) => FINDING_ROUTE[id] || DEFAULT_FINDING_ROUTE;

package/bin/webui/js/panels/settings.js

@@ -17,8 +17,8 @@
 // keys stay GREPPABLE: a build of a string key from a fragment is a key no
 // coverage check can see, and the check is the only thing standing between a
 // renamed key and a raw dotted string on somebody's screen.
-const TIER_LABEL_KEY = { common: "settings.tier.common", fable5: "settings.tier.fable5", advanced: "settings.tier.advanced" };
-const TIER_DESC_KEY = { common: "settings.tierDesc.common", fable5: "settings.tierDesc.fable5", advanced: "settings.tierDesc.advanced" };
+const TIER_LABEL_KEY = { common: "settings.tier.common", advanced: "settings.tier.advanced" };
+const TIER_DESC_KEY = { common: "settings.tierDesc.common", advanced: "settings.tierDesc.advanced" };
 const TIER_LABEL = (tier) => (TIER_LABEL_KEY[tier] ? t(TIER_LABEL_KEY[tier]) : tier);
 const TIER_DESC = (tier) => (TIER_DESC_KEY[tier] ? t(TIER_DESC_KEY[tier]) : "");
 
@@ -162,6 +162,12 @@ async function renderSettings(body) {
   // flips — which is how the precedence rule gets taught rather than described.
   out.append(ladderCard(d.score_table));
 
+  // WHO DECIDES WHAT (v1.0.0 W16). The ladder above answers one family;
+  // this answers all of them, and it is the picture a flat key list cannot
+  // draw: a contested setting is not decided by the key you are looking at,
+  // it is decided by the highest rank that resolved.
+  out.append(ranksCard(d.families, d.families_resolved, d.rank_states));
+
   // 36 keys in three flat lists is a wall, and the answer to "where is the one
   // I want" was scrolling. Each tier is now its own collapsible card, and the
   // toolbar filters across ALL of them at once — so finding a key never depends
@@ -169,7 +175,7 @@ async function renderSettings(body) {
   const tiers = [];
   out.append(settingsToolbar(d, tiers));
 
-  for (const tier of ["common", "fable5", "advanced"]) {
+  for (const tier of ["common", "advanced"]) {
     const keys = d.keys.filter((k) => k.tier === tier);
     if (!keys.length) continue;
 
@@ -234,6 +240,32 @@ async function renderSettings(body) {
     out.append(c);
   }
 
+  // A key ORC REMOVED, still sitting in the user's file. It is NOT an editable
+  // setting and it is NOT a hand-edited override, so it gets its own block —
+  // rendering it as either would tell the user a dead line still does
+  // something. The CLI computed the row; this only draws it.
+  if ((d.retired_keys || []).length) {
+    const c = card(t("settings.retired.title"));
+    c.append(el("div", "note", t("settings.retired.note")));
+    for (const r of d.retired_keys) {
+      const row = el("div", "setting shadowed");
+      const left = el("div");
+      const name = el("div", "setting-name");
+      name.append(document.createTextNode(r.key));
+      const lock = el("span", "lock");
+      lock.append(document.createTextNode("🔒 " + t("settings.retired.badge")));
+      name.append(lock);
+      left.append(name);
+      left.append(el("div", "setting-desc", t("settings.retired.readonly")));
+      left.append(el("div", "shadow-why", `${t("settings.retired.removedIn")} ${r.removed_in} — ${r.why}`));
+      const right = el("div", "setting-control");
+      right.append(el("div", "readonly-value", String(r.value)));
+      row.append(left, right);
+      c.append(row);
+    }
+    out.append(c);
+  }
+
   // Last block on the panel, and it sticks to the bottom of the viewport once
   // something is pending: with 36 keys across three tiers, an Apply you have to
   // go looking for is an Apply that gets forgotten.
@@ -243,6 +275,99 @@ async function renderSettings(body) {
   body.replaceChildren(out);
 }
 
+// WHO DECIDES WHAT (v1.0.0 W16) — the contested families, resolved.
+//
+// THE PANEL DECIDES NOTHING HERE. `families` is the CLI's static registry (which
+// ranks exist, in which order, and the question each family answers) and
+// `families_resolved` is what those ranks actually did against the config on
+// disk right now. Re-deriving a precedence in the browser is the exact drift
+// this panel exists to make impossible — the Flow-stepper rule, applied to
+// config.
+//
+// Only CONTESTED families are drawn. A family with one rank has no precedence
+// to teach, and a card that lists thirty uncontested rows to show two
+// interesting ones is a card nobody reads to the bottom of.
+//
+// Every state word is the CLI's own, from the closed set it publishes as
+// `rank_states` — never a friendlier synonym (`resolved`, `not-read`, `inert`,
+// `demoted`, `absent`, `partly-resolved`). A `why` is CLI prose and is never
+// translated: it names keys, runs, profiles and commands by their real ids.
+const RANK_STATE_KIND = {
+  resolved: "ok",
+  "partly-resolved": "ok",
+  "not-read": null,
+  inert: "warn",
+  demoted: "warn",
+  absent: null,
+};
+
+function ranksCard(families, resolved, states) {
+  const c = card(t("settings.ranks.title"));
+  c.id = "ranks-card";
+  c.append(el("div", "note", t("settings.ranks.note")));
+
+  const names = Object.keys(families || {}).filter((n) => (families[n] || {}).contested);
+  if (!names.length) {
+    c.append(el("div", "empty", t("settings.ranks.none")));
+    return c;
+  }
+
+  for (const name of names) {
+    const fam = families[name] || {};
+    const res = (resolved || {})[name] || {};
+    const block = el("div", "rank-family");
+
+    const h = el("div", "rank-family-head");
+    // The family id is a CLI id. The QUESTION beside it is the CLI's too —
+    // it is the whole reason the grouping means anything.
+    h.append(el("span", "rank-family-name", name));
+    h.append(el("span", "rank-family-q", fam.question || ""));
+    block.append(h);
+
+    // WHAT ANSWERED, stated before the ladder rather than left to be inferred
+    // from which row happens to be green. `resolved_by` is null on a terminal
+    // rank, which is not a gap: it means nothing above the floor resolved.
+    if (res.resolved_at) {
+      const by = el("div", "rank-answer");
+      by.append(
+        document.createTextNode(
+          res.resolved_by
+            ? t("settings.ranks.answeredBy", { prio: res.resolved_at, key: res.resolved_by })
+            : t("settings.ranks.answeredByDefault", { prio: res.resolved_at })
+        )
+      );
+      block.append(by);
+    }
+
+    for (const r of res.ranks || fam.ranks || []) {
+      const row = el("div", "rank-row" + (r.state === "resolved" ? " is-resolved" : ""));
+      row.append(el("span", "rank-prio", r.prio));
+      // A rank is either a KEY or the family's terminal floor. The floor has no
+      // key on purpose — it is "the thing that happens when nobody chose" — and
+      // rendering it as a key would invite somebody to look for it in the file.
+      row.append(el("span", "rank-key" + (r.key ? "" : " is-terminal"), r.key || r.terminal || ""));
+      const st = r.state || "absent";
+      // An unknown state is RENDERED, not swallowed: the CLI owns this set, and
+      // a panel that silently drops a word it does not recognise is a panel that
+      // hides the next state somebody adds.
+      row.append(chip(st, RANK_STATE_KIND[st] === undefined ? null : RANK_STATE_KIND[st]));
+      if (r.why) row.append(el("div", "rank-why", r.why));
+      block.append(row);
+    }
+    c.append(block);
+  }
+
+  // The closed set, once, at the bottom. It is what makes an unfamiliar chip
+  // above readable without leaving the page.
+  if ((states || []).length) {
+    const legend = el("div", "rank-legend");
+    legend.append(el("span", "rank-legend-label", t("settings.ranks.legend")));
+    for (const s of states) legend.append(chip(s, RANK_STATE_KIND[s] === undefined ? null : RANK_STATE_KIND[s]));
+    c.append(legend);
+  }
+  return c;
+}
+
 function ladderCard(table) {
   const c = card(t("settings.ladder.title"));
   c.id = "ladder-card"; // the FLIP morph finds it by id, never by a :has() query
@@ -324,6 +449,27 @@ function settingRow(k, panelBody, edits) {
   // translated. They name keys, values and precedence rules by their real ids.
   left.append(el("div", "setting-desc", k.desc));
   if (k.shadow_reason) left.append(el("div", "shadow-why", k.shadow_reason));
+  // WHICH LANES READ THIS (v1.0.0 W16). `k.lanes[]` is the CLI's own
+  // `CONFIG_META[].lanes[]` — the same list `orc lane config` filters on, and
+  // the same list a two-way lint already refuses to let drift. It answers the
+  // question a settings screen otherwise leaves you guessing at: I changed
+  // this, so what did I just change? A lane name is a CLI id and is never
+  // translated.
+  //
+  // AN EMPTY LIST IS AN ANSWER AND KEEPS ITS ROW. Ten keys are permanently
+  // empty and the lint has an allowlist naming every one of them: they are
+  // OPERATING keys of the `orc extra` bridge — a lane calls `orc extra
+  // dispatch` and the CLI reads `extra_timeout_s`, so no lane ever names it.
+  // Skipping the line would make "no lane reads this" look identical to "we
+  // did not render it", which is the distinction this whole row exists to
+  // draw.
+  {
+    const lanes = el("div", "setting-lanes");
+    lanes.append(el("span", "setting-lanes-label", t("settings.lanes.label")));
+    if ((k.lanes || []).length) for (const lane of k.lanes) lanes.append(chip(lane, "lane"));
+    else lanes.append(el("span", "setting-lanes-none", t("settings.lanes.none")));
+    left.append(lanes);
+  }
 
   const right = el("div", "setting-control");
   right.append(controlFor(k, edits));