changeledger 0.9.0 → 0.10.0

package/src/metrics.mjs

@@ -70,6 +70,29 @@ function avg(nums) {
   return nums.length ? Math.round(nums.reduce((a, b) => a + b, 0) / nums.length) : 0;
 }
 
+// Nearest-rank percentile over an ascending-sorted array; 0 for an empty input
+// so callers never divide by zero or render NaN.
+function percentile(sorted, p) {
+  if (!sorted.length) return 0;
+  const rank = Math.min(sorted.length, Math.max(1, Math.ceil((p / 100) * sorted.length)));
+  return sorted[rank - 1];
+}
+
+// Count of `review → in-progress` verdicts (the `fail --retry` outcome) — the
+// same event grammar as lifecycle transitions, filtered to the implicit
+// review-verdict shape so an explicit `status:` move or a validation verdict
+// isn't miscounted as a retry.
+function reviewRetryCount(change) {
+  let count = 0;
+  for (const line of logBody(change).split('\n')) {
+    const event = parseLogEvent(line);
+    if (event && !event.explicit && event.from === 'in-review' && event.to === 'in-progress') {
+      count++;
+    }
+  }
+  return count;
+}
+
 export function computeMetrics(changes = [], { now } = {}) {
   const nowIso = now ?? '9999-12-31T23:59:59Z';
 
@@ -80,12 +103,17 @@ export function computeMetrics(changes = [], { now } = {}) {
   const aging = [];
   let blockedMs = 0;
   const byType = new Map(); // type → { closed, cycles:[] }
+  const byOwner = new Map(); // owner → { closed, cycles:[] }
+  let reviewRetries = 0;
 
   for (const c of changes) {
     const status = c.frontmatter?.status;
     const type = c.frontmatter?.type ?? 'unknown';
+    const owner = c.frontmatter?.owner || 'unassigned';
     const created = c.frontmatter?.created;
 
+    reviewRetries += reviewRetryCount(c);
+
     if (ACTIVE.includes(status)) wip[status] = (wip[status] ?? 0) + 1;
 
     const segs = statusTimeline(c, nowIso);
@@ -114,6 +142,11 @@ export function computeMetrics(changes = [], { now } = {}) {
         bt.closed += 1;
         bt.cycles.push(cycleMs);
         byType.set(type, bt);
+
+        const bo = byOwner.get(owner) ?? { closed: 0, cycles: [] };
+        bo.closed += 1;
+        bo.cycles.push(cycleMs);
+        byOwner.set(owner, bo);
       }
     }
   }
@@ -130,17 +163,26 @@ export function computeMetrics(changes = [], { now } = {}) {
   const byTypeArr = [...byType.entries()]
     .map(([type, v]) => ({ type, closed: v.closed, avgCycleMs: avg(v.cycles) }))
     .sort((a, b) => b.closed - a.closed);
+  const byOwnerArr = [...byOwner.entries()]
+    .map(([owner, v]) => ({ owner, closed: v.closed, avgCycleMs: avg(v.cycles) }))
+    .sort((a, b) => b.closed - a.closed);
+  const validationWaitMs = timeInStatus.find((t) => t.state === 'in-validation')?.avgMs ?? 0;
 
   return {
     count: perChange.length,
     avgCycleMs: avg(cycles),
     medianCycleMs: median(cycles),
+    p50CycleMs: percentile(cycles, 50),
+    p85CycleMs: percentile(cycles, 85),
     perChange,
     throughput,
     timeInStatus,
     wip,
     aging: aging.sort((a, b) => b.ms - a.ms),
     blockedMs,
+    validationWaitMs,
+    reviewRetries,
     byType: byTypeArr,
+    byOwner: byOwnerArr,
   };
 }

package/src/search.mjs

@@ -0,0 +1,162 @@
+// Deterministic lexical search over changes and specs. No embeddings, no
+// network — a fixed-boost term-frequency score (title x3, headings/CR x2,
+// body x1) with a stable tie-break, so repeated runs are byte-for-byte
+// identical. See change 20260711-103758.
+
+const ACCENTS = /[̀-ͯ]/g;
+const CR_HEADING = /^###\s+CR\d+.*$/gm;
+const MARKDOWN_HEADING = /^#{1,6}\s+(.+)$/gm;
+
+// Lowercase + strip diacritics so "búsqueda" and "busqueda" match the same term.
+export function normalize(text) {
+  return (text ?? '').normalize('NFD').replace(ACCENTS, '').toLowerCase();
+}
+
+function tokenize(query) {
+  return normalize(query)
+    .split(/\s+/)
+    .map((t) => t.trim())
+    .filter(Boolean);
+}
+
+function countOccurrences(haystackNormalized, term) {
+  if (!term) return 0;
+  let count = 0;
+  let idx = 0;
+  for (;;) {
+    const found = haystackNormalized.indexOf(term, idx);
+    if (found === -1) break;
+    count++;
+    idx = found + term.length;
+  }
+  return count;
+}
+
+// Locates the first case/accent-insensitive occurrence of `term` in `rawText`
+// and returns a short surrounding snippet, or null when there is no match.
+function findSnippet(rawText, term, span = 40) {
+  const normalized = normalize(rawText);
+  const idx = normalized.indexOf(term);
+  if (idx === -1) return null;
+  const start = Math.max(0, idx - span);
+  const end = Math.min(rawText.length, idx + term.length + span);
+  const prefix = start > 0 ? '…' : '';
+  const suffix = end < rawText.length ? '…' : '';
+  return `${prefix}${rawText.slice(start, end).replace(/\s+/g, ' ').trim()}${suffix}`;
+}
+
+// Splits a change's stages into a heading/CR bucket (boost x2) and a body
+// bucket (boost x1). CR heading lines are lifted out of the body so they are
+// scored once, at the heading boost, not twice.
+function changeHeadingsAndBody(stages) {
+  const headings = [];
+  const bodyParts = [];
+  for (const stage of stages) {
+    headings.push(stage.heading);
+    const crHeadings = stage.body.match(CR_HEADING) ?? [];
+    headings.push(...crHeadings);
+    bodyParts.push(stage.body.replace(CR_HEADING, ''));
+  }
+  return { headings: headings.join('\n'), body: bodyParts.join('\n\n') };
+}
+
+// Same split for a spec's free-form body: its own `#`..`######` headings
+// (boost x2) versus the remaining prose (boost x1).
+function specHeadingsAndBody(body) {
+  const headings = [...body.matchAll(MARKDOWN_HEADING)].map((m) => m[1]);
+  const stripped = body.replace(MARKDOWN_HEADING, '');
+  return { headings: headings.join('\n'), body: stripped };
+}
+
+// Builds the searchable corpus from a loaded repo (see repo.mjs `loadRepo`):
+// every change — including archived ones — and every spec, reduced to the
+// fields the scorer needs.
+export function buildCorpus({ changes, specs }) {
+  const fromChanges = changes.map((c) => {
+    const { headings, body } = changeHeadingsAndBody(c.stages);
+    return {
+      ref: `#${c.frontmatter.id}`,
+      kind: 'change',
+      title: c.frontmatter.title ?? '',
+      status: c.frontmatter.status ?? null,
+      type: c.frontmatter.type ?? null,
+      headings,
+      body,
+    };
+  });
+
+  const fromSpecs = specs.map((s) => {
+    const slug = s.name.replace(/\.md$/, '');
+    const { headings, body } = specHeadingsAndBody(s.body);
+    return {
+      ref: `spec:${slug}`,
+      kind: 'spec',
+      title: s.frontmatter.title ?? slug,
+      status: null,
+      type: null,
+      headings,
+      body,
+    };
+  });
+
+  return [...fromChanges, ...fromSpecs];
+}
+
+function scoreDocument(doc, terms) {
+  const titleN = normalize(doc.title);
+  const headingsN = normalize(doc.headings);
+  const bodyN = normalize(doc.body);
+  let score = 0;
+  for (const term of terms) {
+    score += countOccurrences(titleN, term) * 3;
+    score += countOccurrences(headingsN, term) * 2;
+    score += countOccurrences(bodyN, term) * 1;
+  }
+  return score;
+}
+
+function buildSnippet(doc, terms) {
+  for (const field of [doc.title, doc.headings, doc.body]) {
+    for (const term of terms) {
+      const snippet = findSnippet(field, term);
+      if (snippet) return snippet;
+    }
+  }
+  return '';
+}
+
+// Scores and ranks `docs` (as produced by `buildCorpus`) against `query`.
+// On an equal score, a spec sorts before a change — specs are the current
+// persistent truth, so that's what an agent should read first. Among equals
+// of the same kind, ties break by `ref` descending so the same repo state
+// always yields the same byte-for-byte output.
+export function searchDocuments(docs, query, { limit = 10, type, status } = {}) {
+  const terms = tokenize(query);
+  if (!terms.length) return [];
+
+  const hits = [];
+  for (const doc of docs) {
+    if (type && doc.type !== type) continue;
+    if (status && doc.status !== status) continue;
+    const score = scoreDocument(doc, terms);
+    if (score <= 0) continue;
+    hits.push({
+      ref: doc.ref,
+      kind: doc.kind,
+      title: doc.title,
+      type: doc.type,
+      status: doc.status,
+      score,
+      snippet: buildSnippet(doc, terms),
+    });
+  }
+
+  hits.sort((a, b) => {
+    if (b.score !== a.score) return b.score - a.score;
+    if (a.kind !== b.kind) return a.kind === 'spec' ? -1 : 1;
+    if (a.ref === b.ref) return 0;
+    return a.ref < b.ref ? 1 : -1;
+  });
+
+  return hits.slice(0, limit);
+}

package/src/viewer/domain.mjs

@@ -407,7 +407,7 @@ export function previewConfigMigration(projects, id, rev) {
   return {
     code: 200,
     body: {
-      summary: `Config migration 0 → ${SUPPORTED_SCHEMA_VERSION} (dry run)`,
+      summary: `Config migration ${migrationResult.fromVersion} → ${SUPPORTED_SCHEMA_VERSION} (dry run)`,
       changes: migrationResult.changes,
       yaml: migrationResult.yaml,
     },

package/src/viewer/public/app.js

@@ -48,7 +48,7 @@ import {
   tableRow,
   validationPanel,
 } from './view-parts.js';
-import { graphSvg, metricsHtml, specsListHtml } from './view-renderers.js';
+import { graphSvg, metricsHtml, sortSpecsByUpdated, specsListHtml } from './view-renderers.js';
 
 export { cssIdent, esc, makeMermaidExpandable, safeHtml } from './security.js';
 export { boardStatuses, isVisible, passesTombstones } from './state.js';
@@ -156,7 +156,7 @@ function renderChoiceFilter(host, label, choices, selected, toggle, clear, owner
     html`<details class="filter-menu">
       <summary class="filter-trigger">
         <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M2 3.25h12M4.25 8h7.5M6.5 12.75h3"></path></svg>
-        <span>${summary}</span>
+        <span data-choice-summary>${summary}</span>
         <svg class="filter-chevron" viewBox="0 0 16 16" aria-hidden="true"><path d="m4.5 6.25 3.5 3.5 3.5-3.5"></path></svg>
       </summary>
       <div class="filter-popover">
@@ -169,19 +169,32 @@ function renderChoiceFilter(host, label, choices, selected, toggle, clear, owner
     </details>`,
     host,
   );
+  const syncSummary = () => {
+    host.querySelector('[data-choice-summary]').textContent = choiceFilterSummary(
+      label,
+      selected,
+      owners && state.filters.includeUnassigned,
+    );
+  };
   host.querySelectorAll('[data-choice]').forEach((input) => {
     input.onchange = () => {
       toggle(input.dataset.choice);
+      syncSummary();
       render();
     };
   });
   if (owners)
     host.querySelector('[data-unassigned]').onchange = () => {
       toggleUnassignedOwner();
+      syncSummary();
       render();
     };
   host.querySelector('[data-clear]').onclick = () => {
     clear();
+    host.querySelectorAll('[data-choice], [data-unassigned]').forEach((input) => {
+      input.checked = false;
+    });
+    syncSummary();
     render();
   };
 }
@@ -722,8 +735,10 @@ function sortVal(c, key) {
 /* Specs view */
 function renderSpecs() {
   const q = state.filters.text.toLowerCase();
-  const specs = (state.repo.specs || []).filter(
-    (s) => !q || `${s.title} ${(s.tags || []).join(' ')} ${s.body}`.toLowerCase().includes(q),
+  const specs = sortSpecsByUpdated(
+    (state.repo.specs || []).filter(
+      (s) => !q || `${s.title} ${(s.tags || []).join(' ')} ${s.body}`.toLowerCase().includes(q),
+    ),
   );
   litRender(specsListHtml(specs, fmtDateTime), $('#specs'));
   $('#specs')
@@ -789,8 +804,32 @@ export function handleSpecBodyClick(event, _openSpecByName) {
 
 const VIEWS = ['board', 'table', 'graph', 'specs', 'metrics', 'projects'];
 
-function renderMetrics() {
-  litRender(metricsHtml(state.repo.metrics || {}), $('#metrics'));
+// The shared metrics module is dynamic-imported once and cached: the client
+// computes metrics itself, over the filtered set, instead of duplicating
+// `computeMetrics` (20260711-155721 CR2). Served read-only from the CLI's own
+// `src/metrics.mjs` by the router.
+let sharedMetricsModule;
+function loadMetricsModule() {
+  sharedMetricsModule ??= import('/shared/metrics.mjs');
+  return sharedMetricsModule;
+}
+
+// `computeMetrics` speaks the CLI's native change shape (`{ frontmatter,
+// stages }`); `state.repo.changes` is already flattened for board/table
+// rendering. Adapt back rather than reshaping the shared module's contract,
+// which the server also relies on unchanged.
+function toMetricsChange(c) {
+  return {
+    frontmatter: { id: c.id, type: c.type, status: c.status, owner: c.owner, created: c.created },
+    stages: c.stages,
+  };
+}
+
+async function renderMetrics() {
+  const changes = visibleChanges();
+  const { computeMetrics } = await loadMetricsModule();
+  const metrics = computeMetrics(changes.map(toMetricsChange), { now: new Date().toISOString() });
+  litRender(metricsHtml(metrics, changes.length), $('#metrics'));
 }
 
 export function syncViewerShell(root = document, renderContent = true) {
@@ -825,7 +864,6 @@ let configMode = 'form'; // 'form' | 'raw'
 let configDirty = false; // true when form/raw has unsaved edits
 let migrationPreview = null; // null | { summary, changes, yaml } | { already_current }
 
-const SUPPORTED_SCHEMA_VERSION = 1;
 // Confirm dialog — uses native <dialog> for proper focus-trap, ESC and backdrop.
 // _confirmImpl is replaceable in tests (JSDOM lacks showModal).
 let _confirmImpl = null;
@@ -929,8 +967,9 @@ function configSectionTemplate(config, mode, preview) {
   }
 
   const schema = config.schemaVersion ?? 0;
-  const futureSch = schema > SUPPORTED_SCHEMA_VERSION;
-  const outdated = schema < SUPPORTED_SCHEMA_VERSION;
+  const supported = config.supported;
+  const futureSch = schema > supported;
+  const outdated = schema < supported;
 
   return html`<div class="config-section">
     ${
@@ -964,7 +1003,7 @@ function configSectionTemplate(config, mode, preview) {
         : outdated
           ? html`<div class="config-migration-card">
               <h3>Migration required</h3>
-              <p>Config schema ${schema} is outdated. Preview and apply the migration to schema ${SUPPORTED_SCHEMA_VERSION} to enable the Form editor.</p>
+              <p>Config schema ${schema} is outdated. Preview and apply the migration to schema ${supported} to enable the Form editor.</p>
               ${
                 preview?.already_current
                   ? html`<p class="config-migration-ok">Migration already applied.</p>`
@@ -1207,7 +1246,7 @@ async function openManagedProject(id, { reload = false } = {}) {
     const structured = await getProjectConfigStructured(id);
     managedConfig = { id, ...structured };
     // Default to form for current schema, raw for future schema
-    if (structured.schemaVersion > SUPPORTED_SCHEMA_VERSION) {
+    if (structured.schemaVersion > structured.supported) {
       configMode = 'raw';
     } else {
       configMode = 'form';
@@ -1639,6 +1678,17 @@ function bootstrap() {
 
   loadProjects();
   setInterval(load, 5000);
+
+  // The topbar wraps to multiple rows at content-dependent widths, so the
+  // CSS fallback constant cannot bound the projects panels; track the real
+  // rendered height instead.
+  const topbar = document.querySelector('.topbar');
+  if (topbar && typeof ResizeObserver === 'function') {
+    const syncHeaderHeight = () =>
+      document.documentElement.style.setProperty('--header-height', `${topbar.offsetHeight}px`);
+    new ResizeObserver(syncHeaderHeight).observe(topbar);
+    syncHeaderHeight();
+  }
 }
 
 export function closeFilterMenusOnOutsideClick(menus, target) {

package/src/viewer/public/styles.css

@@ -22,6 +22,8 @@
   --status-done: #3fb950;
   --status-discarded: #9aa0aa;
   --status-muted: #8b929e;
+  /* fallback only: app.js keeps this synced to the real .topbar height */
+  --header-height: 55px;
   font-family: "Avenir Next", Avenir, ui-sans-serif, sans-serif;
   color-scheme: dark;
 }
@@ -115,17 +117,20 @@ body {
 /* Project management */
 .projects-view {
   padding: 18px;
+  height: calc(100dvh - var(--header-height));
+  box-sizing: border-box;
 }
 .projects-shell {
   display: grid;
   grid-template-columns: minmax(320px, 0.8fr) minmax(460px, 1.2fr);
   gap: 16px;
-  max-width: 1500px;
-  margin: 0 auto;
+  height: 100%;
 }
 .projects-list,
 .project-editor {
   min-width: 0;
+  min-height: 0;
+  overflow-y: auto;
   border: 1px solid var(--line);
   border-radius: 14px;
   background: var(--panel);
@@ -303,8 +308,16 @@ body {
   cursor: wait;
 }
 @media (max-width: 900px) {
+  .projects-view {
+    height: auto;
+  }
   .projects-shell {
     grid-template-columns: 1fr;
+    height: auto;
+  }
+  .projects-list,
+  .project-editor {
+    overflow-y: visible;
   }
   .project-row {
     grid-template-columns: 10px minmax(0, 1fr) auto;
@@ -894,6 +907,49 @@ body {
   font-size: 13px;
   border-bottom: 1px solid var(--line);
 }
+.muted {
+  color: var(--muted);
+}
+.metrics-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 14px;
+  margin-top: 18px;
+}
+@media (max-width: 1100px) {
+  .metrics-grid {
+    grid-template-columns: minmax(0, 1fr);
+  }
+}
+.metrics-panel {
+  background: var(--panel);
+  border: 1px solid var(--line);
+  border-radius: 8px;
+  padding: 4px 18px 16px;
+  min-width: 0;
+}
+.metrics-panel .metrics-h:first-child {
+  margin-top: 14px;
+}
+.throughput-svg {
+  width: 100%;
+  height: auto;
+}
+.tp-rect {
+  fill: var(--accent, #4a9eff);
+}
+.tp-value {
+  font-size: 11px;
+  fill: var(--text);
+}
+.tp-date {
+  font-size: 10px;
+  fill: var(--muted);
+}
+.tp-axis {
+  stroke: var(--line);
+  stroke-width: 1;
+}
 
 /* Overlay + detail */
 .detail-open {
@@ -1321,10 +1377,10 @@ body {
 /* Specs view */
 .specs-view {
   padding: 16px;
-  display: flex;
-  flex-direction: column;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
   gap: 10px;
-  max-width: 760px;
+  align-items: start;
 }
 .spec-card {
   background: var(--panel);
@@ -1340,6 +1396,21 @@ body {
   font-weight: 600;
   margin-bottom: 6px;
 }
+.spec-excerpt {
+  margin: 8px 0 0;
+  color: var(--muted);
+  font-size: 0.9em;
+  overflow: hidden;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+}
+
+@media (max-width: 680px) {
+  .specs-view {
+    grid-template-columns: 1fr;
+  }
+}
 .empty {
   color: var(--muted);
   padding: 8px;