@elaraai/e3-ui-cli 1.0.79 → 1.0.81

package/dist/tui/ui/views/dashboard.js

@@ -3,12 +3,13 @@
  * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
  */
 import { breakpoint, columnPlan, scrollIntoView } from '../../render/layout.js';
-import { agoShort, formatDuration, formatSize, hashShort, padEnd, padStart, timeAgo } from '../../render/text.js';
+import { agoShort, formatDuration, formatInt, formatSize, hashShort, padEnd, padStart, timeAgo } from '../../render/text.js';
 import { layoutOf, registerListModel } from '../../model/index.js';
 import { datasetEntries } from '../../model/catalogue.js';
-import { datasetStatusCell, eventCell, executionDuration, executionStatusCell, statusText, taskStatusCell } from '../../model/status.js';
+import { datasetStatusCell, eventCell, executionDuration, executionStatusCell, intakeCell, recordDeployCell, splitPlace, statusText, taskStatusCell, unitPlace, waitCell, } from '../../model/status.js';
 import { registerViewHooks } from '../../controller.js';
 import { isRunLive, lockHolderText } from '../../data/dataflow.js';
+import { recordEntries } from '../../data/records.js';
 import { b, blank, d, lineWidth, lrLine, t } from '../lines.js';
 import { centredBlock, sectionLine, tableLine, tablePlan, withScrollbar } from '../shell/widgets.js';
 import { registerView } from './index.js';
@@ -35,15 +36,21 @@ function ageBare(then, now) {
 function lowerFirst(text) {
     return text.length === 0 ? text : text[0].toLowerCase() + text.slice(1);
 }
-/** The dashboard title line: ` main   ● DEPLOYED · demand@1.4.2 · deployed 3d ago · lock: none`. */
+/**
+ * The dashboard title line: ` main   ● DEPLOYED · demand@1.4.2 · deployed 3d ago · lock: none`;
+ * while a deploy holds the workspace, the package it deploys, who deploys it
+ * and since when, in place of the lock (`◔ DEPLOYING · demand@1.5.0 · pid 4242 · started 9s ago`).
+ */
 export function dashboardTitle(state, ws, ctx) {
     const g = ctx.g;
     const info = (state.data.workspaces ?? []).find(w => w.name === ws);
     const wsState = state.data.workspaceState[ws];
     const status = state.data.status[ws]?.result;
+    const deploying = deployOf(state.data.lock[ws]);
     const right = [];
     if (info === undefined || !info.deployed) {
-        right.push(b(`${g.empty} EMPTY`, 'muted'));
+        if (deploying === null)
+            right.push(b(`${g.empty} EMPTY`, 'muted'));
     }
     else {
         const pkg = info.packageName.type === 'some' ? `${info.packageName.value}${info.packageVersion.type === 'some' ? `@${info.packageVersion.value}` : ''}` : '';
@@ -52,7 +59,18 @@ export function dashboardTitle(state, ws, ctx) {
             right.push(d(` ${g.sep} deployed ${timeAgo(wsState.deployedAt, ctx.now)}`));
     }
     const lock = status?.lock;
-    if (lock !== undefined) {
+    if (deploying !== null) {
+        if (right.length > 0)
+            right.push(t(` ${g.sep} `));
+        right.push(b(`${g.quarter} DEPLOYING`, 'info'));
+        const progress = deployProgressOf(deploying);
+        const holder = deploying.state.holder;
+        // The process's pid, not its command: the command is the whole argv, paths and all.
+        const who = holder.type === 'process' ? `pid ${holder.value.pid}` : holder.value.functionName;
+        const pkg = progress !== null ? ` ${g.sep} ${progress.package.name}@${progress.package.version}` : '';
+        right.push(d(`${pkg} ${g.sep} ${who} ${g.sep} started ${timeAgo(deploying.state.acquiredAt, ctx.now)}`));
+    }
+    else if (lock !== undefined) {
         if (lock.type === 'some') {
             right.push(t(` ${g.sep} `), b(`lock: ${lockHolderText(lock.value, ctx.now, g)}`, 'warn'));
         }
@@ -63,6 +81,83 @@ export function dashboardTitle(state, ws, ctx) {
     right.push(t(' '));
     return lrLine([t(' '), b(ws)], right, ctx.layout.columns);
 }
+// ---------------------------------------------------------------------------
+// A deploy in progress
+// ---------------------------------------------------------------------------
+/** The lock, when a deploy holds the workspace; null otherwise. */
+function deployOf(lock) {
+    return lock !== undefined && lock !== null && lock.state.operation.type === 'deployment' ? lock : null;
+}
+/** How far a deploy says it has got, once it has reported. */
+function deployProgressOf(lock) {
+    return lock.progress.type === 'some' && lock.progress.value.type === 'deployment' ? lock.progress.value.value : null;
+}
+/**
+ * The DEPLOY header's right side — what the deploy is doing and how far it has
+ * got: `◔ TAKING IN · 2 of 6 files · 134.9 of 202.4 MB · 14.3 MB/s · ~5.2s left`
+ * while its files come in, then `◔ MIGRATING` or `◔ BUILDING INDEXES` while a
+ * record's step runs, and `◔ FINISHING` once its files and records are done.
+ *
+ * @param progress - What the deploy last reported
+ * @param dctx - The dashboard context
+ * @returns The spans
+ */
+function deployPhase(progress, dctx) {
+    const { sep, quarter } = dctx.g;
+    const files = progress.files;
+    const done = files.filter(file => file.step.type === 'done').length;
+    const total = files.reduce((sum, file) => sum + Number(file.total), 0);
+    const plural = `${files.length} file${files.length === 1 ? '' : 's'}`;
+    if (done < files.length) {
+        // The bytes past their hash: a file taking in, and every file in.
+        const moved = files.reduce((sum, file) => sum + (file.step.type === 'done' ? Number(file.total) : file.step.type === 'taking_in' ? Number(file.bytes) : 0), 0);
+        // `134.9 of 202.4 MB`: the unit once when both share it.
+        const whole = formatSize(total);
+        const part = formatSize(moved);
+        const unit = whole.slice(whole.indexOf(' '));
+        const seconds = (dctx.now - progress.startedAt.getTime()) / 1000;
+        const rate = seconds > 0 ? moved / seconds : 0;
+        const pace = rate > 0 ? ` ${sep} ${formatSize(rate)}/s ${sep} ~${formatDuration(((total - moved) / rate) * 1000)} left` : '';
+        return [b(`${quarter} TAKING IN`, 'info'), d(` ${sep} ${done} of ${plural} ${sep} ${part.endsWith(unit) ? part.slice(0, -unit.length) : part} of ${whole}${pace}`)];
+    }
+    const running = progress.records.find(record => record.step.type === 'migrating' || record.step.type === 'indexing')?.step.type;
+    const head = running === 'migrating' ? 'MIGRATING' : running === 'indexing' ? 'BUILDING INDEXES' : 'FINISHING';
+    return [b(`${quarter} ${head}`, 'info'), ...(files.length > 0 ? [d(` ${sep} took in ${plural} ${sep} ${formatSize(total)}`)] : [])];
+}
+/**
+ * The column while a deploy holds the workspace: the DEPLOY header, then the
+ * normal screen's tables by type — INPUTS, a row per file source the deploy
+ * takes in, and RECORDS, a row per record it deploys — each row with the step
+ * the deploy is at with it.
+ *
+ * @param lock - The deploy's lock
+ * @param dctx - The dashboard context
+ * @returns The lines
+ */
+function deployLines(lock, dctx) {
+    const g = dctx.g;
+    const width = dctx.columns - 1;
+    const progress = deployProgressOf(lock);
+    if (progress === null)
+        return [lrLine([t(' '), b('DEPLOY')], [b(`${g.quarter} STARTING`, 'info'), t(' ')], width)];
+    const lines = [lrLine([t(' '), b('DEPLOY')], [...deployPhase(progress, dctx), t(' ')], width)];
+    const table = (title, kind, rows) => {
+        if (rows.length === 0)
+            return;
+        const plan = tablePlan(columnPlan(kind, dctx.bp), rows, width);
+        lines.push(blank(width), sectionLine(title, '', width), tableLine(plan, null, false, width, g), ...rows.map(row => tableLine(plan, row, false, width, g)));
+    };
+    table('INPUTS', 'deployInputs', progress.files.map(file => {
+        const cell = intakeCell(file, g);
+        return { cells: { name: file.path.split('/').pop() ?? file.path, status: { text: statusText(cell, ' '), tone: cell.tone }, size: formatSize(Number(file.total)) } };
+    }));
+    table('RECORDS', 'deployRecords', progress.records.map(record => {
+        const cell = recordDeployCell(record, g);
+        const path = record.plan.record;
+        return { cells: { name: path.split('/').pop() ?? path, status: { text: statusText(cell), tone: cell.tone }, indexes: record.indexes.length > 0 ? record.indexes.join(', ') : '—' } };
+    }));
+    return lines;
+}
 /** The task stats: the four the design shows, plus in-progress / stale-running when non-zero. */
 function taskStats(s, g) {
     const stats = [
@@ -150,7 +245,8 @@ function countsLines(status, dctx) {
 // The model
 // ---------------------------------------------------------------------------
 /**
- * The latest event of each task, in order of first appearance.
+ * The latest event of each task, in order of first appearance. A unit's
+ * requeue is not a task's event, so it never stands for its task.
  *
  * @param events - The execution's events
  * @returns One event per task
@@ -159,6 +255,8 @@ export function latestPerTask(events) {
     const order = [];
     const latest = new Map();
     for (const event of events) {
+        if (event.type === 'requeued')
+            continue;
         const task = event.value.task;
         if (!latest.has(task))
             order.push(task);
@@ -174,16 +272,67 @@ function isLive(execution) {
 function opensLogs(event) {
     return event.type === 'failed' || event.type === 'error';
 }
+/** An event's row, with nothing after the task's name. */
+function eventRow(event, g) {
+    const cell = eventCell(event, g);
+    return { cell, task: cell.task, place: '', timestamp: cell.timestamp, running: event.type === 'start', logs: opensLogs(event) };
+}
+/**
+ * The rows of the live panel, in the order each happened or began: each
+ * task's latest event, a split task's start naming its progress; each unit's
+ * latest requeue; and each task or unit waiting for room, whose wait takes the
+ * place of the start of a task that waits whole.
+ *
+ * @param execution - The execution
+ * @param latest - Each task's latest event
+ * @param g - The glyph set
+ * @returns The rows
+ */
+export function liveRows(execution, latest, g) {
+    const state = execution.state;
+    const budget = state !== null && state.budget.type === 'some' ? state.budget.value : null;
+    const waiting = state?.waiting ?? [];
+    const splits = new Map((state?.splits ?? []).map(split => [split.task, split]));
+    const waitsWhole = new Set(waiting.filter(wait => wait.unit.type === 'none').map(wait => wait.task));
+    const rows = [];
+    for (const event of latest) {
+        if (event.type === 'start' && waitsWhole.has(event.value.task))
+            continue;
+        const split = event.type === 'start' ? splits.get(event.value.task) : undefined;
+        rows.push({ ...eventRow(event, g), place: split === undefined ? '' : splitPlace(split, g.sep) });
+    }
+    // A unit requeued more than once shows its latest.
+    const requeues = new Map();
+    for (const event of execution.events) {
+        if (event.type !== 'requeued')
+            continue;
+        const place = unitPlace(event.value.unit, g.sep);
+        requeues.set(`${event.value.task} ${place}`, { ...eventRow(event, g), place });
+    }
+    rows.push(...requeues.values());
+    for (const wait of waiting) {
+        rows.push({
+            cell: waitCell(wait, budget, g),
+            task: wait.task,
+            place: wait.unit.type === 'some' ? unitPlace(wait.unit.value, g.sep) : '',
+            timestamp: wait.since,
+            running: false,
+            logs: false,
+        });
+    }
+    return rows.sort((a, c) => Date.parse(a.timestamp) - Date.parse(c.timestamp));
+}
 let cached = null;
 function sameKey(a, b) {
     return a.ws === b.ws && a.status === b.status && a.statusError === b.statusError && a.workspaceState === b.workspaceState
-        && a.execution === b.execution && a.datasets === b.datasets && a.taskList === b.taskList
+        && a.lock === b.lock && a.execution === b.execution && a.datasets === b.datasets && a.taskList === b.taskList && a.records === b.records
         && a.columns === b.columns && a.bp === b.bp && a.g === b.g;
 }
 /**
  * The dashboard model for a workspace — built once per data change and
  * returned as the same object until the status, the execution, the
- * dataset list, the task list, the width or the breakpoint changes. The
+ * dataset list, the task list, the records read, the width or the
+ * breakpoint changes. The
  * clock, the spinner and the selection are not inputs: they restyle lines
  * at render ({@link dashboardLines}).
  *
@@ -198,9 +347,11 @@ export function dashboardModel(state, ws, dctx) {
         status: state.data.status[ws]?.result,
         statusError: state.data.statusError[ws],
         workspaceState: state.data.workspaceState[ws],
+        lock: state.data.lock[ws],
         execution: state.data.execution[ws],
         datasets: state.data.datasets[ws],
         taskList: state.data.taskList[ws],
+        records: state.data.records[ws],
         columns: dctx.columns,
         bp: dctx.bp,
         g: dctx.g,
@@ -218,9 +369,17 @@ function buildModel(state, ws, dctx, key) {
     const status = key.status;
     const execution = key.execution;
     const empty = {
-        status, placeholder: [], counts: [], execution, live: false, done: 0, events: [], latest: new Map(),
-        taskPlan: [], tasks: [], inputPlan: [], inputs: [], inputNames: [], rows: [], total: 0, panelAt: 0, tasksAt: 0, inputsAt: 0,
+        status, placeholder: [], counts: [], execution, live: false, done: 0, feed: [], latest: new Map(),
+        taskPlan: [], tasks: [], inputPlan: [], inputs: [], inputNames: [], recordPlan: [], records: [], recordNames: [],
+        rows: [], total: 0, panelAt: 0, tasksAt: 0, inputsAt: 0, recordsAt: -1,
     };
+    // While a deploy holds the workspace, the column is the deploy: what the
+    // workspace held before is going, and a first deploy has nothing else.
+    const deploying = deployOf(key.lock);
+    if (deploying !== null) {
+        const placeholder = deployLines(deploying, dctx);
+        return { ...empty, status: undefined, placeholder, total: placeholder.length };
+    }
     if (status === undefined) {
         const placeholder = [];
         if (key.workspaceState === null) {
@@ -236,12 +395,14 @@ function buildModel(state, ws, dctx, key) {
     }
     // The dataset map and the latest event per task: once per build, shared by every row.
     const entries = datasetEntries(state, ws);
-    const latest = new Map(latestPerTask(execution?.events ?? []).map(e => [e.value.task, e]));
+    const latestEvents = latestPerTask(execution?.events ?? []);
+    const latest = new Map(latestEvents.map(e => [e.value.task, e]));
     const live = isLive(execution);
-    const done = execution === undefined ? 0 : execution.events.filter(e => e.type !== 'start').length;
-    const events = execution === undefined || execution.state === null ? []
-        : live ? [...latest.values()].slice(-MAX_EVENT_ROWS)
-            : [...latest.values()].filter(opensLogs);
+    // A requeue is a unit's, and ends no task.
+    const done = execution === undefined ? 0 : execution.events.filter(e => e.type !== 'start' && e.type !== 'requeued').length;
+    const feed = execution === undefined || execution.state === null ? []
+        : live ? liveRows(execution, latestEvents, g).slice(-MAX_EVENT_ROWS)
+            : latestEvents.filter(opensLogs).map(event => eventRow(event, g));
     const tasks = status.tasks.map(task => {
         const cell = taskStatusCell(task.status, g);
         // The reason / pid / cached detail lives in the last column; only a failure's exit code / message stays inline.
@@ -258,6 +419,7 @@ function buildModel(state, ws, dctx, key) {
                 dependsOn: task.dependsOn.length > 0 ? task.dependsOn.join(', ') : '—',
                 inputs: inputs.length > 0 ? inputs.join(', ') : '—',
                 output: entry?.type ?? '—',
+                peak: task.peakBytes.type === 'some' ? formatSize(Number(task.peakBytes.value)) : '—',
             },
         };
     });
@@ -276,19 +438,36 @@ function buildModel(state, ws, dctx, key) {
             },
         };
     });
+    // The dataset list names the records; what the records loader read of each fills its row.
+    const recordNames = recordEntries(key.datasets ?? []).map(entry => entry.name);
+    const records = recordNames.map(name => {
+        const facts = key.records?.[name];
+        const entry = entries.get(`.records.${name}`);
+        const indexes = facts?.signature?.indexes.map(index => index.name) ?? null;
+        return {
+            head: facts?.head ?? null,
+            cells: {
+                name,
+                rows: facts?.rows != null ? formatInt(facts.rows) : '—',
+                size: entry?.size != null ? formatSize(entry.size) : '—',
+                indexes: indexes === null ? '…' : indexes.length > 0 ? indexes.join(', ') : '—',
+            },
+        };
+    });
     const taskPlan = tablePlan(columnPlan('tasks', dctx.bp), tasks, width);
     const inputPlan = tablePlan(columnPlan('inputs', dctx.bp), inputs, width);
+    const recordPlan = records.length > 0 ? tablePlan(columnPlan('records', dctx.bp), records, width) : [];
     const counts = countsLines(status, dctx);
-    // The geometry: every selectable row's line, numbered in column order — failures, tasks, inputs.
+    // The geometry: every selectable row's line, numbered in column order — failures, tasks, inputs, records.
     const rows = [];
     let line = counts.length + 1;
     const panelAt = line;
-    const shown = events.slice(0, MAX_EVENT_ROWS);
-    shown.forEach((event, i) => {
-        if (opensLogs(event))
-            rows.push({ kind: 'logs', name: event.value.task, line: panelAt + 1 + i });
+    const shown = feed.slice(0, MAX_EVENT_ROWS);
+    shown.forEach((row, i) => {
+        if (row.logs)
+            rows.push({ kind: 'logs', name: row.task, line: panelAt + 1 + i });
     });
-    line += 1 + shown.length + (events.length > shown.length ? 1 : 0) + 1;
+    line += 1 + shown.length + (feed.length > shown.length ? 1 : 0) + 1;
     const tasksAt = line;
     line += 2;
     status.tasks.forEach((task, i) => rows.push({ kind: 'task', name: task.name, line: line + i }));
@@ -297,7 +476,19 @@ function buildModel(state, ws, dctx, key) {
     line += 2;
     inputNames.forEach((name, i) => rows.push({ kind: 'input', name, line: line + i }));
     line += Math.max(1, inputs.length);
-    return { ...empty, counts, live, done, events, latest, taskPlan, tasks, inputPlan, inputs, inputNames, rows, total: line, panelAt, tasksAt, inputsAt };
+    // A workspace without records has no RECORDS section at all.
+    let recordsAt = -1;
+    if (records.length > 0) {
+        line += 1;
+        recordsAt = line;
+        line += 2;
+        recordNames.forEach((name, i) => rows.push({ kind: 'record', name, line: line + i }));
+        line += records.length;
+    }
+    return {
+        ...empty, counts, live, done, feed, latest, taskPlan, tasks, inputPlan, inputs, inputNames, recordPlan, records, recordNames,
+        rows, total: line, panelAt, tasksAt, inputsAt, recordsAt,
+    };
 }
 // ---------------------------------------------------------------------------
 // Rendering
@@ -324,7 +515,21 @@ function executionLines(model, sel, dctx) {
     else if (model.live) {
         title = 'EXECUTION';
         const head = execution.stopping ? b(`${g.square} STOPPING`, 'warn') : b(`${g.quarter} RUNNING`, 'info');
-        right = [head, d(` ${sep} started ${timeAgo(execution.state.startedAt, dctx.now)} ${sep} ${model.done} of ${tasksTotal} tasks ${sep} ${spin}`)];
+        // What the server's budget holds now, where it has one: `memory 9.4 of 14 GB`, the unit once when both share it.
+        const budget = execution.state.budget.type === 'some' ? execution.state.budget.value : null;
+        let room = '';
+        if (budget !== null) {
+            const memory = formatSize(Number(budget.memory));
+            const inUse = formatSize(Number(budget.memoryInUse));
+            const unit = memory.slice(memory.indexOf(' '));
+            room = ` ${sep} cores ${budget.coresInUse} of ${budget.cores} ${sep} memory ${inUse.endsWith(unit) ? inUse.slice(0, -unit.length) : inUse} of ${memory}`;
+        }
+        const age = ` ${sep} started ${timeAgo(execution.state.startedAt, dctx.now)}`;
+        const count = ` ${sep} ${model.done} of ${tasksTotal} tasks`;
+        const end = ` ${sep} ${spin}`;
+        // Short of room, the run's age gives way to the budget (each feed row carries its own age), then the budget to the age.
+        const detail = [age + count + room, count + room, age + count].find(text => lineWidth([t(` ${title} `), head, t(`${text}${end} `)]) <= width) ?? age + count;
+        right = [head, d(detail + end)];
     }
     else {
         const state = execution.state;
@@ -337,31 +542,31 @@ function executionLines(model, sel, dctx) {
         right = [b(`${cell.glyph} ${cell.word}`, cell.tone), d(detail)];
     }
     lines.push(lrLine([t(' '), b(title)], [...right, t(' ')], width));
-    const shown = model.events.slice(0, MAX_EVENT_ROWS);
-    for (const event of shown) {
-        const cell = eventCell(event, g);
-        const logs = opensLogs(event);
-        const selected = logs && sel?.kind === 'logs' && sel.name === cell.task;
+    const shown = model.feed.slice(0, MAX_EVENT_ROWS);
+    for (const row of shown) {
+        const selected = row.logs && sel?.kind === 'logs' && sel.name === row.task;
         const left = [
             t(' '),
             selected ? b(g.sel, 'brand') : t(' '),
-            t(padStart(ageBare(cell.timestamp, dctx.now), 4)),
+            t(padStart(ageBare(row.timestamp, dctx.now), 4)),
             t('  '),
-            b(cell.glyph, cell.tone),
-            t(padEnd(` ${cell.word}`, 13)),
-            selected ? b(cell.task) : t(cell.task),
+            b(row.cell.glyph, row.cell.tone),
+            t(padEnd(` ${row.cell.word}`, 13)),
+            selected ? b(row.task) : t(row.task),
         ];
+        if (row.place !== '')
+            left.push(d(` ${sep} ${row.place}`));
         const detail = [];
-        if (event.type === 'start')
-            detail.push(d(`${spin} ${ageBare(cell.timestamp, dctx.now)}`));
-        else if (cell.detail !== '')
-            detail.push(d(cell.detail));
-        if (logs)
+        if (row.running)
+            detail.push(d(`${spin} ${ageBare(row.timestamp, dctx.now)}`));
+        else if (row.cell.detail !== '')
+            detail.push(d(row.cell.detail));
+        if (row.logs)
             detail.push(t('     '), b(`${g.enter} logs`, 'brand'));
         lines.push(lrLine(left, [...detail, t(' ')], width));
     }
-    if (model.events.length > shown.length) {
-        lines.push([t('   '), d(`… ${model.events.length - shown.length} more failed ${sep} /logs <task>`)]);
+    if (model.feed.length > shown.length) {
+        lines.push([t('   '), d(`… ${model.feed.length - shown.length} more failed ${sep} /logs <task>`)]);
     }
     return lines;
 }
@@ -387,6 +592,12 @@ function lastRunText(task, event, size, dctx) {
         }
     }
 }
+/** The `LAST COMMIT` cell of a record row: `set_status · alice · 3m ago`. */
+function lastCommitText(head, dctx) {
+    if (head === null)
+        return '—';
+    return `${head.mutation} ${dctx.g.sep} ${head.actor} ${dctx.g.sep} ${timeAgo(head.at, dctx.now)}`;
+}
 /**
  * The column's lines in `[top, top + visible)` — the window the screen
  * shows, rendered from the model with the selected row restyled and the
@@ -410,8 +621,10 @@ export function dashboardLines(model, dctx, sel, top, visible) {
     const panel = executionLines(model, selected, dctx);
     const taskSel = selected?.kind === 'task' ? model.tasks.findIndex(row => row.task.name === selected.name) : -1;
     const inputSel = selected?.kind === 'input' ? model.inputNames.indexOf(selected.name) : -1;
+    const recordSel = selected?.kind === 'record' ? model.recordNames.indexOf(selected.name) : -1;
     const tasksFirst = model.tasksAt + 2;
     const inputsFirst = model.inputsAt + 2;
+    const recordsFirst = model.recordsAt + 2;
     const out = [];
     for (let i = first; i < end; i++) {
         if (i < model.counts.length)
@@ -439,13 +652,23 @@ export function dashboardLines(model, dctx, sel, top, visible) {
             out.push(sectionLine('INPUTS', '', width));
         else if (i === model.inputsAt + 1)
             out.push(tableLine(model.inputPlan, null, false, width, g));
-        else {
+        else if (model.recordsAt === -1 || i < model.recordsAt - 1) {
             const row = model.inputs[i - inputsFirst];
             if (row === undefined)
                 out.push([t('  '), d('no inputs')]);
             else
                 out.push(tableLine(model.inputPlan, row, i - inputsFirst === inputSel, width, g));
         }
+        else if (i < model.recordsAt)
+            out.push(blank(width));
+        else if (i === model.recordsAt)
+            out.push(sectionLine('RECORDS', '', width));
+        else if (i === model.recordsAt + 1)
+            out.push(tableLine(model.recordPlan, null, false, width, g));
+        else {
+            const row = model.records[i - recordsFirst];
+            out.push(tableLine(model.recordPlan, { cells: { ...row.cells, lastCommit: lastCommitText(row.head, dctx) } }, i - recordsFirst === recordSel, width, g));
+        }
     }
     return out;
 }
@@ -638,6 +861,8 @@ registerViewHooks('dashboard', {
             controller.openTask(ws, row.name, 'stdout');
         else if (row.kind === 'task')
             controller.openTask(ws, row.name);
+        else if (row.kind === 'record')
+            controller.openRecord(ws, row.name);
         else
             controller.openInput(ws, row.name);
     },