rvlib-shipkit 1.3.0 → 1.4.0

package/src/ledger/store.ts

@@ -105,6 +105,17 @@ export class Answers {
         this.h = null
     }
 
+    /** the busy timeout sqlite holds on the open handle, in ms: how long its
+     *  last statement could wait on a writer. Null with no handle */
+    busyTimeout(): number | null {
+        try {
+            const r = this.h?.query('pragma busy_timeout').get() as Record<string, number> | null | undefined
+            return r == null ? null : (Object.values(r)[0] ?? null)
+        } catch {
+            return null
+        }
+    }
+
     /** the stored answer, or null when the check must run */
     read<T>(ns: string, name: string, key: string): Stored<T> | null {
         const row = this.with(READ_BUSY_MS, (h) => h.query('select v, at, keeps, payload from answers where ns = ? and name = ? and key = ?').get(ns, name, key) as Row | null)

package/src/ledger/world-cache.ts

@@ -31,9 +31,8 @@
 // A measured negative may be kept only for a check about the WORLD. One about
 // THIS REPO is fixed by a human and the next run goes green, so replaying its
 // red would be the cache lying about work already done.
-import { FOREVER_MS, fmtStamp, type Line } from '../core/wire.ts'
+import { FOREVER_MS, type Line, type Stamp } from '../core/wire.ts'
 import { FRESH_ENV, withAnswers, type Answers, type Stored } from './store.ts'
-import { CACHED, RAN } from '../core/outcome-words.ts'
 
 /** the longest a MEASURED NEGATIVE is remembered, whatever TTL was declared.
  *  Long enough to stop a re-ask storm inside one working session, short
@@ -80,11 +79,21 @@ function adoptTimed(a: Answers, ns: string, name: string, key: string): Stored<L
         return head != null && e.key.slice(head[0].length) === rest && Array.isArray(e.payload) && e.payload.length > 0 && e.payload.every((l) => l.kind === 'ok' || l.kind === 'note')
     })
     if (old == null) return null
-    const payload = old.payload.map((l, i): Line => (i !== 0 ? l : { ...l, text: l.text.replace(new RegExp(`\\((${CACHED} at [^)]*?) until [^)]*\\)$`), '($1 until its declaration changes)') }))
+    const payload = unbake(old.payload)
     a.write([{ ns, name, key, payload, at: old.at, keeps: FOREVER_MS }], { now: old.at })
     return { ...old, key, keeps: FOREVER_MS, payload }
 }
 
+/** the times an older build wrote into the first line's text, as `(cached at
+ *  <stamp> until <stamp>)` or `(ran at <stamp>, kept until <stamp>)`: the
+ *  entry holds them as data, so the text drops them */
+const BAKED = / \((?:cached|ran) at \d{4}-\d\d-\d\d \d\d:\d\d:\d\d,? (?:kept )?until [^)]*\)$/
+const unbake = (lines: Line[]): Line[] => lines.map((l, i) => (i === 0 ? { ...l, text: l.text.replace(BAKED, '') } : l))
+
+/** the first line, stamped with when its answer was measured and until when it keeps */
+const stamped = (lines: Line[], stamp: Stamp): Line[] => lines.map((l, i) => (i === 0 ? { ...l, stamp } : l))
+const untilOf = (at: number, keeps: number): number | null => (keeps >= FOREVER_MS ? null : at + keeps)
+
 /** the answer for this key, or the one a forever key adopts */
 const readOrAdopt = (a: Answers, ns: string, name: string, key: string): Stored<Line[]> | null => a.read<Line[]>(ns, name, key) ?? adoptTimed(a, ns, name, key)
 
@@ -104,11 +113,9 @@ export function replayWorld(c: WorldCache, name: string, key: string, ttlMs: num
     if (entry == null || !Array.isArray(entry.payload)) return null
     const keeps = entry.keeps ?? ttlMs
     if (now - entry.at >= keeps || now < entry.at) return null
-    // the stamp was baked in when the answer was MEASURED (below): a replay
-    // prints the stored lines VERBATIM, so the live run and every later replay
-    // render the same string. Annotating replays but not live runs diffed on
-    // every fresh-vs-cached alternation, so neither side annotates.
-    return entry.payload
+    // the times ride as data on the first line, rendered by whoever prints it
+    // against its own clock, so a line read a day later says how old it is
+    return stamped(unbake(entry.payload), { at: entry.at, until: untilOf(entry.at, keeps), cached: true })
 }
 
 export type Measured = {
@@ -150,11 +157,6 @@ export function rememberWorld(c: WorldCache, name: string, key: string, ttlMs: n
         return m.lines
     }
     const now = c.now()
-    const lines = m.lines.map((l, i): Line =>
-        i !== 0 ? l
-        : keepsFor >= FOREVER_MS ? { ...l, text: `${l.text} (${CACHED} at ${fmtStamp(now)} until its declaration changes)` }
-        : { ...l, text: `${l.text} (${m.clean ? `${CACHED} at ${fmtStamp(now)} until` : `${RAN} at ${fmtStamp(now)}, kept until`} ${fmtStamp(now + keepsFor)})` },
-    )
-    withAnswers(c.db, (a) => a.write([{ ns: c.ns, name, key, payload: lines, at: now, keeps: keepsFor }], { now }))
-    return lines
+    withAnswers(c.db, (a) => a.write([{ ns: c.ns, name, key, payload: m.lines, at: now, keeps: keepsFor }], { now }))
+    return stamped(m.lines, { at: now, until: untilOf(now, keepsFor) })
 }

package/src/repo-config.ts

@@ -146,12 +146,17 @@ export type RepoConfig = {
     /** notify command for new RED needs while the hub serves, `{message}` substituted, as in a push-notification CLI */
     notifyCommand?: string
     /** the `.shipkit/<venue>/` release contracts: which ones this repo is excused
-     *  from, and any manifest the published toolkit does not carry. */
+     *  from, any manifest the published toolkit does not carry, and the dir
+     *  its site serves when the deploy does not say. */
     contracts?: {
         /** venue id to the reason it is waived. The only bypass, and it always prints */
         exempt?: Record<string, string>
         /** manifests declared by this repo, beside the built-in venues */
         extra?: ContractManifest[]
+        /** the dir the site serves, repo-relative, where the identity contract
+         *  wants favicon.png, og.png and logo.*. Absent: the dir the deploy names
+         *  (a Pages workflow's artifact path, a wrangler output dir), else `public` */
+        webRoot?: string
     }
     /** repo-contributed .gitignore lines, rendered INSIDE rule SK004's managed
      *  block — for ecosystem-specific names the published lib may not carry */

package/src/serve/hub-app/activity-view.tsx

@@ -71,12 +71,12 @@ export const failingOf = (r: ActivityRow): StatusCheck[] => {
     if (r.failing != null) return r.failing
     const c = r.status
     if (c == null) return []
-    const one = (id: string, status: 'fail' | 'warn'): StatusCheck => ({ id, title: id, status, at: c.since[id] ?? null, line: '' })
+    const one = (id: string, status: 'fail' | 'warn'): StatusCheck => ({ id, title: id, status, at: c.since[id] ?? null, line: '', lines: [] })
     return [...c.reds.map((id) => one(id, 'fail')), ...c.warns.map((id) => one(id, 'warn'))]
 }
 
 /** each failing and warning check: its id (a link to its page), its title,
- *  how old that outcome is, and the first line it printed about it */
+ *  how old that outcome is, and every line it printed about it */
 export const CheckList = observer(({ app, r }: { app: HomeSt; r: ActivityRow }) => {
     const now = app.activity.now
     return (
@@ -93,7 +93,7 @@ export const CheckList = observer(({ app, r }: { app: HomeSt; r: ActivityRow })
                         {c.title !== c.id ? <span className="acchktitle">{c.title}</span> : null}
                         {c.at == null ? null : <span className="acdim" title={stampWords(c.at)}>{ageShort(c.at, now)}</span>}
                     </span>
-                    {c.line === '' ? null : <span className="acchkline">{c.line}</span>}
+                    {(c.lines ?? (c.line === '' ? [] : [c.line])).map((l, i) => <span key={i} className="acchkline">{l}</span>)}
                 </li>
             ))}
         </ul>

package/src/serve/hub-app/checks-svc.ts

@@ -12,6 +12,7 @@ import type { RepoSt } from './repo-st.ts'
 import { applyRunEvent, idleRun, startRun, stripText, type RunProgress } from './run-strip.ts'
 import type { GateBlock, Resource, ResourceState, SlowSuite, CheckEvent, WhenAt } from './hub-types.ts'
 import { WHEN_OPTION } from './check-words.ts'
+import { lineText } from '../../core/wire.ts'
 
 /** the colour rule, the SAME one the server applies, because a row must not
  *  change meaning between a live result and the poll that confirms it */
@@ -199,7 +200,7 @@ export class ChecksSvc {
                 state: stateOf(e),
                 severity: e.status === 'fail' ? (e.advisory ? 'yellow' : 'red') : e.status === 'warn' ? 'yellow' : undefined,
                 check: { ...u, status: e.status, replayed: e.replayed, lastMs: e.replayed ? null : Math.round(e.ms), lastAt: Date.now(), advisory: e.advisory },
-                md: e.lines.length === 0 ? r.md : `\`\`\`\n${e.lines.map((l) => (l.kind === 'fix-fail' || l.kind === 'fix-warn' ? `      fix: ${l.text}` : l.kind === 'fail' ? `FAIL: ${l.text}` : l.kind === 'warn' ? `WARN ${l.text}` : l.kind === 'skip' ? `skip: ${l.text}` : `ok: ${l.text}`)).join('\n')}\n\`\`\``,
+                md: e.lines.length === 0 ? r.md : `\`\`\`\n${e.lines.map((l) => (l.kind === 'fix-fail' || l.kind === 'fix-warn' ? `      fix: ${lineText(l)}` : l.kind === 'fail' ? `FAIL: ${lineText(l)}` : l.kind === 'warn' ? `WARN ${lineText(l)}` : l.kind === 'skip' ? `skip: ${lineText(l)}` : `ok: ${lineText(l)}`)).join('\n')}\n\`\`\``,
             }
         })
     }

package/src/serve/hub-app/col-tables-view.tsx

@@ -0,0 +1,124 @@
+// The checks page and the asks page: one dense table each, in the activity
+// page's table style, one line per item under group headers that count their
+// lines. What needs attention comes first; the quiet groups (passing, off,
+// done) fold by default and each viewer's fold choice is kept. The filter
+// input and the severity keys narrow the lines, since both read
+// `visibleInstances`. Groups, order and words: col-tables.ts.
+import { observer } from 'mobx-react-lite'
+import type { ReactNode } from 'react'
+import { checkName } from './check-words.ts'
+import { askGroups, checkGroups, dayMs, findingLine, planWord, type TableGroup } from './col-tables.ts'
+import { durationTone, fmtMs } from './dur.ts'
+import type { Resource } from './hub-types.ts'
+import type { RepoSt } from './repo-st.ts'
+import { TimeAgo } from './time-ago.tsx'
+
+const emptyWords = (app: RepoSt): string => (app.filter === 'red' ? 'no reds here' : app.filter === 'needs' ? 'nothing here needs you' : app.query.trim() !== '' ? 'nothing matches the filter' : 'nothing here yet')
+
+/** the page frame: the collection's title and count, then the table */
+const Page = ({ title, n, cols, empty, children }: { title: string; n: number; cols: ReactNode; empty: string; children: ReactNode }) => (
+    <div className="ctpage">
+        <div className="cghead">{title}<span className="cnt">{n}</span></div>
+        {n === 0 ? <div className="ph">{empty}</div> : (
+            <table className="actable cttable">
+                <colgroup>{cols}</colgroup>
+                {children}
+            </table>
+        )}
+    </div>
+)
+
+/** one group: its header line (a click folds it), then its lines unless folded */
+const Group = observer(<K extends string>({ app, col, g, span, row }: { app: RepoSt; col: string; g: TableGroup<K>; span: number; row: (r: Resource) => ReactNode }) => {
+    const key = `${col}:${g.key}`
+    const folded = app.cols.groupFolded(key, g.foldedByDefault)
+    return (
+        <tbody className="ctgroup">
+            <tr className={`ctgrp g-${g.key}`} data-k={g.key} onClick={() => app.cols.toggleGroup(key, g.foldedByDefault)}>
+                <td colSpan={span}><span className="ctcaret">{folded ? '▸' : '▾'}</span>{g.label}</td>
+            </tr>
+            {folded ? null : g.rows.map(row)}
+        </tbody>
+    )
+})
+
+const DOT: Record<string, { tone: string; mark: string }> = {
+    fail: { tone: 't-red', mark: '●' },
+    warn: { tone: 't-warn', mark: '●' },
+    pass: { tone: 't-ok', mark: '●' },
+    skip: { tone: 'acdim', mark: '●' },
+    never: { tone: 'acdim', mark: '○' },
+    off: { tone: 'acdim', mark: '○' },
+}
+
+const CheckRow = observer(({ app, r }: { app: RepoSt; r: Resource }) => {
+    const c = r.check!
+    const name = checkName(c.checkId, r.title)
+    const dot = c.when === 'off' ? DOT.off! : c.status == null ? DOT.never! : DOT[c.status]!
+    const finding = findingLine(c)
+    const tone = durationTone(c.lastMs, c.timeoutMs, c.budgetMs)
+    return (
+        <tr className={`ctrow s-${c.status ?? 'never'}`} data-k={c.checkId} onClick={() => app.cols.select(r.collection, r.id)} title={c.description}>
+            <td className={`ctdot ${dot.tone}`}>{dot.mark}</td>
+            <td className={`ctid ${c.status === 'fail' ? 't-red' : c.status === 'warn' ? 't-warn' : ''}`}>{c.checkId}</td>
+            <td className="cttitle">{name.title === c.checkId ? '' : name.title}</td>
+            <td className="acwhen">{c.lastAt == null ? '' : <TimeAgo clock={app.clock} at={c.lastAt} />}</td>
+            <td className="ctdur">
+                {c.lastMs == null ? null : <span className={`dnum ${tone ?? ''}`}>{fmtMs(c.lastMs)}</span>}
+                <span className="ctbudget">{` / ${fmtMs(c.budgetMs)}`}</span>
+            </td>
+            <td className="ctfind" title={c.lastLines.length > 0 ? c.lastLines.join('\n') : undefined}>{finding}</td>
+            <td className="ctplan">{planWord(c)}</td>
+        </tr>
+    )
+})
+
+export const CheckTable = observer(({ app, id }: { app: RepoSt; id: string }) => {
+    const col = app.cols.sidebarCols.find((x) => x.id === id)
+    if (col == null) return <div className="stagewrap"><div className="ph">collection vanished — the truth moved on</div></div>
+    const items = app.cols.visibleInstances(col)
+    const cols = (
+        <>
+            <col className="c-dot" /><col className="c-id" /><col className="c-title" /><col className="c-age" /><col className="c-dur" /><col /><col className="c-plan" />
+        </>
+    )
+    return (
+        <Page title={col.title} n={items.length} cols={cols} empty={emptyWords(app)}>
+            {checkGroups(items).map((g) => <Group key={g.key} app={app} col={col.id} g={g} span={7} row={(r) => <CheckRow key={r.id} app={app} r={r} />} />)}
+        </Page>
+    )
+})
+
+const AskRow = observer(({ app, r }: { app: RepoSt; r: Resource }) => {
+    const a = r.ask
+    const done = r.id.startsWith('ask:done/')
+    const at = dayMs(done ? (a?.closed ?? a?.created) : a?.created)
+    const blocks = a == null || a.blocks === '-' ? '' : a.blocks
+    return (
+        <tr className={`ctrow s-${done ? 'done' : 'open'}`} data-k={r.id} onClick={() => app.cols.select(r.collection, r.id)} title={r.file}>
+            <td className={`ctkind ${done ? 'acdim' : ''}`}>{a?.kind ?? r.slot ?? ''}</td>
+            <td className={`cttitle ${done ? 'acdim' : ''}`}>{r.title}</td>
+            <td className="acwhen">{at == null ? '' : <TimeAgo clock={app.clock} at={at} />}</td>
+            <td className="ctblocks" title={blocks === '' ? undefined : blocks}>{blocks}</td>
+            {done ? <td /> : a?.probe != null
+                ? <td className="ctprobe t-ok" title={`closes itself once \`${a.probe}\` exits 0`}>auto close</td>
+                : <td className="ctprobe acdim" title="no probe: done by hand">manual</td>}
+        </tr>
+    )
+})
+
+export const AskTable = observer(({ app, id }: { app: RepoSt; id: string }) => {
+    const col = app.cols.sidebarCols.find((x) => x.id === id)
+    if (col == null) return <div className="stagewrap"><div className="ph">collection vanished — the truth moved on</div></div>
+    const items = app.cols.visibleInstances(col)
+    const cols = (
+        <>
+            <col className="c-kind" /><col /><col className="c-age" /><col className="c-blocks" /><col className="c-probe" />
+        </>
+    )
+    return (
+        <Page title={col.title} n={items.length} cols={cols} empty={emptyWords(app)}>
+            {askGroups(items).map((g) => <Group key={g.key} app={app} col={col.id} g={g} span={5} row={(r) => <AskRow key={r.id} app={app} r={r} />} />)}
+        </Page>
+    )
+})

package/src/serve/hub-app/col-tables.ts

@@ -0,0 +1,115 @@
+// The checks page and the asks page as dense tables: which group each line
+// belongs to, the order inside a group, and every word a line says. Pure, so
+// a test pins them rather than a screenshot (col-tables-view.tsx draws them).
+import { parseDuration } from '../../core/wire.ts'
+import { spanShort } from '../../plan/plan-timeline.ts'
+import type { CachePop } from './check-words.ts'
+import type { CheckFacts, Resource } from './hub-types.ts'
+
+/** one group of lines under its header. `key` is what the viewer's fold
+ *  choice is remembered under, with the collection before it */
+export type TableGroup<K extends string> = { key: K; label: string; rows: Resource[]; foldedByDefault: boolean }
+
+export type CheckGroupKey = 'fail' | 'warn' | 'never' | 'pass' | 'off'
+
+/** the groups in the order a reader wants them: what needs attention first */
+const CHECK_GROUPS: { key: CheckGroupKey; word: string; folded: boolean }[] = [
+    { key: 'fail', word: 'failing', folded: false },
+    { key: 'warn', word: 'warning', folded: false },
+    { key: 'never', word: 'never ran', folded: false },
+    { key: 'pass', word: 'passing', folded: true },
+    { key: 'off', word: 'off', folded: true },
+]
+
+/** a skipped check had nothing to look at, which is nothing to fix: it sits
+ *  with the passing ones, its dot grey */
+export function checkGroupOf(c: CheckFacts): CheckGroupKey {
+    if (c.when === 'off') return 'off'
+    if (c.status === 'fail') return 'fail'
+    if (c.status === 'warn') return 'warn'
+    if (c.status == null) return 'never'
+    return 'pass'
+}
+
+const idOf = (r: Resource): string => r.check?.checkId ?? r.id
+
+/** most recent first; a check with no result by its id */
+const byRecent = (a: Resource, b: Resource): number => (b.check?.lastAt ?? -1) - (a.check?.lastAt ?? -1) || idOf(a).localeCompare(idOf(b))
+
+export function checkGroups(rows: readonly Resource[]): TableGroup<CheckGroupKey>[] {
+    const withFacts = rows.filter((r) => r.check != null)
+    return CHECK_GROUPS.map((g) => {
+        const mine = withFacts.filter((r) => checkGroupOf(r.check!) === g.key).sort(byRecent)
+        return { key: g.key, label: `${mine.length} ${g.word}`, rows: mine, foldedByDefault: g.folded }
+    }).filter((g) => g.rows.length > 0)
+}
+
+/** a wire line as plain text: the markdown ticks it is rendered with go */
+const plain = (l: string): string => l.replace(/`/g, '').trim()
+
+const escape = (x: string): string => x.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+
+/** a line without what its row already shows: the verdict word (the dot
+ *  says it) and the check's own id (the id column says it) */
+export function strippedLine(line: string, id: string): string {
+    const lead = new RegExp(`^(?:(?:FAIL|WARN|✗|⚠):?\\s*|\\[${escape(id)}\\]\\s*|${escape(id)}(?:\\s+—\\s+|:\\s+|\\s+|$))`)
+    let l = line
+    for (let m = l.match(lead); m != null && m[0] !== ''; m = l.match(lead)) l = l.slice(m[0].length)
+    return l.trim()
+}
+
+/** the first line of the last run that says something: a failure or a
+ *  warning first, else any line that is not the bare `ok: <id>` header */
+export function findingLine(c: CheckFacts): string {
+    const lines = c.lastLines.map(plain).filter((l) => l !== '')
+    const loud = lines.filter((l) => /^(FAIL|WARN|✗|⚠)/.test(l))
+    const rest = lines.filter((l) => !/^(FAIL|WARN|✗|⚠|ok\b|skip\b)/.test(l))
+    for (const l of [...loud, ...rest]) {
+        const s = strippedLine(l, c.checkId)
+        if (s !== '') return s
+    }
+    return ''
+}
+
+/** how a check is planned, as one short word a column scans: what makes it
+ *  run again (a file change, a span of time, never again) or how often it
+ *  runs when it remembers nothing */
+export function planWord(u: CachePop): string {
+    if (u.when === 'off') return 'off'
+    if ((u.inputs ?? []).length > 0 || u.reads === true) return 'on change'
+    if (u.ttl === 'forever') return 'once'
+    if (u.ttl != null && u.ttl !== '') {
+        try { return `every ${spanShort(parseDuration(u.ttl))}` } catch { return `every ${u.ttl}` }
+    }
+    return u.when === 'release' ? 'every release' : u.when === 'health' ? 'health pass' : 'every run'
+}
+
+export type AskGroupKey = 'open' | 'done'
+
+/** a `YYYY-MM-DD` stamp as ms, null when the file carries none */
+export const dayMs = (d: string | null | undefined): number | null => {
+    if (d == null) return null
+    const t = Date.parse(d)
+    return Number.isNaN(t) ? null : t
+}
+
+const NOTHING = new Set(['', '-'])
+const blocksOf = (r: Resource): string => r.ask?.blocks ?? '-'
+
+/** open asks by what they block (an ask that blocks nothing last), the
+ *  oldest first inside one; done asks after, the last closed first */
+export function askGroups(rows: readonly Resource[]): TableGroup<AskGroupKey>[] {
+    const isDone = (r: Resource): boolean => r.id.startsWith('ask:done/')
+    const open = rows.filter((r) => !isDone(r)).sort((a, b) => {
+        const na = NOTHING.has(blocksOf(a)) ? 1 : 0
+        const nb = NOTHING.has(blocksOf(b)) ? 1 : 0
+        return na - nb || blocksOf(a).localeCompare(blocksOf(b)) || (dayMs(a.ask?.created) ?? 0) - (dayMs(b.ask?.created) ?? 0) || a.id.localeCompare(b.id)
+    })
+    const closedAt = (r: Resource): number => dayMs(r.ask?.closed) ?? dayMs(r.ask?.created) ?? 0
+    const done = rows.filter(isDone).sort((a, b) => closedAt(b) - closedAt(a) || a.id.localeCompare(b.id))
+    const groups: TableGroup<AskGroupKey>[] = [
+        { key: 'open', label: `${open.length} open`, rows: open, foldedByDefault: false },
+        { key: 'done', label: `${done.length} done`, rows: done, foldedByDefault: true },
+    ]
+    return groups.filter((g) => g.rows.length > 0)
+}

package/src/serve/hub-app/cols-svc.ts

@@ -9,6 +9,20 @@ import type { Col, ColMeta, HubProblem, Resource } from './hub-types.ts'
 import type { PlanRow } from '../../plan/planner.ts'
 import { readScreen, SCREEN_WRITE_MS, writeScreen } from './screen-cache.ts'
 
+/** where a viewer's fold choices on the checks and asks tables are kept,
+ *  one per browser and not per repo: `checks:pass` open is a habit */
+export const TABLE_FOLDS_KEY = 'hub:table-folds'
+
+const readFolds = (): Map<string, boolean> => {
+    try {
+        const v = JSON.parse(globalThis.localStorage?.getItem(TABLE_FOLDS_KEY) ?? '{}') as unknown
+        if (v == null || typeof v !== 'object') return new Map()
+        return new Map(Object.entries(v).filter((e): e is [string, boolean] => typeof e[1] === 'boolean'))
+    } catch {
+        return new Map()
+    }
+}
+
 /** what /api/resources.json answers */
 type Answer = { collections: ColMeta[]; resources: Resource[]; planned?: PlanRow[] | null; hub?: HubProblem[] }
 
@@ -43,6 +57,9 @@ export class ColsSvc {
     proofDraft = ''
     /** user fold choices win; default = open when the section holds needs */
     foldOverride = new Map<string, boolean>()
+    /** the viewer's fold choices on the table groups (`checks:pass`,
+     *  `asks:done`), true = folded; a group with none folds by its default */
+    tableFolds = readFolds()
     private timer: ReturnType<typeof setInterval> | null = null
 
     constructor(private st: RepoSt) {
@@ -177,6 +194,17 @@ export class ColsSvc {
     openSection(c: Col): void {
         this.foldOverride.set(c.id, true)
     }
+    /** a table group is folded: a live search shows every match, and a group
+     *  the viewer never touched folds by its default */
+    groupFolded(key: string, byDefault: boolean): boolean {
+        if (this.st.query.trim() !== '') return false
+        return this.tableFolds.get(key) ?? byDefault
+    }
+    toggleGroup(key: string, byDefault: boolean): void {
+        if (this.st.query.trim() !== '') return
+        this.tableFolds.set(key, !this.groupFolded(key, byDefault))
+        try { globalThis.localStorage?.setItem(TABLE_FOLDS_KEY, JSON.stringify(Object.fromEntries(this.tableFolds))) } catch { /* private window: the choice lasts the tab */ }
+    }
     /** rail red dot — the section holds at least one red item */
     hasRed(c: Col): boolean {
         return c.instances.some((i) => i.severity === 'red')

package/src/serve/hub-app/dock.css

@@ -31,5 +31,5 @@
 .dockanim>[data-panel]{transition:flex-grow 180ms ease-out}
 @media (prefers-reduced-motion:reduce){.dockanim>[data-panel]{transition:none}}
 /* the runs page's record chart: its (?) in its top left corner */
-.rchart{position:relative;flex:none;overflow:hidden;margin-bottom:var(--s2)}
+.rchart{position:relative;flex:none;overflow:hidden;margin-top:var(--s3)}
 .rchelp{position:absolute;top:0;left:0;z-index:4}

package/src/serve/hub-app/home-st.ts

@@ -68,7 +68,7 @@ export class HomeSt {
     planned: PlannedSt
     /** what every repo committed and holds, polled while it is the page */
     activity: ActivitySt
-    /** the one picker, cmd+k */
+    /** the one picker, cmd+j */
     palette: PaletteSt
     /** the widths of the project list and a repo's sidebar */
     layout: LayoutSt

package/src/serve/hub-app/home-strip.css

@@ -12,12 +12,12 @@
 .hswatch input::-webkit-color-swatch{border:none;border-radius:2px}
 .halert{display:inline-flex;align-items:center;font-size:12px;color:var(--errink)}
 .herr{font-size:12px;color:var(--errink);max-width:40ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
-/* the bottom line: its height is reserved whether or not it says anything,
-   so the daemon or pm going down never moves the page. The strip renders it,
-   its order puts it last in the page column (hub.css .appcol) */
-.hbar{order:1;display:flex;align-items:center;gap:var(--s3);height:22px;flex:none;padding:0 var(--s3);border-top:1px solid var(--line);overflow:hidden;white-space:nowrap;font-size:12px}
-.hdown{min-width:0;overflow:hidden;text-overflow:ellipsis;color:var(--errink)}
-.hdown b{color:var(--red);margin-right:var(--s2)}
+/* the daemon or pm down: toasts over the bottom right corner of the page
+   column (hub.css .appcol is their box), just above the dock, never taking
+   room, so one coming or going moves nothing */
+.htoasts{position:absolute;right:var(--s3);bottom:var(--s3);z-index:25;display:flex;flex-direction:column;align-items:flex-end;gap:var(--s1);max-width:min(60ch,calc(100% - 2 * var(--s3)));pointer-events:none}
+.htoast{max-width:100%;padding:var(--s1) var(--s2);background:var(--panel);border:1px solid var(--red);border-radius:4px;box-shadow:0 6px 20px var(--shadow);font-size:12px;color:var(--errink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:auto}
+.htoast b{color:var(--red);margin-right:var(--s2)}
 .hdot{display:inline-block;width:8px;height:8px;border-radius:4px;margin-right:var(--s1);background:var(--line)}
 .hdot.up{background:var(--ok)}.hdot.starting,.hdot.stopping{background:var(--warn)}.hdot.crashed{background:var(--red)}
 .hres{display:inline-flex;align-items:center;padding:var(--s0) var(--s2);font-size:12px}
@@ -30,7 +30,7 @@
 /* each widget card exactly as wide as what it holds; a widget's leading
    <header> joins the title line, dim */
 .hmon{display:flex;flex-wrap:wrap;align-items:flex-start;gap:var(--s2)}
-.hwidget{flex:0 1 auto;max-width:100%;padding:var(--s1) var(--s2);border:1px solid var(--line);border-radius:3px;font-size:12px;line-height:1.5;overflow:auto}
+.hwidget{flex:0 1 auto;max-width:100%;padding:var(--s0) var(--s2);border:1px solid var(--line);border-radius:3px;font-size:12px;line-height:1.4;overflow:auto}
 .hwidget h3{margin:0;font-size:12px;font-weight:650;white-space:nowrap}
 .hwidget h3 .hdim{font-weight:400}
 /* meters in two columns: <table class="wmeters">, label · bar · value, twice a row */
@@ -38,8 +38,13 @@
 .wmeters td:nth-child(3n){padding-right:var(--s3)}
 .wmeters td:last-child{padding-right:0}
 .wmeters .wbar{margin-right:0}
+/* a meter's value: small, its digits one width so a column never jitters */
+.wmeters .wv{font-size:11px;font-variant-numeric:tabular-nums}
 .hwidget table{border-collapse:collapse}
 .hwidget td{padding:0 var(--s3) 0 0;white-space:nowrap;vertical-align:middle}
+/* a widget error: in its card where the html goes, or one mark after the cards */
+.hwerr{font-size:12px;color:var(--warn);white-space:nowrap;cursor:help}
+.hwerr .gpwarn{margin:0 var(--s1) 0 0}
 .hbad{color:var(--errink)}
 .hwait{flex:1;min-height:0;padding:var(--s4);color:var(--dim);font-size:13px;overflow:auto}
 .hwait p{margin:0 0 var(--s2)}
@@ -57,7 +62,7 @@
    sideways */
 .gpwrap{container-type:inline-size;font-size:13px}
 .c-gpname{width:180px}.c-gpver{width:56px}.c-gppid{width:64px}.c-gpstate{width:110px}
-.c-gpb.take{width:78px}.c-gpb.restart{width:64px}.c-gpb.stop{width:58px}.c-gpb.open{width:58px}
+.c-gpb.take{width:78px}.c-gpb.stop,.c-gpb.restart{width:24px}
 .gptable td{vertical-align:middle}
 .gptable td.acname{vertical-align:top}
 .gpcore{color:var(--ink)}
@@ -78,20 +83,30 @@
 .gpstate{color:var(--dim);font-size:12px;font-variant-numeric:tabular-nums}
 .gpstate.up{color:var(--ok)}.gpstate.crashed{color:var(--red)}.gpstate.starting{color:var(--warn)}
 .gptable td.gpb{padding-left:0;padding-right:var(--s1);text-align:right;overflow:visible}
-.gpb button{padding:0 var(--s2);font-size:12px}
+.gptable td.gpb.stop,.gptable td.gpb.restart{padding:0;text-align:center}
+/* a small icon button: a process's start or stop, its restart, the open before its url */
+.gpi{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border:0;border-radius:3px;background:none;color:var(--dim);cursor:pointer;vertical-align:middle}
+.gpi .hico{width:14px;height:14px;color:inherit}
+.gpi:hover:not(:disabled){color:var(--ink);background:var(--panel2)}
+.gpi.go{color:var(--ok)}
+.gpi:disabled{opacity:.35;cursor:default}
+.gphost .gpi{margin-right:var(--s1)}
+/* the app button while its app builds: a spinner, never faded */
+.gpi[aria-busy]:disabled{opacity:1;cursor:progress}
 .gpb button.hsm{padding:0 var(--s1);font-size:11px}
 .gpb.act{white-space:nowrap}
 .gpb.act button + button{margin-left:var(--s1)}
-.gphead div{display:flex;justify-content:flex-end;align-items:center;gap:var(--s1)}
+.gphead div{display:flex;align-items:center;gap:var(--s1)}
+.gphead .sp{flex:1}
 .gphead button.hsm{padding:0 var(--s1);font-size:11px}
-.gpnote{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+/* what a process has to say (its note, a refused take over): a mark after
+   its state words, the words on hover, never a line of its own */
+.gpwarn{display:inline-block;vertical-align:middle;width:6px;height:6px;margin-left:var(--s1);border-radius:1px;background:var(--warn)}
+.gpstate span[title]{cursor:help}
 @container (max-width:620px){.c-gphost,.gphost,.c-gpver,.gpver,.c-gppid,.gppid{display:none}.gptable .c-name{width:96px}.c-gpname{width:110px}.c-gpstate{width:88px}}
 /* a phone: the state words go too, the dot and the tint still say it, and
-   only start (stop) and open stay, the label taking what is left */
-@container (max-width:440px){.c-gpstate,.gpstate,.c-gpb.act,.gpb.act,.c-gpb.take,.gpb.take,.c-gpb.restart,.gpb.restart,.gphead button.hsm{display:none}.gptable .c-name{width:64px}.c-gpname{width:auto}.c-gpb.stop,.c-gpb.open{width:50px}}
-.hopen{margin-left:var(--s2)}
-.hopen button{display:inline-flex;align-items:center;padding:var(--s0) var(--s1)}
-.hopen .hico{color:inherit}
+   only start (stop) stays, the label taking what is left */
+@container (max-width:440px){.c-gpstate,.gpstate,.c-gpb.act,.gpb.act,.c-gpb.take,.gpb.take,.c-gpb.restart,.gpb.restart{display:none}.gptable .c-name{width:64px}.c-gpname{width:auto}}
 .hsec{min-width:0}
 .hsec h2{display:flex;align-items:center;gap:var(--s2);height:28px;margin:0 0 var(--s2);padding-bottom:var(--s1);border-bottom:1px solid var(--line);
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-weight:600}
@@ -107,7 +122,7 @@
 .hnote{font-size:12px;color:var(--warn)}
 /* a filled bar any widget can draw: <span class="wbar" style="--p:51%"><i></i></span>,
    green below 70%, `mid` from 70%, `hi` from 90% (the widget picks the class) */
-.wbar{display:inline-block;vertical-align:middle;width:56px;height:7px;margin-right:var(--s2);border-radius:4px;background:var(--line);overflow:hidden}
+.wbar{display:inline-block;vertical-align:middle;width:40px;height:7px;margin-right:var(--s2);border-radius:4px;background:var(--line);overflow:hidden}
 .wbar > i{display:block;height:100%;width:var(--p,0%);background:var(--ok)}
 .wbar.mid > i{background:var(--warn)}
 .wbar.hi > i{background:var(--red)}