reslop 0.1.9 → 0.2.1

package/lib/render/chrome.js

@@ -9,7 +9,7 @@ const { itemPath, TODO_FILE, isTodosEntry, fileTotals } = files;
 const { ACTION_IDS, BRANCH_ACTIONS, COMMIT_ACTIONS, actionLetter } = keys;
 const { buttonWord } = keys;
 const { FILES_HIDDEN, FILES_GIT_DISABLED, BRANCHES_DISABLED } = keys;
-const { COMMITS_DISABLED, TODO_DISABLED, DIFF_DISABLED } = keys;
+const { COMMITS_DISABLED, TODO_DISABLED, DIFF_DISABLED, UNIT_DISABLED } = keys;
 const { diffGitDisabled, branchGitDisabled, commitGitDisabled } = keys;
 const { CONFIRM, confirmPrefix, promptFromChoices } = keys;
 const { THEME, paint, visibleWidth } = ansi;
@@ -39,6 +39,7 @@ const BUSY_PROGRESS = [
   'rebasing',
   'dropping',
   'committing',
+  'rewording',
   'force pushing',
 ];
 
@@ -62,11 +63,16 @@ const INFO_STATUS = [
   'unified',
   'mixed',
   'side-by-side',
+  'dark',
+  'light',
   'saved',
   'reloaded',
   'not a diff block',
+  'file scope',
+  'diff mode',
   'committed',
   'amended',
+  'reworded',
   'fixup',
   'updated',
   'updating reslop',
@@ -89,6 +95,7 @@ const INFO_STATUS = [
   'checked out',
   'created',
   'empty branch name',
+  'empty commit message',
 ];
 const INFO_PREFIX = ['checked out ', 'created ', 'rebased onto ', 'dropped '];
 
@@ -113,8 +120,6 @@ const originLabel = (origin, view) => {
   return origin ?? 'unknown';
 };
 
-const headerRoleFg = (role) => HEADER_ROLE_FG[role] ?? THEME.headerChromeFg;
-
 const pathSegments = (rel) => {
   const segs = [];
   if (!rel) return segs;
@@ -162,7 +167,22 @@ const headerTarget = (view) => {
     return { path: entry.name, origin, n, total };
   }
   if (pane === 'commits') {
+    const compose = view.compose;
     const commits = view.commits ?? [];
+    if (compose && compose.kind === 'commit') {
+      const path = `${compose.text || ''}`.replaceAll('\n', ' ');
+      if (compose.commitKind === 'amend' || compose.commitKind === 'reword') {
+        const cursor = view.commitCursor ?? 0;
+        const entry = commits[cursor];
+        const total = commits.length;
+        const n = total ? cursor + 1 : 0;
+        if (!entry) return { path, origin: 'commit', n, total };
+        const origin = entry.head ? 'HEAD' : 'commit';
+        return { path, origin, n, total };
+      }
+      const total = commits.length + 1;
+      return { path, origin: 'new', n: 1, total };
+    }
     const cursor = view.commitCursor ?? 0;
     const entry = commits[cursor];
     const total = commits.length;
@@ -171,6 +191,14 @@ const headerTarget = (view) => {
     const origin = entry.head ? 'HEAD' : 'commit';
     return { path: entry.subject ?? '', origin, n, total };
   }
+  if (pane === 'unit') {
+    const path = view.reviewPath ?? '';
+    const lines = view.unitLines ?? [];
+    const top = Math.max(0, (view.scroll ?? 0) - 1);
+    const n = lines.length ? Math.min(lines.length, top + 1) : 0;
+    const origin = view.item ? originLabel(view.item.origin, view) : 'unit';
+    return { path, origin, n, total: lines.length };
+  }
   if (!view.item) return { path: '', origin: '', n: 0, total: view.total ?? 0 };
   if (view.item.origin === 'todo') {
     return { path: TODO_FILE, origin: 'todo', n: 1, total: 1 };
@@ -183,10 +211,29 @@ const headerTarget = (view) => {
   };
 };
 
+const headerScreen = (view) => {
+  const pane = view.pane ?? 'diff';
+  if (pane === 'branches') return 'branches';
+  if (pane === 'commits') return 'commits';
+  if (pane === 'files') {
+    const files = view.files ?? [];
+    const entry = files[view.fileCursor ?? 0];
+    if (isTodosEntry(entry)) return TODO_FILE;
+    return '';
+  }
+  if (view.item && view.item.origin === 'todo') return TODO_FILE;
+  return '';
+};
+
+const headerLabel = (view, target) => headerScreen(view) || target.path;
+
+const headerSep = (view) => (headerScreen(view) ? ': ' : '/');
+
 const headerPrefix = (view) => {
   const repo = view.repoName || '';
-  const { path } = headerTarget(view);
-  if (repo && path) return ` ${LOGO}  reslop: ${repo}/`;
+  const target = headerTarget(view);
+  const label = headerLabel(view, target);
+  if (repo && label) return ` ${LOGO}  reslop: ${repo}${headerSep(view)}`;
   if (repo) return ` ${LOGO}  reslop: ${repo} `;
   return ` ${LOGO}  reslop: `;
 };
@@ -197,13 +244,14 @@ const headerSuffix = ({ origin, n, total }) =>
 const headerText = (view) => {
   const prefix = headerPrefix(view);
   const target = headerTarget(view);
-  return `${prefix}${target.path}${headerSuffix(target)}`;
+  const label = headerLabel(view, target);
+  return `${prefix}${label}${headerSuffix(target)}`;
 };
 
 const headerPieces = (view, width) => {
   const repo = view.repoName || '';
   const target = headerTarget(view);
-  const path = target.path;
+  const path = headerLabel(view, target);
   const suffix = headerSuffix(target);
   const right = ' ';
   const chrome = ` ${LOGO}  reslop: `;
@@ -216,7 +264,9 @@ const headerPieces = (view, width) => {
   if (repo) {
     pieces.push({ text: repo, role: 'repo' });
     if (path) {
-      pieces.push({ text: '/', role: 'slash' });
+      const sep = headerSep(view);
+      const role = sep === '/' ? 'slash' : 'chrome';
+      pieces.push({ text: sep, role });
     } else {
       pieces.push({ text: ' ', role: 'chrome' });
     }
@@ -243,7 +293,8 @@ const paintHeader = (view, width, color) => {
     if (!piece.text) {
       continue;
     }
-    out += `${fg(headerRoleFg(piece.role))}${piece.text}`;
+    const roleFg = HEADER_ROLE_FG[piece.role] ?? THEME.headerChromeFg;
+    out += `${fg(roleFg)}${piece.text}`;
   }
   return `${out}${RESET}`;
 };
@@ -428,12 +479,14 @@ const statusLayout = (view, status, width) => {
 };
 
 const choiceHits = (choices, prefix, y) => {
-  const hits = [];
+  const { length } = choices;
+  const hits = new Array(length);
   let x = visibleWidth(prefix);
-  for (const choice of choices) {
+  for (let i = 0; i < length; i++) {
+    const choice = choices[i];
     const piece = `${choice.lead}${choice.label}`;
     const w = visibleWidth(piece);
-    hits.push({ id: choice.letter, y, x0: x, x1: x + w });
+    hits[i] = { id: choice.letter, y, x0: x, x1: x + w };
     x += w;
   }
   return hits;
@@ -543,6 +596,7 @@ const selectedCommit = (view) => (view.commits ?? [])[view.commitCursor ?? 0];
 const hiddenActions = (view) => {
   const pane = view.pane ?? 'diff';
   if (pane === 'files') return FILES_HIDDEN;
+  if (pane === 'unit') return UNIT_DISABLED;
   if (pane === 'branches') return BRANCHES_DISABLED;
   if (pane === 'commits') return COMMITS_DISABLED;
   if (view.item && view.item.origin === 'todo') return TODO_DISABLED;
@@ -557,7 +611,7 @@ const dimFooterActions = (view) => {
     if (!entry || entry.kind !== 'todos') return [];
     return FILES_GIT_DISABLED;
   }
-  if (pane === 'diff') return diffGitDisabled(view.item);
+  if (pane === 'diff' || pane === 'unit') return diffGitDisabled(view.item);
   if (pane === 'branches') return branchGitDisabled(selectedBranch(view));
   if (pane === 'commits') {
     const entry = selectedCommit(view);
@@ -570,7 +624,10 @@ const dimFooterActions = (view) => {
 
 const extraFooterActions = (view) => {
   const pane = view.pane ?? 'diff';
-  if (pane === 'files') return ['commit', 'pull', 'push'];
+  if (pane === 'files') {
+    const scope = view.fileScope === 'file' ? 'diff' : 'file';
+    return [scope, 'commit', 'pull', 'push'];
+  }
   if (pane === 'branches') return Object.keys(BRANCH_ACTIONS);
   if (pane === 'commits') return Object.keys(COMMIT_ACTIONS);
   return [];

package/lib/render/commits.js

@@ -2,11 +2,10 @@
 
 const ansi = require('../ansi.js');
 const primitives = require('./primitives.js');
+const { measureColumns, padColumns, joinColumns, paintColumns } = primitives;
 
 const { THEME, paint, visibleWidth, truncateVisible, seq, EL } = ansi;
-const { fill, padVisible, FILE_MARK, paneResult, paintCursorList } = primitives;
-
-const COMMIT_COL_KEYS = ['sha', 'author', 'date'];
+const { fill, FILE_MARK, paneResult, paintCursorList } = primitives;
 
 const COMMIT_COL_ALIGN = {
   sha: 'end',
@@ -22,71 +21,19 @@ const COMMIT_COL_FG = {
 
 const COMMIT_EDGE = 2;
 const COMMIT_TAIL = 1;
-const COMMIT_GAP = '  ';
-const COMMIT_DATE_GAP = '   ';
-
-const colGap = (key) => (key === 'date' ? COMMIT_DATE_GAP : COMMIT_GAP);
-
 const commitRowFields = (entry) => ({
   sha: entry.shortSha ?? '',
   author: entry.author ?? '',
   date: entry.date ?? '',
 });
 
-const commitColumns = (commits) => {
-  const widths = {};
-  for (const key of COMMIT_COL_KEYS) widths[key] = 0;
-  for (const entry of commits) {
-    const fields = commitRowFields(entry);
-    for (const key of COMMIT_COL_KEYS) {
-      const w = visibleWidth(fields[key]);
-      if (w > widths[key]) widths[key] = w;
-    }
-  }
-  return widths;
-};
-
-const commitRowParts = (entry, cols) => {
-  const fields = commitRowFields(entry);
-  const parts = {};
-  for (const key of COMMIT_COL_KEYS) {
-    const width = cols?.[key] ?? visibleWidth(fields[key]);
-    parts[key] = padVisible(fields[key], width, COMMIT_COL_ALIGN[key]);
-  }
-  return parts;
-};
-
-const joinCommitSuffix = (parts, cols) => {
-  const bits = [];
-  for (const key of COMMIT_COL_KEYS) {
-    if (!cols[key]) continue;
-    bits.push(colGap(key) + parts[key]);
-  }
-  if (!bits.length) return '';
-  return bits.join('');
-};
-
-const commitColFg = (key) => COMMIT_COL_FG[key];
-
-const paintCommitSuffix = (parts, cols, fgRgb, bgRgb, color) => {
-  const bits = [];
-  for (const key of COMMIT_COL_KEYS) {
-    if (!cols[key]) continue;
-    const tone = commitColFg(key) ?? fgRgb;
-    const gap = paint(colGap(key), fgRgb, bgRgb, color);
-    bits.push(gap + paint(parts[key], tone, bgRgb, color));
-  }
-  if (!bits.length) return '';
-  return bits.join('');
-};
-
 const paintCommitRow = (entry, width, color, selected, cols) => {
   const inner = Math.max(1, width - COMMIT_EDGE - COMMIT_TAIL);
   const mark = selected ? FILE_MARK : ' ';
   const prefix = ` ${mark} `;
   const lead = ' ';
-  const parts = commitRowParts(entry, cols);
-  const suffix = joinCommitSuffix(parts, cols);
+  const parts = padColumns(commitRowFields(entry), cols, COMMIT_COL_ALIGN);
+  const suffix = joinColumns(parts, cols);
   const rest = Math.max(1, inner - visibleWidth(prefix + lead + suffix));
   const subject = truncateVisible(entry.subject ?? '', rest);
   const pad = Math.max(0, rest - visibleWidth(subject));
@@ -103,15 +50,77 @@ const paintCommitRow = (entry, width, color, selected, cols) => {
   out += paint(lead, nameFg, bgRgb, color);
   out += paint(subject, nameFg, bgRgb, color);
   out += paint(after, fgRgb, bgRgb, color);
-  out += paintCommitSuffix(parts, cols, fgRgb, bgRgb, color);
+  out += paintColumns(parts, cols, fgRgb, bgRgb, color, COMMIT_COL_FG);
   out += paint(tail, fgRgb, bgRgb, color);
   return out + edge;
 };
 
+const paintCommitEdit = (compose, width, color, entry, cols) => {
+  const text = `${compose.text ?? ''}`.replaceAll('\n', ' ');
+  if (entry && cols) {
+    const row = paintCommitRow(
+      { ...entry, subject: text },
+      width,
+      color,
+      true,
+      cols,
+    );
+    const inner = Math.max(1, width - COMMIT_EDGE - COMMIT_TAIL);
+    const prefix = ` ${FILE_MARK} `;
+    const lead = ' ';
+    const parts = padColumns(commitRowFields(entry), cols, COMMIT_COL_ALIGN);
+    const suffix = joinColumns(parts, cols);
+    const rest = Math.max(1, inner - visibleWidth(prefix + lead + suffix));
+    const clipped = truncateVisible(text, rest);
+    const prefixW = visibleWidth(prefix + lead);
+    const col = Math.min(compose.cursor ?? 0, visibleWidth(clipped));
+    return {
+      row,
+      cursor: { x: prefixW + col + 1 },
+      at: 'replace',
+    };
+  }
+  const inner = Math.max(1, width - COMMIT_EDGE);
+  const prefix = ` ${FILE_MARK} `;
+  const lead = ' ';
+  const prefixW = visibleWidth(prefix + lead);
+  const rest = Math.max(1, inner - prefixW);
+  const clipped = truncateVisible(text, rest);
+  const pad = Math.max(0, rest - visibleWidth(clipped));
+  const gap = ' '.repeat(pad);
+  const fgRgb = THEME.chromeFg;
+  const bgRgb = THEME.buttonBg;
+  const nameFg = THEME.buttonHotFg;
+  const edge = fill(COMMIT_EDGE, fgRgb, THEME.ctxBg, color);
+  let row = `${prefix}${lead}${clipped}${gap}${edge}`;
+  if (color) {
+    row = `${seq(fgRgb, bgRgb)}${EL}`;
+    row += paint(prefix, fgRgb, bgRgb, color);
+    row += paint(lead, nameFg, bgRgb, color);
+    row += paint(clipped, nameFg, bgRgb, color);
+    row += paint(gap, fgRgb, bgRgb, color);
+    row += edge;
+  }
+  const col = Math.min(compose.cursor ?? 0, visibleWidth(clipped));
+  return { row, cursor: { x: prefixW + col + 1 }, at: 'start' };
+};
+
+const commitEditRow = (compose, commits, cursor, width, color, cols) => {
+  if (!compose || compose.kind !== 'commit') return null;
+  if (compose.commitKind === 'amend' || compose.commitKind === 'reword') {
+    const entry = commits[cursor];
+    if (!entry) return null;
+    return paintCommitEdit(compose, width, color, entry, cols);
+  }
+  return paintCommitEdit(compose, width, color);
+};
+
 const paintBodyCommits = (view, width, color, bodyH, headerLines) => {
   const commits = view.commits ?? [];
-  const cols = commitColumns(commits);
+  const cols = measureColumns(commits, commitRowFields, COMMIT_COL_ALIGN);
   const cursor = view.commitCursor ?? 0;
+  const compose = view.compose;
+  const extra = commitEditRow(compose, commits, cursor, width, color, cols);
   const paintRow = (entry, rowWidth, rowColor, selected) =>
     paintCommitRow(entry, rowWidth, rowColor, selected, cols);
   const painted = paintCursorList(
@@ -122,7 +131,7 @@ const paintBodyCommits = (view, width, color, bodyH, headerLines) => {
     bodyH,
     headerLines,
     paintRow,
-    null,
+    extra,
     view.listScroll,
   );
   return paneResult({

package/lib/render/diff.js

@@ -1,7 +1,7 @@
 'use strict';
 
 const ansi = require('../ansi.js');
-const { displayLines } = require('../diff.js');
+const { displayLines } = require('../diff/diff.js');
 const highlight = require('../highlight.js');
 const { detectLang } = require('../detect.js');
 const files = require('../files.js');
@@ -78,10 +78,8 @@ const STAGED_STYLES = {
 };
 
 const SOFT_WRAP = ['warn', 'note'];
-const DEL_CHAR_BG = ansi.bg(THEME.delCharBg);
-const ADD_CHAR_BG = ansi.bg(THEME.addCharBg);
-
-const lineStyles = (origin) => (origin === 'staged' ? STAGED_STYLES : STYLES);
+const delCharBg = () => ansi.bg(THEME.delCharBg);
+const addCharBg = () => ansi.bg(THEME.addCharBg);
 
 const paintSpans = (pieces, lineStyle, budget, color) => {
   let out = '';
@@ -129,13 +127,13 @@ const paintAuditRule = (width, color) => {
 const paintDiffLine = (line, width, color, origin, lang) => {
   if (line.type === 'noteSep') return paintAuditRule(width, color);
   if (line.type === 'note') return paintAuditNote(line, width, color);
-  const styles = lineStyles(origin);
+  const styles = origin === 'staged' ? STAGED_STYLES : STYLES;
   const style = styles[line.type] ?? styles.ctx;
   const diffSpans = line.spans ?? [{ text: line.text, changed: false }];
   const tokens = tokenize(lang, line.text ?? '');
   const pieces = overlayTokens(tokens, diffSpans);
   const gutterW = Math.min(GUTTER_W, Math.max(0, width));
-  const label = `${style.mark} `.slice(0, gutterW);
+  const label = `${line.mark ?? style.mark} `.slice(0, gutterW);
   const gutter = paint(label, CODE_FG.punct, style.baseBg, color);
   const budget = Math.max(0, width - gutterW);
   const rest = paintSpans(pieces, style, budget, color);
@@ -190,11 +188,12 @@ const wrapSoftLine = (line, width) => {
   const budget = Math.max(1, width - gutterW);
   const rows = wrapPlain(line.text ?? '', budget);
   const changed = line.wrap === true;
-  const pieces = [];
+  const { length } = rows;
+  const pieces = new Array(length);
   let used = 0;
-  for (let i = 0; i < rows.length; i++) {
+  for (let i = 0; i < length; i++) {
     const text = rows[i];
-    const last = i === rows.length - 1;
+    const last = i === length - 1;
     const spans = [{ text, changed }];
     const next = { ...line, text, spans, editLast: last };
     if (line.editStart !== undefined) {
@@ -203,7 +202,7 @@ const wrapSoftLine = (line, width) => {
       else next.editEnd = next.editStart + text.length;
     }
     used += text.length;
-    pieces.push(next);
+    pieces[i] = next;
   }
   return pieces;
 };
@@ -249,8 +248,7 @@ const expandSoftRows = (lines, width, split) => {
 const onCodePiece = (line, cursor) => {
   if (!line || line.editStart === undefined) return false;
   if (cursor < line.editStart) return false;
-  if (line.editLast) return cursor <= line.editEnd;
-  return cursor < line.editEnd;
+  return cursor <= line.editEnd;
 };
 
 const codeCursorInRows = (rows, split, width, cursor) => {
@@ -283,14 +281,15 @@ const paintBodyDiff = (view, width, color) => {
   const splitBody = layout === 'side' && !item.file.isBinary;
   const raw = dropLeadingEmpty(bodyLines(item, layout, overlay), splitBody);
   const lines = expandSoftRows(raw, width, splitBody);
-  const body = [];
+  const { length } = lines;
+  const body = new Array(length);
   if (splitBody) {
-    for (const row of lines) {
-      body.push(paintSplitRow(row, width, color, item.origin, lang));
+    for (let i = 0; i < length; i++) {
+      body[i] = paintSplitRow(lines[i], width, color, item.origin, lang);
     }
   } else {
-    for (const line of lines) {
-      body.push(paintDiffLine(line, width, color, item.origin, lang));
+    for (let i = 0; i < length; i++) {
+      body[i] = paintDiffLine(lines[i], width, color, item.origin, lang);
     }
   }
   const edit = overlay ? overlay.cursor : null;
@@ -299,9 +298,10 @@ const paintBodyDiff = (view, width, color) => {
 };
 
 module.exports = {
-  DEL_CHAR_BG,
-  ADD_CHAR_BG,
+  delCharBg,
+  addCharBg,
   paintDiffLine,
   codeInnerWidth,
   paintBodyDiff,
+  codeCursorInRows,
 };

package/lib/render/files.js

@@ -3,10 +3,11 @@
 const ansi = require('../ansi.js');
 const files = require('../files.js');
 const primitives = require('./primitives.js');
+const { measureColumns, padColumns } = primitives;
 
 const { isTodosEntry } = files;
 const { THEME, paint, visibleWidth, truncateVisible, seq, EL } = ansi;
-const { fill, padVisible, FILE_MARK, paneResult, paintCursorList } = primitives;
+const { fill, FILE_MARK, paneResult, paintCursorList } = primitives;
 
 const FILE_STATUS_FG = {
   unstaged: THEME.delLineFg,
@@ -15,8 +16,6 @@ const FILE_STATUS_FG = {
   partial: THEME.warnFg,
 };
 
-const FILE_COL_KEYS = ['add', 'del', 'status', 'n', 'm', 'date'];
-
 const FILE_COL_ALIGN = {
   add: 'start',
   del: 'start',
@@ -46,19 +45,6 @@ const fileRowFields = (entry) => {
   return { add, del, status, n, m, date };
 };
 
-const fileColumns = (files) => {
-  const widths = {};
-  for (const key of FILE_COL_KEYS) widths[key] = 0;
-  for (const entry of files) {
-    const fields = fileRowFields(entry);
-    for (const key of FILE_COL_KEYS) {
-      const w = visibleWidth(fields[key]);
-      if (w > widths[key]) widths[key] = w;
-    }
-  }
-  return widths;
-};
-
 const fileRowFg = (status, selected) => {
   const statusFg = FILE_STATUS_FG[status];
   if (statusFg) return statusFg;
@@ -66,17 +52,6 @@ const fileRowFg = (status, selected) => {
   return THEME.mutedFg;
 };
 
-const fileRowParts = (entry, cols) => {
-  const fields = fileRowFields(entry);
-  const parts = {};
-  for (const key of FILE_COL_KEYS) {
-    const width = cols?.[key] ?? visibleWidth(fields[key]);
-    const align = FILE_COL_ALIGN[key];
-    parts[key] = padVisible(fields[key], width, align);
-  }
-  return parts;
-};
-
 const joinFileDate = (parts, cols) => {
   if (!cols?.date) return '';
   return `${FILE_DATE_GAP}${parts.date}`;
@@ -87,9 +62,6 @@ const joinFileMeta = (parts) => {
   return `  ${add}  ${del}  ${status}  ${n}/${m}`;
 };
 
-const joinFileSuffix = (parts, cols) =>
-  `${joinFileMeta(parts)}${joinFileDate(parts, cols)}`;
-
 const paintFileSuffix = (parts, cols, fgRgb, bgRgb, color) => {
   const { add, del, status, n, m } = parts;
   const gap = paint('  ', fgRgb, bgRgb, color);
@@ -111,7 +83,7 @@ const paintTodosRow = (entry, width, color, selected, cols) => {
   const inner = Math.max(1, width - 1);
   const mark = selected ? FILE_MARK : ' ';
   const prefix = ` ${mark} `;
-  const parts = fileRowParts(entry, cols);
+  const parts = padColumns(fileRowFields(entry), cols, FILE_COL_ALIGN);
   const meta = joinFileMeta(parts);
   const dated = joinFileDate(parts, cols);
   const suffix = `${meta}${dated}`;
@@ -139,8 +111,8 @@ const paintFileRow = (entry, width, color, selected, cols) => {
   const inner = Math.max(1, width - 1);
   const mark = selected ? FILE_MARK : ' ';
   const prefix = ` ${mark} `;
-  const parts = fileRowParts(entry, cols);
-  const suffix = joinFileSuffix(parts, cols);
+  const parts = padColumns(fileRowFields(entry), cols, FILE_COL_ALIGN);
+  const suffix = `${joinFileMeta(parts)}${joinFileDate(parts, cols)}`;
   const pathW = Math.max(1, inner - visibleWidth(prefix + suffix));
   const { path, status } = entry;
   const clipped = truncateVisible(path, pathW);
@@ -158,7 +130,7 @@ const paintFileRow = (entry, width, color, selected, cols) => {
 
 const paintBodyFiles = (view, width, color, bodyH, headerLines) => {
   const files = view.files ?? [];
-  const cols = fileColumns(files);
+  const cols = measureColumns(files, fileRowFields, FILE_COL_ALIGN);
   const cursor = view.fileCursor ?? 0;
   const paintRow = (entry, rowWidth, rowColor, selected) =>
     paintFileRow(entry, rowWidth, rowColor, selected, cols);

package/lib/render/frame.js

@@ -9,6 +9,7 @@ const branches = require('./branches.js');
 const commits = require('./commits.js');
 const notes = require('./notes.js');
 const diff = require('./diff.js');
+const unit = require('./unit.js');
 
 const { RESET } = ansi;
 const { LIST_PANES, paintBodyFill, paneResult } = primitives;
@@ -20,12 +21,14 @@ const { paintBodyFiles } = files;
 const { paintBodyBranches } = branches;
 const { paintBodyCommits } = commits;
 const { paintBodyDiff } = diff;
+const { paintBodyUnit } = unit;
 
 const bodyKind = (view) => {
   const pane = view.pane ?? 'diff';
   if (pane === 'files' || pane === 'branches' || pane === 'commits') {
     return pane;
   }
+  if (pane === 'unit') return 'unit';
   if (!view.item) return 'empty';
   if (view.item.origin === 'todo') return 'todo';
   return 'diff';
@@ -47,6 +50,7 @@ const BODY_PAINT = {
   empty: paintBodyEmpty,
   todo: paintBodyTodo,
   diff: paintBodyDiff,
+  unit: paintBodyUnit,
 };
 
 const paintFrameBody = (view, width, color, bodyH, headerLines) => {
@@ -84,41 +88,60 @@ const mapBodyCursor = (cursor, shift, scroll, headerLines, shown) => {
 const windowBody = (view, width, color, bodyH, headerLines, paintedBody) => {
   const sourceBody = paintedBody.body;
   const sourceOwners = paintedBody.todoOwners;
+  const sourceChecks = paintedBody.todoChecks ?? [];
   const splitBody = paintedBody.splitBody === true;
   const pane = view.pane ?? 'diff';
   const listPane = LIST_PANES.includes(pane);
   const fillKind = bodyFillKind(listPane, splitBody);
   const filler = paintBodyFill(width, color, fillKind);
-  const body = [];
-  const todoOwners = [];
+  const lead = !listPane && sourceBody.length > 0;
+  const body = new Array(sourceBody.length + (lead ? 1 : 0));
+  let bodyAt = 0;
   let shift = 0;
-  if (!listPane && sourceBody.length > 0) {
-    body.push(filler);
-    if (sourceOwners.length) todoOwners.push(null);
+  if (lead) {
+    body[bodyAt++] = filler;
     shift = 1;
   }
-  for (const row of sourceBody) body.push(row);
-  for (const owner of sourceOwners) todoOwners.push(owner);
+  for (let i = 0; i < sourceBody.length; i++) body[bodyAt++] = sourceBody[i];
+  const ownerLead = lead && sourceOwners.length;
+  const todoOwners = new Array(sourceOwners.length + (ownerLead ? 1 : 0));
+  let ownerAt = 0;
+  if (ownerLead) todoOwners[ownerAt++] = null;
+  for (let i = 0; i < sourceOwners.length; i++) {
+    todoOwners[ownerAt++] = sourceOwners[i];
+  }
+  const checkLead = lead && sourceChecks.length;
+  const todoChecks = new Array(sourceChecks.length + (checkLead ? 1 : 0));
+  let checkAt = 0;
+  if (checkLead) todoChecks[checkAt++] = false;
+  for (let i = 0; i < sourceChecks.length; i++) {
+    todoChecks[checkAt++] = sourceChecks[i];
+  }
   const scrollRaw = view.scroll ?? 0;
   const scrollMax = Math.max(0, body.length - bodyH);
   const scroll = listPane ? 0 : Math.min(scrollRaw, scrollMax);
-  const slice = [];
   const end = Math.min(body.length, scroll + bodyH);
-  for (let i = scroll; i < end; i++) slice.push(body[i]);
+  const copied = Math.max(0, end - scroll);
+  const slice = new Array(bodyH);
+  for (let i = 0; i < copied; i++) slice[i] = body[scroll + i];
   const todoHits = [];
-  for (let i = 0; i < slice.length; i++) {
+  for (let i = 0; i < copied; i++) {
     const owner = todoOwners[scroll + i];
     if (owner === undefined || owner === null) continue;
-    todoHits.push({ y: headerLines + i + 1, cursor: owner });
+    const y = headerLines + i + 1;
+    if (todoChecks[scroll + i]) {
+      todoHits.push({ y, cursor: owner, x0: 1, x1: 4, check: true });
+    }
+    todoHits.push({ y, cursor: owner });
   }
   const cursor = mapBodyCursor(
     paintedBody.cursor,
     shift,
     scroll,
     headerLines,
-    slice.length,
+    copied,
   );
-  while (slice.length < bodyH) slice.push(filler);
+  for (let i = copied; i < bodyH; i++) slice[i] = filler;
   const listScroll = paintedBody.listScroll ?? 0;
   const fileHits = paintedBody.fileHits;
   return { slice, scroll, scrollMax, listScroll, todoHits, fileHits, cursor };