@heyhuynhgiabuu/pi-diff 0.5.0 → 0.5.2

package/dist/index.js

@@ -24,7 +24,7 @@ import { existsSync, readFileSync } from "node:fs";
 import { extname, relative } from "node:path";
 import { codeToANSI } from "@shikijs/cli";
 import * as Diff from "diff";
-import { parseDiff } from "./core/diff.js";
+import { computeHunkBlocks, getSepStyle, parseDiff, parsePatchFiles, resolveSepStyle, sepLabelSplit, sepLabelUnified } from "./core/diff.js";
 import { registerReviewDiffCommand } from "./review/command.js";
 import { formatReviewMarkdown } from "./review/export.js";
 import { countReviewDiffLines, readGitDiff } from "./review/git.js";
@@ -926,10 +926,9 @@ async function renderUnified(diff, language, max = MAX_RENDER_LINES, dc = DEFAUL
     }
     while (idx < vis.length) {
         const l = vis[idx];
-        // Hunk separator — collapsed context
+        // Hunk separator — collapsed context with optional function context
         if (l.type === "sep") {
-            const gap = l.newNum;
-            const label = gap && gap > 0 ? ` ${gap} unmodified lines ` : "···";
+            const label = sepLabelUnified(getSepStyle(), l.hunkMeta, l.newNum, l.content);
             const totalW = Math.min(tw, 72);
             const pad = Math.max(0, totalW - label.length - 2);
             const half1 = Math.floor(pad / 2), half2 = pad - half1;
@@ -1009,16 +1008,23 @@ async function renderSplit(diff, language, max = MAX_PREVIEW_LINES, dc = DEFAULT
     let i = 0;
     while (i < diff.lines.length) {
         const l = diff.lines[i];
-        if (l.type === "sep" || l.type === "ctx") {
+        if (l.type === "ctx") {
             rows.push({ left: l, right: l });
             i++;
             continue;
         }
-        const dels = [], adds = [];
+        if (l.type === "sep") {
+            rows.push({ left: l, right: l });
+            i++;
+            continue;
+        }
+        // Collect del/add block
+        const dels = [];
         while (i < diff.lines.length && diff.lines[i].type === "del") {
             dels.push(diff.lines[i]);
             i++;
         }
+        const adds = [];
         while (i < diff.lines.length && diff.lines[i].type === "add") {
             adds.push(diff.lines[i]);
             i++;
@@ -1054,10 +1060,9 @@ async function renderSplit(diff, language, max = MAX_PREVIEW_LINES, dc = DEFAULT
             const g = ` ${gPat}${FG_RULE}│${RST} `;
             return { gutter: g, contGutter: g, bodyRows: [stripes(cw, stripeRow)] };
         }
-        // Hunk separator
+        // Hunk separator with optional function context
         if (line.type === "sep") {
-            const gap = line.newNum;
-            const label = gap && gap > 0 ? `··· ${gap} lines ···` : "···";
+            const label = sepLabelSplit(getSepStyle(), line.hunkMeta, line.newNum, line.content);
             const g = `${BG_BASE} ${FG_DIM}${fit("", nw + 2)}${RST}${FG_RULE}│${RST} `;
             return { gutter: g, contGutter: g, bodyRows: [`${BG_BASE}${FG_DIM}${fit(label, cw)}${RST}`] };
         }
@@ -1139,8 +1144,12 @@ async function renderSplit(diff, language, max = MAX_PREVIEW_LINES, dc = DEFAULT
 // Extension
 // ---------------------------------------------------------------------------
 export const __testing = {
+    computeHunkBlocks,
     normalizeShikiContrast,
+    getSepStyle,
     parseDiff,
+    parsePatchFiles,
+    resolveSepStyle,
     renderSplit,
     renderUnified,
 };
@@ -1168,6 +1177,8 @@ function normalizeOptionalPositiveInteger(value, name) {
 export default async function diffRendererExtension(pi) {
     // Apply diff theme palette from settings/presets before rendering
     applySharedDiffPalette();
+    // Resolve hunk separator style from env var
+    resolveSepStyle();
     let createWriteTool, createEditTool, getMarkdownTheme, TextComponent, MarkdownComponent;
     try {
         const sdk = await import("@earendil-works/pi-coding-agent");
@@ -1187,6 +1198,44 @@ export default async function diffRendererExtension(pi) {
     const cwd = process.cwd();
     const home = process.env.HOME ?? "";
     const sp = (p) => shortPath(cwd, home, p);
+    /** Wrap a Text component so its render(width) kicks off async diff rendering
+     *  using the real TUI width (which accounts for the sidebar). */
+    function getWidthAwareText(lastComponent) {
+        const text = (lastComponent ?? new TextComponent("", 0, 0));
+        if (text.__piDiffWidthAware)
+            return text;
+        const baseRender = typeof text.render === "function" ? text.render.bind(text) : null;
+        if (!baseRender)
+            return text;
+        text.__piDiffWidthAware = true;
+        text.__piDiffRender = baseRender;
+        text.render = (width) => {
+            const task = text.__piDiffTask;
+            if (task) {
+                const renderWidth = Math.max(1, Math.floor(width || termW()));
+                const key = task.key(renderWidth);
+                if (text.__piDiffRenderedKey !== key) {
+                    text.__piDiffRenderedKey = key;
+                    text.setText(task.placeholder);
+                    Promise.resolve(task.render(renderWidth))
+                        .then((rendered) => {
+                        if (text.__piDiffRenderedKey !== key)
+                            return;
+                        text.setText(rendered);
+                        task.invalidate?.();
+                    })
+                        .catch(() => {
+                        if (text.__piDiffRenderedKey !== key)
+                            return;
+                        text.setText(task.fallback);
+                        task.invalidate?.();
+                    });
+                }
+            }
+            return text.__piDiffRender(width);
+        };
+        return text;
+    }
     registerReviewDiffCommand(pi, cwd);
     pi.registerTool({
         name: "review_git_diff",
@@ -1241,7 +1290,7 @@ Examples:
         },
         async execute(_tid, params = {}) {
             try {
-                const safeParams = params ?? {};
+                const safeParams = (params ?? {});
                 const diff = await readGitDiff(cwd, reviewGitDiffMode(safeParams));
                 const maxLinesPerHunk = reviewGitDiffMaxLines(safeParams);
                 const markdown = safeParams.includeRawDiff || safeParams.raw
@@ -1259,13 +1308,14 @@ Examples:
                     details: {
                         _type: "reviewGitDiff",
                         markdown,
-                        mode: diff.mode,
+                        mode: String(diff.mode),
                         fileCount: diff.files.length,
                         insertions: counts.insertions,
                         deletions: counts.deletions,
                         commentCount: 0,
                         focusedFile: safeParams.file,
                         focusedHunk: safeParams.hunkId,
+                        error: undefined,
                     },
                 };
             }
@@ -1273,14 +1323,15 @@ Examples:
                 const message = error instanceof Error ? error.message : String(error);
                 return {
                     content: [{ type: "text", text: `Error: ${message}` }],
-                    details: { _type: "reviewGitDiff", error: message },
+                    details: { _type: "reviewGitDiff", markdown: "", mode: "error", fileCount: 0, insertions: 0, deletions: 0, commentCount: 0, focusedFile: undefined, focusedHunk: undefined, error: message },
                 };
             }
         },
         renderCall(args, theme, ctx) {
             const text = ctx.lastComponent ?? new TextComponent("", 0, 0);
-            const base = typeof args?.base === "string" && args.base.trim() ? ` vs ${args.base.trim()}` : " working tree";
-            const focus = typeof args?.file === "string" && args.file.trim() ? ` • ${args.file.trim()}` : "";
+            const safeArgs = args;
+            const base = typeof safeArgs?.base === "string" && safeArgs.base.trim() ? ` vs ${safeArgs.base.trim()}` : " working tree";
+            const focus = typeof safeArgs?.file === "string" && safeArgs.file.trim() ? ` • ${safeArgs.file.trim()}` : "";
             text.setText(`${theme.fg("toolTitle", theme.bold("review_git_diff"))}${theme.fg("muted", `${base}${focus}`)}`);
             return text;
         },
@@ -1325,9 +1376,10 @@ Examples:
             const content = params.content ?? "";
             // Store in details — the only custom field TUI preserves in renderResult
             if (old !== null && old !== content) {
-                const diff = parseDiff(old, content);
+                const useFull = !!params._expandGaps;
+                const diff = parseDiff(old, content, useFull ? undefined : 3);
                 const lg = detectDiffLanguage(fp);
-                result.details = { _type: "diff", summary: summarize(diff.added, diff.removed), diff, language: lg };
+                result.details = { _type: "diff", summary: summarize(diff.added, diff.removed), diff, language: lg, oldContent: old, newContent: content };
             }
             else if (old === null) {
                 const lineCount = content ? content.split("\n").length : 0;
@@ -1379,41 +1431,31 @@ Examples:
             return text;
         },
         renderResult(result, _opt, theme, ctx) {
-            const text = ctx.lastComponent ?? new TextComponent("", 0, 0);
+            const text = getWidthAwareText(ctx.lastComponent);
             if (ctx.isError) {
                 const e = result.content
                     ?.filter((c) => c.type === "text")
                     .map((c) => c.text || "")
                     .join("\n") ?? "Error";
+                text.__piDiffTask = undefined;
                 text.setText(`\n${theme.fg("error", e)}`);
                 return text;
             }
             const d = result.details;
             if (d?._type === "diff") {
-                const w = termW();
-                const key = `wd:${sharedThemeCacheKey(theme)}:${w}:${d.summary}:${d.diff?.lines?.length ?? 0}:${d.language ?? ""}`;
-                if (ctx.state._wdk !== key) {
-                    ctx.state._wdk = key;
-                    ctx.state._wdt = `  ${d.summary}\n${theme.fg("muted", "  rendering diff…")}`;
-                    const dc = resolveSharedDiffColors(theme);
-                    renderSharedSplit(d.diff, d.language, MAX_RENDER_LINES, dc, w)
-                        .then((rendered) => {
-                        if (ctx.state._wdk !== key)
-                            return;
-                        ctx.state._wdt = `  ${d.summary}\n${rendered}`;
-                        ctx.invalidate();
-                    })
-                        .catch(() => {
-                        if (ctx.state._wdk !== key)
-                            return;
-                        ctx.state._wdt = `  ${d.summary}`;
-                        ctx.invalidate();
-                    });
-                }
-                text.setText(ctx.state._wdt ?? `  ${d.summary}`);
+                const themeKey = sharedThemeCacheKey(theme);
+                const dc = resolveSharedDiffColors(theme);
+                text.__piDiffTask = {
+                    placeholder: `  ${d.summary}\n${theme.fg("muted", "  rendering diff…")}`,
+                    fallback: `  ${d.summary}`,
+                    invalidate: ctx.invalidate,
+                    key: (width) => `wd:${themeKey}:${width}:${d.summary}:${d.diff?.lines?.length ?? 0}:${d.language ?? ""}`,
+                    render: async (width) => `  ${d.summary}\n${await renderSharedSplit(d.diff, d.language, MAX_RENDER_LINES, dc, width)}`,
+                };
                 return text;
             }
             if (d?._type === "noChange") {
+                text.__piDiffTask = undefined;
                 text.setText(`  ${theme.fg("muted", "✓ no changes")}`);
                 return text;
             }
@@ -1486,6 +1528,7 @@ Examples:
             if (operations.length === 0)
                 return result;
             const { diffs, summary } = summarizeEditOperations(operations);
+            const lg = detectDiffLanguage(fp);
             if (operations.length === 1) {
                 let editLine = 0;
                 try {
@@ -1499,14 +1542,39 @@ Examples:
                 catch {
                     editLine = 0;
                 }
-                result.details = { _type: "editInfo", summary, editLine };
+                const useFull = !!params._expandGaps;
+                const diffData = useFull
+                    ? parseDiff(operations[0].oldText, operations[0].newText, undefined)
+                    : diffs[0];
+                result.details = {
+                    _type: "editInfo",
+                    summary,
+                    editLine,
+                    diff: diffData,
+                    language: lg,
+                    oldContent: operations[0].oldText,
+                    newContent: operations[0].newText,
+                };
                 return result;
             }
+            // Merge all diffs into one combined view for rendering
+            const merged = {
+                lines: diffs.flatMap((diff, i) => [
+                    // Add separator between multiple edits
+                    ...(i > 0 ? [{ type: "sep", oldNum: null, newNum: null, content: `───── Edit ${i + 1} ─────` }] : []),
+                    ...diff.lines,
+                ]),
+                added: diffs.reduce((sum, diff) => sum + diff.added, 0),
+                removed: diffs.reduce((sum, diff) => sum + diff.removed, 0),
+                chars: diffs.reduce((sum, diff) => sum + diff.chars, 0),
+            };
             result.details = {
                 _type: "multiEditInfo",
                 summary,
                 editCount: operations.length,
-                diffLineCount: diffs.reduce((sum, diff) => sum + diff.lines.length, 0),
+                diffLineCount: merged.lines.length,
+                diff: merged,
+                language: lg,
             };
             return result;
         },
@@ -1515,85 +1583,67 @@ Examples:
             const operations = getEditOperations(args);
             const text = ctx.lastComponent ?? new TextComponent("", 0, 0);
             const hdr = `${theme.fg("toolTitle", theme.bold("edit"))} ${theme.fg("accent", sp(fp))}`;
-            if (!(ctx.argsComplete && operations.length > 0)) {
-                text.setText(hdr);
-                return text;
+            if (ctx.argsComplete && operations.length > 0) {
+                const { totalAdded, totalRemoved } = summarizeEditOperations(operations);
+                text.setText(`${hdr}  ${theme.fg("muted", summarize(totalAdded, totalRemoved))}`);
             }
-            const pk = JSON.stringify({ fp, operations, theme: sharedThemeCacheKey(theme), w: termW() });
-            if (ctx.state._pk !== pk) {
-                ctx.state._pk = pk;
-                ctx.state._pt = `${hdr}  ${theme.fg("muted", "(rendering…)")}`;
-                const lg = detectDiffLanguage(fp);
-                const dc = resolveSharedDiffColors(theme);
-                if (operations.length === 1) {
-                    const diff = parseDiff(operations[0].oldText, operations[0].newText);
-                    renderSharedSplit(diff, lg, MAX_PREVIEW_LINES, dc, termW())
-                        .then((rendered) => {
-                        if (ctx.state._pk !== pk)
-                            return;
-                        ctx.state._pt = `${hdr}\n${summarize(diff.added, diff.removed)}\n${rendered}`;
-                        ctx.invalidate();
-                    })
-                        .catch(() => {
-                        if (ctx.state._pk !== pk)
-                            return;
-                        ctx.state._pt = `${hdr}  ${summarize(diff.added, diff.removed)}`;
-                        ctx.invalidate();
-                    });
-                }
-                else {
-                    const { diffs, summary } = summarizeEditOperations(operations);
-                    const maxShown = Math.min(operations.length, 3);
-                    const previewLines = Math.max(8, Math.floor(MAX_PREVIEW_LINES / maxShown));
-                    Promise.all(diffs.slice(0, maxShown).map((diff, index) => renderSharedSplit(diff, lg, previewLines, dc, termW())
-                        .then((rendered) => `Edit ${index + 1}/${operations.length}\n${rendered}`)
-                        .catch(() => `Edit ${index + 1}/${operations.length}  ${summarize(diff.added, diff.removed)}`)))
-                        .then((sections) => {
-                        if (ctx.state._pk !== pk)
-                            return;
-                        const remainder = operations.length - maxShown;
-                        const suffix = remainder > 0 ? `\n${theme.fg("muted", `… ${remainder} more edit blocks`)}` : "";
-                        ctx.state._pt = `${hdr}\n${operations.length} edits ${summary}\n\n${sections.join("\n\n")}${suffix}`;
-                        ctx.invalidate();
-                    })
-                        .catch(() => {
-                        if (ctx.state._pk !== pk)
-                            return;
-                        ctx.state._pt = `${hdr}  ${operations.length} edits ${summary}`;
-                        ctx.invalidate();
-                    });
-                }
+            else {
+                text.setText(hdr);
             }
-            text.setText(ctx.state._pt ?? hdr);
             return text;
         },
         renderResult(result, _opt, theme, ctx) {
-            const text = ctx.lastComponent ?? new TextComponent("", 0, 0);
+            const text = getWidthAwareText(ctx.lastComponent);
             if (ctx.isError) {
                 const e = result.content
                     ?.filter((c) => c.type === "text")
                     .map((c) => c.text || "")
                     .join("\n") ?? "Error";
+                text.__piDiffTask = undefined;
                 text.setText(`\n${theme.fg("error", e)}`);
                 return text;
             }
-            if (result.details?._type === "editInfo") {
-                const { summary: s, editLine } = result.details;
+            const d = result.details;
+            if (d?._type === "editInfo" && d.diff) {
+                const themeKey = sharedThemeCacheKey(theme);
+                const dc = resolveSharedDiffColors(theme);
+                const loc = d.editLine > 0 ? ` ${theme.fg("muted", `at line ${d.editLine}`)}` : "";
+                text.__piDiffTask = {
+                    placeholder: `  ${d.summary}${loc}\n${theme.fg("muted", "  rendering diff…")}`,
+                    fallback: `  ${d.summary}${loc}`,
+                    invalidate: ctx.invalidate,
+                    key: (width) => `ed:${themeKey}:${width}:${d.summary}:${d.diff?.lines?.length ?? 0}:${d.language ?? ""}`,
+                    render: async (width) => `  ${d.summary}${loc}\n${await renderSharedSplit(d.diff, d.language, MAX_PREVIEW_LINES, dc, width)}`,
+                };
+                return text;
+            }
+            if (d?._type === "editInfo") {
+                const { summary: s, editLine } = d;
                 const loc = editLine > 0 ? ` ${theme.fg("muted", `at line ${editLine}`)}` : "";
-                const content = `  ${s}${loc}`;
-                const vis = content.replace(ANSI_RE, "").length;
-                const pad = Math.max(0, termW() - vis);
-                text.setText(`${content}${" ".repeat(pad)}`);
+                text.__piDiffTask = undefined;
+                text.setText(`  ${s}${loc}`);
                 return text;
             }
-            if (result.details?._type === "multiEditInfo") {
-                const { summary: s, editCount, diffLineCount } = result.details;
-                const content = `  ${editCount} edits ${s}${typeof diffLineCount === "number" ? ` ${theme.fg("muted", `(${diffLineCount} diff lines)`)}` : ""}`;
-                const vis = content.replace(ANSI_RE, "").length;
-                const pad = Math.max(0, termW() - vis);
-                text.setText(`${content}${" ".repeat(pad)}`);
+            if (d?._type === "multiEditInfo") {
+                const { summary: s, editCount, diffLineCount, diff, language } = d;
+                if (diff) {
+                    const themeKey = sharedThemeCacheKey(theme);
+                    const dc = resolveSharedDiffColors(theme);
+                    text.__piDiffTask = {
+                        placeholder: `  ${editCount} edits ${s}
+${theme.fg("muted", "  rendering diff…")}`,
+                        fallback: `  ${editCount} edits ${s}${typeof diffLineCount === "number" ? ` ${theme.fg("muted", `(${diffLineCount} diff lines)`)}` : ""}`,
+                        invalidate: ctx.invalidate,
+                        key: (width) => `me:${themeKey}:${width}:${s}:${diff?.lines?.length ?? 0}:${language ?? ""}`,
+                        render: async (width) => `  ${editCount} edits ${s}${typeof diffLineCount === "number" ? ` ${theme.fg("muted", `(${diffLineCount} diff lines)`)}` : ""}\n${await renderSharedSplit(diff, language, MAX_PREVIEW_LINES, dc, width)}`,
+                    };
+                    return text;
+                }
+                text.__piDiffTask = undefined;
+                text.setText(`  ${editCount} edits ${s}${typeof diffLineCount === "number" ? ` ${theme.fg("muted", `(${diffLineCount} diff lines)`)}` : ""}`);
                 return text;
             }
+            text.__piDiffTask = undefined;
             text.setText(`  ${theme.fg("dim", String(result?.content?.[0]?.text ?? "edited").slice(0, 120))}`);
             return text;
         },