reslop 0.2.0 → 0.2.1

package/lib/render/chrome.js

@@ -39,6 +39,7 @@ const BUSY_PROGRESS = [
   'rebasing',
   'dropping',
   'committing',
+  'rewording',
   'force pushing',
 ];
 
@@ -62,6 +63,8 @@ const INFO_STATUS = [
   'unified',
   'mixed',
   'side-by-side',
+  'dark',
+  'light',
   'saved',
   'reloaded',
   'not a diff block',
@@ -69,6 +72,7 @@ const INFO_STATUS = [
   'diff mode',
   'committed',
   'amended',
+  'reworded',
   'fixup',
   'updated',
   'updating reslop',
@@ -91,6 +95,7 @@ const INFO_STATUS = [
   'checked out',
   'created',
   'empty branch name',
+  'empty commit message',
 ];
 const INFO_PREFIX = ['checked out ', 'created ', 'rebased onto ', 'dropped '];
 
@@ -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;
@@ -191,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: `;
 };
@@ -205,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: `;
@@ -224,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' });
     }

package/lib/render/commits.js

@@ -55,10 +55,72 @@ const paintCommitRow = (entry, width, color, selected, cols) => {
   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 = 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(
@@ -69,7 +131,7 @@ const paintBodyCommits = (view, width, color, bodyH, headerLines) => {
     bodyH,
     headerLines,
     paintRow,
-    null,
+    extra,
     view.listScroll,
   );
   return paneResult({

package/lib/render/diff.js

@@ -78,8 +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 delCharBg = () => ansi.bg(THEME.delCharBg);
+const addCharBg = () => ansi.bg(THEME.addCharBg);
 
 const paintSpans = (pieces, lineStyle, budget, color) => {
   let out = '';
@@ -298,8 +298,8 @@ const paintBodyDiff = (view, width, color) => {
 };
 
 module.exports = {
-  DEL_CHAR_BG,
-  ADD_CHAR_BG,
+  delCharBg,
+  addCharBg,
   paintDiffLine,
   codeInnerWidth,
   paintBodyDiff,

package/lib/render/frame.js

@@ -88,6 +88,7 @@ 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);
@@ -109,6 +110,13 @@ const windowBody = (view, width, color, bodyH, headerLines, paintedBody) => {
   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);
@@ -120,7 +128,11 @@ const windowBody = (view, width, color, bodyH, headerLines, paintedBody) => {
   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,

package/lib/render/notes.js

@@ -11,7 +11,7 @@ const { THEME, visibleWidth, truncateVisible, seq, EL, RESET, BOLD } = ansi;
 const { paintBar, paintCheckBar, windowRows } = primitives;
 const { LIST_PANES, CHECK_LEAD, paneResult } = primitives;
 
-const NOTE_COMPOSE = ['feedback', 'commit'];
+const NOTE_COMPOSE = ['feedback'];
 const INPUT_MAX = 4;
 const NOTE_MAX = 4;
 const NOTE_PAD = 1;
@@ -57,6 +57,7 @@ const paintTodoList = (texts, focus, width, color, edit) => {
   const inner = todoInnerWidth(width);
   const rows = [];
   const owners = [];
+  const checks = [];
   let cursor = null;
   for (let i = 0; i < texts.length; i++) {
     const selected = i === focus;
@@ -65,14 +66,22 @@ const paintTodoList = (texts, focus, width, color, edit) => {
     const text = texts[i];
     const wrapped = wrapTodoItem(text, inner);
     const rowStart = rows.length;
-    for (const line of wrapped) {
-      rows.push(paintCheckBar(` ${line}`, width, fgRgb, bgRgb, color));
+    for (let line = 0; line < wrapped.length; line++) {
+      const painted = paintCheckBar(
+        ` ${wrapped[line]}`,
+        width,
+        fgRgb,
+        bgRgb,
+        color,
+      );
+      rows.push(painted);
       owners.push(i);
+      checks.push(line === 0);
     }
     if (!edit || !selected) continue;
     cursor = todoCursor(text, edit, inner, rowStart);
   }
-  return { rows, owners, cursor };
+  return { rows, owners, checks, cursor };
 };
 
 const noteInnerWidth = (width) => Math.max(1, width - NOTE_PAD * 2);
@@ -184,13 +193,21 @@ const paintBodyTodo = (view, width, color) => {
   const caption = paintTodoCaption(width, color);
   const body = [caption, ...painted.rows];
   const todoOwners = [null, ...painted.owners];
+  const todoChecks = [false, ...painted.checks];
   let cursor = null;
   if (painted.cursor) {
     cursor = { x: painted.cursor.x, row: painted.cursor.row + 1 };
   }
   const fileHits = [];
   const splitBody = false;
-  return paneResult({ body, fileHits, todoOwners, cursor, splitBody });
+  return paneResult({
+    body,
+    fileHits,
+    todoOwners,
+    todoChecks,
+    cursor,
+    splitBody,
+  });
 };
 
 module.exports = {

package/lib/render/primitives.js

@@ -104,6 +104,13 @@ const listWindowStart = (focus, offset, listH, count) => {
   return start;
 };
 
+const extraIdx = (extraRow, cursor, count) => {
+  if (!extraRow) return -1;
+  if (extraRow.at === 'start') return 0;
+  if (extraRow.at === 'replace') return extraRow.index ?? cursor;
+  return count;
+};
+
 const paintCursorList = (
   items,
   cursor,
@@ -112,15 +119,16 @@ const paintCursorList = (
   bodyH,
   headerLines,
   paintRow,
-  tail,
+  extraRow,
   offset = 0,
 ) => {
   const pad = bodyH >= FILE_LIST_PAD * 2 + 1 ? FILE_LIST_PAD : 0;
   const listH = bodyH - pad * 2;
-  const extra = tail ? 1 : 0;
+  const inserting = extraRow && extraRow.at === 'start';
+  const extra = extraRow && extraRow.at !== 'replace' ? 1 : 0;
   const count = items.length + extra;
-  const last = count - 1;
-  const focus = extra ? last : cursor;
+  const extraAt = extraIdx(extraRow, cursor, items.length);
+  const focus = extraRow ? extraAt : cursor;
   const start = listWindowStart(focus, offset, listH, count);
   const blank = paintBodyFill(width, color, 'files');
   const body = [];
@@ -129,19 +137,20 @@ const paintCursorList = (
   if (pad) body.push(blank);
   for (let i = 0; i < listH; i++) {
     const idx = start + i;
-    if (tail && idx === items.length) {
-      body.push(tail.row);
-      if (tail.cursor) {
-        textCursor = { x: tail.cursor.x, row: body.length - 1 };
+    if (extraRow && idx === extraAt) {
+      body.push(extraRow.row);
+      if (extraRow.cursor) {
+        textCursor = { x: extraRow.cursor.x, row: body.length - 1 };
       }
       continue;
     }
-    const entry = items[idx];
+    const itemIdx = inserting ? idx - 1 : idx;
+    const entry = items[itemIdx];
     if (!entry) break;
-    const selected = extra ? false : idx === cursor;
+    const selected = extraRow ? false : itemIdx === cursor;
     body.push(paintRow(entry, width, color, selected));
     const y = headerLines + pad + i + 1;
-    fileHits.push({ y, cursor: idx });
+    fileHits.push({ y, cursor: itemIdx });
   }
   if (pad) body.push(blank);
   return { body, fileHits, cursor: textCursor, offset: start };
@@ -171,10 +180,43 @@ const paintBracketName = (label, nameFg, wrapFg, bgRgb, color, nameBold) => {
   );
 };
 
+const paintListEdit = (compose, width, color, edgeW) => {
+  const inner = Math.max(1, width - edgeW);
+  const prefix = ` ${FILE_MARK} `;
+  const prefixW = visibleWidth(prefix);
+  const rest = Math.max(1, inner - prefixW);
+  const text = `${compose.text ?? ''}`.replaceAll('\n', ' ');
+  const label = `[${text}]`;
+  const clipped = truncateVisible(label, rest);
+  const pad = Math.max(0, rest - visibleWidth(clipped));
+  const left = `${prefix}${clipped}${' '.repeat(pad)}`;
+  const fgRgb = THEME.chromeFg;
+  const bgRgb = THEME.buttonBg;
+  const edge = fill(edgeW, fgRgb, THEME.ctxBg, color);
+  let row = `${left}${edge}`;
+  if (color) {
+    const gap = ' '.repeat(pad);
+    row = `${seq(fgRgb, bgRgb)}${EL}`;
+    row += paint(prefix, fgRgb, bgRgb, color);
+    row += paintBracketName(
+      clipped,
+      THEME.buttonHotFg,
+      THEME.mutedFg,
+      bgRgb,
+      color,
+    );
+    row += paint(gap, fgRgb, bgRgb, color);
+    row += edge;
+  }
+  const col = Math.min((compose.cursor ?? 0) + 1, visibleWidth(clipped));
+  return { row, cursor: { x: prefixW + col + 1 } };
+};
+
 const paneResult = (fields) => ({
   body: fields.body,
   fileHits: fields.fileHits,
   todoOwners: fields.todoOwners,
+  todoChecks: fields.todoChecks ?? [],
   cursor: fields.cursor ?? null,
   splitBody: fields.splitBody === true,
   listScroll: fields.listScroll ?? 0,
@@ -239,6 +281,7 @@ module.exports = {
   paintBodyFill,
   windowRows,
   paintCursorList,
+  paintListEdit,
   branchLabel,
   paintBracketName,
   paneResult,

package/lib/render/render.js

@@ -9,7 +9,7 @@ const { renderFrame } = require('./frame.js');
 const { QUIT_PROMPT, PUSH_PROMPT } = chrome;
 const { updatePrompt, dropPrompt } = chrome;
 const { formatBusyStatus, headerText, layoutButtons } = chrome;
-const { DEL_CHAR_BG, ADD_CHAR_BG, paintDiffLine, codeInnerWidth } = diff;
+const { delCharBg, addCharBg, paintDiffLine, codeInnerWidth } = diff;
 const { todoInnerWidth, todoBodyWidth, noteInnerWidth } = notes;
 const { presentCursor, presentRows } = present;
 
@@ -18,8 +18,8 @@ module.exports = {
   PUSH_PROMPT,
   updatePrompt,
   dropPrompt,
-  DEL_CHAR_BG,
-  ADD_CHAR_BG,
+  delCharBg,
+  addCharBg,
   paintDiffLine,
   headerText,
   layoutButtons,