rvlib-shipkit 1.3.0 → 1.5.0

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

@@ -1,45 +1,42 @@
 // ONE GATE CHECK, on its own page, as ONE compact block: the id as a tag, the
 // title, the sentence it wrote about itself, the exact command it runs, then
 // one grid of facts, each a dim label and a short value whose explanation is
-// the row's `(?)`. No box holds a single field. Navigation is the tree on the
+// the row's `(?)`, then where it runs: one line per context. No box holds a single field. Navigation is the tree on the
 // left, so there is no back link.
 import { observer } from 'mobx-react-lite'
 import { useEffect, useRef } from 'react'
 import { CACHED } from '../../core/outcome-words.ts'
+import { cellMeaning, MATRIX_AXES, RUNS_LEGEND } from '../../core/runs-matrix.ts'
 import { durationTone, fmtMs } from './dur.ts'
 import { Help, TERMS } from './help.tsx'
 import type { RepoSt } from './repo-st.ts'
-import type { SlowSuite, CheckFacts, RecentRun, WhenAt } from './hub-types.ts'
+import type { SlowSuite, CheckFacts, RecentRun } from './hub-types.ts'
 import { renderMd, renderMdInline } from './md.ts'
 import { nextRun } from './next-run.ts'
 import { ProseHits } from './prose-hits-view.tsx'
 import { stampWords, TimeAgo, TimeAhead } from './time-ago.tsx'
-import { checkName, commandOf, docPath, editorHref, lastRun, rememberedFact, repoPath, whatFacts, WHEN_OPTION, type ShortPath } from './check-words.ts'
+import { checkName, commandOf, docPath, editorHref, lastRun, rememberedFact, repoPath, whatFacts, type ShortPath } from './check-words.ts'
 
 /** which declaration is answering, so the switch never looks like it wrote
  *  something it did not. The CHIP is the short one, its help is the sentence */
 const SOURCE_CHIP: Record<CheckFacts['whenSource'], string> = {
-    when: 'repo.config.ts',
+    off: 'repo.config.ts',
+    when: 'when (retired)',
+    ruleExempt: 'ruleExempt (retired)',
     'check-file': 'the check file',
-    ruleExempt: 'ruleExempt',
-    optIn: 'optIn',
-    'gate-export': 'gate = false',
     defaults: 'defaults',
-    default: 'default',
+    default: 'derived',
 }
 
 const SOURCE_WORD: Record<CheckFacts['whenSource'], string> = {
-    when: 'set in the `when` block of `repo.config.ts`, which this switch writes',
-    'check-file': 'declared by the check file itself, and the `when` block overrides it',
-    ruleExempt: 'from the older `ruleExempt`, which reads as off',
-    optIn: 'from the older `optIn` key, which reads as health',
-    'gate-export': 'from `export const gate = false` in its own file',
+    off: 'turned off in the `off` block of `repo.config.ts`, which this switch writes',
+    when: 'turned off by the retired `when` key, which `shipkit ci` ports to `off` (SK029)',
+    ruleExempt: 'turned off by the retired `ruleExempt` key, which `shipkit ci` ports to `off` (SK029)',
+    'check-file': 'declared by the check file itself: every context it runs in, no default',
     defaults: 'from the `defaults` block, which removes the floor slot entirely',
-    default: 'nobody declared where this check runs, so it takes the default',
+    default: 'a row with no file of its own: the code that derives it writes every context',
 }
 
-const WHEN_VALUES: WhenAt[] = ['always', 'release', 'health', 'off']
-
 const VERDICT_WORD: Record<'pass' | 'warn' | 'fail' | 'skip', string> = {
     pass: 'passed', warn: 'warned', fail: 'failed', skip: 'skipped',
 }
@@ -126,44 +123,67 @@ export const CommandLine = ({ app, u }: { app: RepoSt; u: CheckFacts }) => {
     )
 }
 
-// ── the switch ───────────────────────────────────────────────────────────
+// ── where it runs ────────────────────────────────────────────────────────
+
+/** every context, one line each: the value the check declared and what it
+ *  means in the legend's words. The cache closes it, the off switch ends it */
+const WhereItRuns = observer(({ app, u }: { app: RepoSt; u: CheckFacts }) => {
+    const r = u.runs
+    return (
+        <Section title="where it runs" help="every context a check declares, with no default. The when page of this repo shows every check at once, and `sk when` prints the same">
+            {r.off != null
+                ? <div className="wline">runs nowhere: {r.off}</div>
+                : <div className="cruns">
+                    {MATRIX_AXES.map((k) => {
+                        const c = r.cells[k]
+                        const a = RUNS_LEGEND.find((x) => x.axis === k)!
+                        return (
+                            <div key={k} className={`crun${c.on ? ' on' : ''}`}>
+                                <span className="ck" title={`${k}: ${a.context.replace(/`/g, '')}. From ${c.source}`}>{a.short}</span>
+                                <span className="crv">{c.on ? c.text : 'no'}</span>
+                                <span className="crm">{cellMeaning(k, c.text)}</span>
+                            </div>
+                        )
+                    })}
+                    <div className="crun cache">
+                        <span className="ck" title={`cache: how an answer is kept. ${r.cache}`}>cache</span>
+                        <span className="crv">{r.cache.split(/[\s:]/)[0]}</span>
+                        <span className="crm">{cellMeaning('cache', r.cache)}</span>
+                    </div>
+                </div>}
+            {r.derivedWhy == null ? null : <div className="note">no file declares this row: {r.derivedWhy}</div>}
+            <div className="cfacts"><OffSwitch app={app} u={u} /></div>
+        </Section>
+    )
+})
 
-/** RUN WHEN, one select named by effect. It writes `repo.config.ts` itself,
- *  through the managed block, and leaves the file dirty: a change of place is
- *  a change its owner reviews in a git client, never a commit made on their
- *  behalf. Choosing never asks for the reason before it writes. */
-const RunWhen = observer(({ app, u }: { app: RepoSt; u: CheckFacts }) => {
+// ── the off switch ───────────────────────────────────────────────────────
+
+/** the one thing this repo says about a check: that it is OFF here, with the
+ *  reason. It writes `repo.config.ts` through the managed block and leaves the
+ *  file dirty for its owner to review */
+const OffSwitch = observer(({ app, u }: { app: RepoSt; u: CheckFacts }) => {
     const s = app.checks
     const g = s.gate
-    const shown = s.whenShown(u)
     const reason = s.reasonFor(u.checkId)
+    const off = u.runs.off
     return (
-        <Row k="run when" help="where this check runs. Changing it writes repo.config.ts and leaves the file for you to commit">
+        <Row k="off in this repo" wide help="where this check runs is its own declaration; the one thing this repo says is that it is OFF here, with why. The switch writes the `off` block of repo.config.ts and leaves the file for you to commit">
             <span className="cwhen">
-                <select className="wsel" value={shown} disabled={s.gateBusy} onChange={(e) => s.chooseWhen(u.checkId, e.target.value as WhenAt)}>
-                    {WHEN_VALUES.map((v) => <option key={v} value={v}>{WHEN_OPTION[v]}</option>)}
-                </select>
-                <Help text={
-                    <span className="legend">
-                        {WHEN_VALUES.map((v) => <span key={v} className="lrow"><b>{WHEN_OPTION[v]}</b> ({v}): {TERMS[v]}</span>)}
-                    </span>
-                } />
+                {off != null ? <span className="tl red">off: {off}</span> : <span className="dim">runs where it declares</span>}
                 <span className="stchip">{SOURCE_CHIP[u.whenSource]}</span>
                 <MdHelp text={SOURCE_WORD[u.whenSource]} />
-                {u.whenSource === 'when'
-                    ? <button className="wclear" disabled={s.gateBusy} onClick={() => void s.clearWhen(u.checkId)}>drop the entry</button>
-                    : null}
+                <a href="#" onClick={(e) => { e.preventDefault(); app.showWhen() }}>what runs when</a>
             </span>
-            {shown === 'off'
-                ? <span className="cblock">
-                    <input className="wreason" placeholder="why it is off (required, and it rides in the config)"
-                        value={reason} onChange={(e) => s.setReason(u.checkId, e.target.value)} />
-                    {u.when === 'off' && u.whenReason != null ? <span className="note">reason today: {u.whenReason}</span> : null}
-                    <button disabled={s.gateBusy || reason.trim() === ''} onClick={() => void s.setWhen(u.checkId, 'off')}>
-                        {u.when === 'off' ? 'change the reason' : 'turn it off'}
-                    </button>
-                </span>
-                : null}
+            {off != null && u.whenSource === 'off'
+                ? <span className="cblock"><button disabled={s.gateBusy} onClick={() => void s.turnOn(u.checkId)}>turn it back on</button></span>
+                : off == null
+                    ? <span className="cblock">
+                        <input className="wreason" placeholder="why this repo turns it off (required, it rides in the config)"
+                            value={reason} onChange={(e) => s.setReason(u.checkId, e.target.value)} />
+                        <button disabled={s.gateBusy || reason.trim() === ''} onClick={() => void s.setOff(u.checkId)}>turn it off here</button>
+                    </span>
+                    : null}
             {g != null && g.state === 'stale'
                 ? <span className="cblock warnline">the managed block in {g.path} was hand edited: reconcile it, then the switch works again</span>
                 : null}
@@ -321,7 +341,6 @@ export const CheckCard = observer(({ app, id }: { app: RepoSt; id: string }) =>
                 {whatFacts(u).map((f) => (
                     <Row key={f.k} k={f.k} help={f.help}>{f.tone == null ? f.v : <span className={`tl ${f.tone}`}>{f.v}</span>}</Row>
                 ))}
-                <RunWhen app={app} u={u} />
                 <Remembered u={u} />
                 {/* the help never depends on the second, so it reads the wall
                     clock and the row does not repaint on every tick */}
@@ -338,6 +357,7 @@ export const CheckCard = observer(({ app, id }: { app: RepoSt; id: string }) =>
                 {u.group == null ? null : <Row k="group" help="a label several checks share, so `--skip <group>` parks all of them at once">{u.group}</Row>}
                 <Timings u={u} />
             </div>
+            <WhereItRuns app={app} u={u} />
             {u.build && u.checkId === 'test' ? <SlowSuites app={app} /> : null}
             {u.checkId === 'SK014' ? <ProseHits app={app} /> : null}
             <LastOutput app={app} lines={u.lastLines} />

package/src/serve/hub-app/check-words.ts

@@ -49,17 +49,7 @@ export function rememberedFact(u: CachePop): RememberedFact {
     const cadence = CADENCE[u.when ?? 'always']
     if (u.never != null)
         return { v: 'never', inputs: [], help: `never cached, so it runs ${cadence}${u.never === '' ? '' : `: ${u.never}`}` }
-    return { v: 'never', inputs: [], help: `nothing declared, so it runs ${cadence}. \`inputs\`, \`ttl\` or \`never\` in the check says otherwise` }
-}
-
-/** the four places a check runs, named by what they do. The config keeps its
- *  own words (`always`, `release`, `health`, `off`), and these are only what
- *  the select under `run when` shows */
-export const WHEN_OPTION: Record<WhenAt, string> = {
-    always: 'always',
-    release: 'before a release',
-    health: 'health pass only',
-    off: 'never',
+    return { v: 'never', inputs: [], help: `nothing keys it, so it runs ${cadence}. A check file keys it with \`cache: { by: 'files' | 'reads' | 'ttl' | 'fact' }\`` }
 }
 
 /** what a check IS: three FACTS, each a short value a reader scans, with the

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

@@ -10,8 +10,9 @@
 import { makeAutoObservable, runInAction } from 'mobx'
 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 type { GateBlock, Resource, ResourceState, SlowSuite, CheckEvent } from './hub-types.ts'
+import { lineText } from '../../core/wire.ts'
+import { ownTrouble, reach } from './reach.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 */
@@ -54,9 +55,6 @@ export class ChecksSvc {
     gateBusy = false
     /** the reason box, per check id: a check is only turned off WITH a reason */
     reasons = new Map<string, string>()
-    /** checks whose select says never while the reason is still being typed:
-     *  off is written only once it has one */
-    pendingOff = new Set<string>()
     /** the slow suite form under the test check */
     suite: SlowSuite = { file: '', catches: '', whyNotFast: '' }
 
@@ -93,12 +91,12 @@ export class ChecksSvc {
      *  silent overwrite */
     async loadGate(): Promise<void> {
         try {
-            const r = await fetch(this.st.url('/api/checks/when'))
+            const r = await reach(this.st.url('/api/checks/when'))
             if (!r.ok) throw new Error(await r.text())
             const b = (await r.json()) as GateBlock
             runInAction(() => { this.gate = b })
         } catch (e) {
-            runInAction(() => { this.gateNote = `the repo config could not be read: ${(e as Error).message}` })
+            runInAction(() => { this.gateNote = ownTrouble(e, this.st.home.machine, (m) => `the repo config could not be read: ${m}`) })
         }
     }
 
@@ -113,7 +111,7 @@ export class ChecksSvc {
             // the hash of the file the page last read: without it a write
             // could land on top of an edit this page never saw
             if (this.gate == null) await this.loadGate()
-            const r = await fetch(this.st.url('/api/checks/when'), { method: 'POST', body: JSON.stringify({ ...edit, expect: this.gate?.hash }) })
+            const r = await reach(this.st.url('/api/checks/when'), { method: 'POST', body: JSON.stringify({ ...edit, expect: this.gate?.hash }) })
             if (!r.ok) throw new Error(await r.text())
             const b = (await r.json()) as GateBlock
             runInAction(() => { this.gate = b; this.gateNote = said })
@@ -122,7 +120,7 @@ export class ChecksSvc {
             // has read the config it just wrote
             await this.st.cols.poll(true)
         } catch (e) {
-            runInAction(() => { this.gateNote = `refused: ${(e as Error).message}` })
+            runInAction(() => { this.gateNote = ownTrouble(e, this.st.home.machine, (m) => `refused: ${m}`) })
             // whatever the file really says now, so the next try is not
             // refused for a hash the page has already outgrown
             await this.loadGate()
@@ -131,37 +129,19 @@ export class ChecksSvc {
         return took
     }
 
-    /** what the select shows: never while a reason is being typed, else
-     *  where the check runs today */
-    whenShown(u: { checkId: string; when: WhenAt }): WhenAt {
-        return this.pendingOff.has(u.checkId) ? 'off' : u.when
-    }
-
-    /** the select moved. Every place but never writes at once, and never
-     *  waits for its reason */
-    chooseWhen(checkId: string, at: WhenAt): void {
-        if (at === 'off') {
-            this.pendingOff.add(checkId)
-            this.gateNote = 'never needs a reason: type it, then turn it off'
-            return
-        }
-        this.pendingOff.delete(checkId)
-        void this.setWhen(checkId, at)
-    }
-
-    async setWhen(checkId: string, at: WhenAt): Promise<void> {
+    /** turn a check off in this repo, with the reason typed in its box */
+    async setOff(checkId: string): Promise<void> {
         const reason = this.reasonFor(checkId).trim()
-        if (at === 'off' && reason === '') {
-            runInAction(() => { this.gateNote = 'never needs a reason: a check nobody can explain is a silenced gate' })
+        if (reason === '') {
+            runInAction(() => { this.gateNote = 'off needs a reason: a check nobody can explain is a silenced gate' })
             return
         }
-        await this.writeGate({ when: { [checkId]: at === 'off' ? `off:${reason}` : at } }, `${checkId} is set to ${WHEN_OPTION[at]} — repo.config.ts is edited and waiting for your commit`)
-        runInAction(() => { this.pendingOff.delete(checkId) })
+        await this.writeGate({ off: { [checkId]: reason } }, `${checkId} is off in this repo — repo.config.ts is edited and waiting for your commit`)
     }
 
-    /** back to whatever the check itself declares, by dropping the entry */
-    async clearWhen(checkId: string): Promise<void> {
-        await this.writeGate({ when: { [checkId]: null } }, `${checkId} is back to what it declares itself — repo.config.ts is edited and waiting for your commit`)
+    /** turn it back on: it runs where it declares again */
+    async turnOn(checkId: string): Promise<void> {
+        await this.writeGate({ off: { [checkId]: null } }, `${checkId} runs where it declares again — repo.config.ts is edited and waiting for your commit`)
     }
 
     async addSlow(): Promise<void> {
@@ -199,7 +179,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,131 @@
+// 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`. The checks page opens on the line that counts where
+// its checks run. 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 { CheckOwner } from './hash-route.ts'
+import type { Resource } from './hub-types.ts'
+import { sectionLabel } from './keys.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, a line under it when
+ *  the page has one, then the table */
+const Page = ({ title, n, lead, cols, empty, children }: { title: string; n: number; lead?: string; cols: ReactNode; empty: string; children: ReactNode }) => (
+    <div className="ctpage">
+        <div className="cghead">{title}<span className="cnt">{n}</span></div>
+        {lead == null || lead === '' ? null : <div className="ctlead">{lead}</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>
+    )
+})
+
+/** every check, or only the ones one owner ships (`from`) */
+export const CheckTable = observer(({ app, id, from }: { app: RepoSt; id: string; from?: CheckOwner }) => {
+    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).filter((r) => from == null || r.check?.from === from)
+    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 (
+        // where the checks run, counted over every check whatever the filter
+        <Page title={from == null ? col.title : sectionLabel(from)} n={items.length} lead={app.tree.whenLine} 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

@@ -8,6 +8,21 @@ import type { RepoSt } from './repo-st.ts'
 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'
+import { ownTrouble, reach } from './reach.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 +58,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) {
@@ -115,7 +133,7 @@ export class ColsSvc {
      *  the server keeps warm */
     async poll(fresh = false): Promise<void> {
         try {
-            const r = await fetch(this.st.url(fresh ? '/api/resources.json?fresh=1' : '/api/resources.json'))
+            const r = await reach(this.st.url(fresh ? '/api/resources.json?fresh=1' : '/api/resources.json'))
             if (!r.ok) throw new Error(await r.text())
             const j = (await r.json()) as Answer
             runInAction(() => {
@@ -131,7 +149,7 @@ export class ColsSvc {
         } catch (e) {
             // a dead server must SAY so, in the header, never leave a tree
             // that reads like a healthy repo. The last rows stay, dated by it
-            runInAction(() => { this.fetchErr = `the page cannot reach this hub: ${(e as Error).message}` })
+            runInAction(() => { this.fetchErr = ownTrouble(e, this.st.home.machine, (m) => `the page cannot reach this hub: ${m}`) || null })
         }
     }
 
@@ -177,6 +195,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')
@@ -209,12 +238,12 @@ export class ColsSvc {
     private async act(path: string, body: Record<string, unknown>): Promise<boolean> {
         this.actErr = ''
         try {
-            const r = await fetch(this.st.url(`/api/act/${path}`), { method: 'POST', body: JSON.stringify(body) })
+            const r = await reach(this.st.url(`/api/act/${path}`), { method: 'POST', body: JSON.stringify(body) })
             if (!r.ok) throw new Error(await r.text())
             await this.poll(true)
             return true
         } catch (e) {
-            runInAction(() => { this.actErr = (e as Error).message })
+            runInAction(() => { this.actErr = ownTrouble(e, this.st.home.machine) })
             return false
         }
     }