@heyhuynhgiabuu/pi-pretty 0.6.0 → 0.6.2

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@heyhuynhgiabuu/pi-pretty",
-	"version": "0.6.0",
+	"version": "0.6.2",
 	"description": "Pretty terminal output for pi — syntax-highlighted file reads, colored bash output, tree-view directory listings, and more.",
 	"author": "huynhgiabuu",
 	"license": "MIT",

package/src/autocomplete.ts

@@ -0,0 +1,96 @@
+/**
+ * pi-pretty: FFF-backed @-mention autocomplete provider.
+ *
+ * Wraps the built-in autocomplete provider and replaces the @-mention file
+ * suggestions with FFF frecency-ranked file search results.
+ */
+
+import type {
+	AutocompleteItem,
+	AutocompleteProvider,
+	AutocompleteSuggestions,
+} from "@earendil-works/pi-tui";
+import type { FileFinder } from "@ff-labs/fff-node";
+
+/** How many @-mention suggestions to show at most. */
+const MAX_SUGGESTIONS = 20;
+
+/**
+ * Extract the query after a `@` character before the cursor.
+ * Returns the query string (empty string if bare `@`), or undefined if no `@` trigger.
+ */
+function extractAtPrefix(textBeforeCursor: string): string | undefined {
+	const match = textBeforeCursor.match(/(?:^|[ \t])@([^\s@]*)$/);
+	return match?.[1];
+}
+
+export function createFffAutocompleteProvider(
+	current: AutocompleteProvider,
+	getFinder: () => FileFinder | null,
+): AutocompleteProvider {
+	return {
+		async getSuggestions(
+			lines: string[],
+			cursorLine: number,
+			cursorCol: number,
+			options: { signal: AbortSignal; force?: boolean },
+		): Promise<AutocompleteSuggestions | null> {
+			const currentLine = lines[cursorLine] ?? "";
+			const textBeforeCursor = currentLine.slice(0, cursorCol);
+			const query = extractAtPrefix(textBeforeCursor);
+
+			// Not an @-mention — delegate
+			if (query === undefined) {
+				return current.getSuggestions(lines, cursorLine, cursorCol, options);
+			}
+
+			const finder = getFinder();
+			if (!finder) {
+				// FFF not available — delegate to built-in
+				return current.getSuggestions(lines, cursorLine, cursorCol, options);
+			}
+
+			try {
+				const result = finder.fileSearch(query, {
+					pageSize: MAX_SUGGESTIONS,
+					
+				});
+
+				if (result.ok) {
+					const items: AutocompleteItem[] = result.value.items.map((item) => ({
+						value: item.relativePath,
+						label: item.fileName,
+						description: item.relativePath.slice(0, -(item.fileName.length + 1)),
+					}));
+
+					if (items.length > 0) {
+						return { items, prefix: `@${query}` };
+					}
+				}
+			} catch {
+				// FFF search failed — fall through to built-in
+			}
+
+			// FFF returned no results or failed — let built-in handle it
+			return current.getSuggestions(lines, cursorLine, cursorCol, options);
+		},
+
+		applyCompletion(
+			lines: string[],
+			cursorLine: number,
+			cursorCol: number,
+			item: AutocompleteItem,
+			prefix: string,
+		): { lines: string[]; cursorLine: number; cursorCol: number } {
+			return current.applyCompletion(lines, cursorLine, cursorCol, item, prefix);
+		},
+
+		shouldTriggerFileCompletion(
+			lines: string[],
+			cursorLine: number,
+			cursorCol: number,
+		): boolean {
+			return current.shouldTriggerFileCompletion?.(lines, cursorLine, cursorCol) ?? true;
+		},
+	};
+}

package/src/index.ts

@@ -27,6 +27,7 @@ import { registerGrepTool } from "./tools/grep.js";
 import { registerMultiGrepTool } from "./tools/multi-grep.js";
 import { runMultiGrepRipgrepFallback } from "./multi-grep-fallback.js";
 import { getDefaultAgentDir } from "./config.js";
+import { createFffAutocompleteProvider } from "./autocomplete.js";
 
 // ---------------------------------------------------------------------------
 // Config
@@ -235,6 +236,11 @@ export default function piPrettyExtension(pi: ExtensionAPI, deps?: PiPrettyDeps)
 		} catch (error: unknown) {
 			ctx.ui?.notify?.(`FFF init failed: ${error instanceof Error ? error.message : String(error)}`, "error");
 		}
+
+		// Register FFF-backed @-mention autocomplete
+		ctx.ui?.addAutocompleteProvider?.((current) =>
+			createFffAutocompleteProvider(current, () => fffService?.getFinder() ?? null),
+		);
 	});
 
 	pi.on("session_shutdown", async () => {

package/src/render.ts

@@ -212,7 +212,6 @@ export async function renderFileContent(
 		out.push(`${lnum(ln, nw)} ${FG_RULE}│${RST} ${display}${RST}`);
 	}
 
-	out.push(rule(tw));
 	if (total > maxLines) {
 		out.push(`${FG_DIM}  … ${total - maxLines} more lines (${total} total)${RST}`);
 	}

package/src/tools/bash.ts

@@ -80,7 +80,7 @@ export function registerBashTool(
 					if (!output.trim()) return fillToolBackground(header, bg, w);
 					const max = ctx.expanded ? lineCount : MAX_PREVIEW_LINES;
 					const show = output.split("\n").slice(0, max);
-					const out = [header, rule(w), ...show.map((l: string) => `  ${l}`), rule(w)];
+					const out = [header, rule(w), ...show.map((l: string) => `  ${l}`)];
 					if (lineCount > max) out.push(`${FG_DIM}  \u2026 ${lineCount - max} more lines${RST}`);
 					return fillToolBackground(out.join("\n"), bg, w);
 				};

package/src/tools/grep.ts

@@ -2,7 +2,7 @@
 
 import { type ToolDefinition, type ExtensionAPI, type ExtensionContext, type AgentToolResult } from "@earendil-works/pi-coding-agent";
 import type { SdkToolDef, GrepDetails, FffServiceWithCursor, TextContent, ThemeLike, RenderCtxLike } from "../types.js";
-import { resolveBaseBackground, MAX_PREVIEW_LINES, BG_BASE, BG_ERROR, FG_DIM, RST } from "../config.js";
+import { resolveBaseBackground, MAX_PREVIEW_LINES, BG_ERROR, FG_DIM, FG_LNUM, FG_RULE, RST } from "../config.js";
 import { shortPath, normalizeLineEndings } from "../helpers.js";
 import { wrapExecuteWithMetrics } from "./metrics.js";
 import { renderToolError, renderToolMetrics, fillToolBackground } from "../render.js";
@@ -84,7 +84,33 @@ export function registerGrepTool(
 			if (d?._type === "grepResult" && d.text) {
 				const lines = d.text.split("\n");
 				const maxShow = ctx.expanded ? lines.length : Math.min(lines.length, MAX_PREVIEW_LINES);
-				const preview = lines.slice(0, maxShow).map(l => `  ${l}`).join("\n");
+				const show = lines.slice(0, maxShow);
+				const nw = Math.max(3, 5);
+
+				// Build highlight regex from pattern
+				let hlRe: RegExp | null = null;
+				try { hlRe = new RegExp(`(${d.pattern})`, "gi"); } catch {}
+
+				const out: string[] = [];
+				let currentFile = "";
+				for (const line of show) {
+					const fileMatch = line.match(/^(.+?)[:-](\d+)[:-](.*)$/);
+					if (fileMatch) {
+						const [, file, lineNo, content] = fileMatch;
+						if (file !== currentFile) {
+							if (currentFile) out.push("");
+							out.push(`  ${theme.fg("accent", theme.bold(file))}`);
+							currentFile = file;
+						}
+						let display = content;
+						if (hlRe) display = content.replace(hlRe, (m) => `${RST}${theme.fg("warning", theme.bold(m))}${RST}`);
+						const padded = `${FG_LNUM}${String(lineNo).padStart(nw)}${RST} ${FG_RULE}│${RST} ${display}${RST}`;
+						out.push(`  ${padded}`);
+					} else if (line.trim()) {
+						out.push(`  ${FG_DIM}  ${line.trim()}${RST}`);
+					}
+				}
+				const preview = out.join("\n");
 				const more = lines.length > maxShow ? `\n${FG_DIM}  ... ${lines.length - maxShow} more lines${RST}` : "";
 				text.setText(fillToolBackground(`  ${FG_DIM}${d.matchCount} matches${RST}${renderToolMetrics(result)}\n${preview}${more}`));
 				return text;

package/src/tools/multi-grep.ts

@@ -3,7 +3,7 @@
 import { type ToolDefinition, type ExtensionAPI, type ExtensionContext, type AgentToolResult } from "@earendil-works/pi-coding-agent";
 import { Type } from "typebox";
 import type { SdkToolDef, GrepDetails, FffServiceWithCursor, TextContent, ComponentLike, ThemeLike, RenderCtxLike } from "../types.js";
-import { resolveBaseBackground, MAX_PREVIEW_LINES, BG_BASE, BG_ERROR, FG_DIM, RST } from "../config.js";
+import { resolveBaseBackground, MAX_PREVIEW_LINES, BG_ERROR, FG_DIM, FG_LNUM, FG_RULE, RST } from "../config.js";
 import { shortPath, normalizeLineEndings } from "../helpers.js";
 import { wrapExecuteWithMetrics } from "./metrics.js";
 import { renderToolError, renderToolMetrics, fillToolBackground } from "../render.js";
@@ -154,7 +154,32 @@ export function registerMultiGrepTool(
 			if (d?._type === "grepResult" && d.text) {
 				const lines = d.text.split("\n");
 				const maxShow = ctx.expanded ? lines.length : Math.min(lines.length, MAX_PREVIEW_LINES);
-				const preview = lines.slice(0, maxShow).map(l => `  ${l}`).join("\n");
+				const show = lines.slice(0, maxShow);
+				const nw = Math.max(3, 5);
+
+				let hlRe: RegExp | null = null;
+				try { hlRe = new RegExp(`(${d.pattern})`, "gi"); } catch {}
+
+				const out: string[] = [];
+				let currentFile = "";
+				for (const line of show) {
+					const fileMatch = line.match(/^(.+?)[:-](\d+)[:-](.*)$/);
+					if (fileMatch) {
+						const [, file, lineNo, content] = fileMatch;
+						if (file !== currentFile) {
+							if (currentFile) out.push("");
+							out.push(`  ${theme.fg("accent", theme.bold(file))}`);
+							currentFile = file;
+						}
+						let display = content;
+						if (hlRe) display = content.replace(hlRe, (m) => `${RST}${theme.fg("warning", theme.bold(m))}${RST}`);
+						const padded = `${FG_LNUM}${String(lineNo).padStart(nw)}${RST} ${FG_RULE}│${RST} ${display}${RST}`;
+						out.push(`  ${padded}`);
+					} else if (line.trim()) {
+						out.push(`  ${FG_DIM}  ${line.trim()}${RST}`);
+					}
+				}
+				const preview = out.join("\n");
 				const more = lines.length > maxShow ? `\n${FG_DIM}  ... ${lines.length - maxShow} more lines${RST}` : "";
 				text.setText(fillToolBackground(`  ${FG_DIM}${d.matchCount} matches${RST}${renderToolMetrics(result)}\n${preview}${more}`));
 				return text;

package/src/tools/read.ts

@@ -2,10 +2,10 @@
 
 import { type ToolDefinition, type ExtensionAPI, type ExtensionContext, type AgentToolResult } from "@earendil-works/pi-coding-agent";
 import type { SdkToolDef, ReadDetails, TextContent, ComponentLike, ThemeLike, RenderCtxLike } from "../types.js";
-import { resolveBaseBackground, termWidth, MAX_PREVIEW_LINES, BG_BASE, BG_ERROR, FG_DIM, RST } from "../config.js";
+import { resolveBaseBackground, termWidth, MAX_PREVIEW_LINES, BG_BASE, BG_ERROR, FG_DIM, FG_LNUM, FG_RULE, RST } from "../config.js";
 import { shortPath, normalizeLineEndings } from "../helpers.js";
 import { wrapExecuteWithMetrics } from "./metrics.js";
-import { renderFindResults, renderToolError, renderToolMetrics, fillToolBackground } from "../render.js";
+import { renderToolError, renderToolMetrics, fillToolBackground, renderFileContent } from "../render.js";
 
 // Simple terminal image support check
 function isImageTerminal(): boolean {
@@ -57,9 +57,7 @@ export function registerReadTool(
 			resolveBaseBackground(theme);
 			
 			const text = ctx.lastComponent ?? new TC("", 0, 0);
-			const p = shortPath(cwd, home, String(args.path ?? ""));
-			const off = typeof args.offset === "number" ? `:${args.offset}` : "";
-			text.setText(fillToolBackground(`\n  ${theme.fg("toolTitle", theme.bold("read"))} ${theme.fg("accent", p)}${theme.fg("dim", off)}`, ctx.isError ? BG_ERROR : undefined));
+			text.setText("");
 			return text;
 		},
 
@@ -92,11 +90,45 @@ export function registerReadTool(
 				return text;
 			}
 
-			// File content
+			// File content — line-numbered display
 			if (d?._type === "readFile" && d.content) {
-				const rendered = renderFindResults(d.content).split("\n").map(l => `  ${l}`).join("\n");
+				const tw = termWidth();
+				const lines = d.content.split("\n");
+				const total = lines.length;
+				const maxShow = ctx.expanded ? lines.length : Math.min(lines.length, MAX_PREVIEW_LINES);
+				const show = lines.slice(0, maxShow);
+				const nw = Math.max(3, String(total).length);
+				const gw = nw + 3;
+				const cw = Math.max(1, tw - gw);
+
+				const p2 = shortPath(cwd, home, String(d.filePath ?? ""));
+				const off2 = typeof d.offset === "number" ? `:${d.offset}` : "";
+				const header = `${theme.fg("toolTitle", theme.bold("read"))} ${theme.fg("accent", p2)}${theme.fg("dim", off2)}`;
+				const out: string[] = ["", `  ${header}`];
+				out.push(`  ${FG_RULE}${"─".repeat(tw - 2)}${RST}`);
+				for (let i = 0; i < show.length; i++) {
+					const ln = (d.offset || 0) + i + 1;
+					const code = show[i] ?? "";
+					const display = code.length > cw ? code.slice(0, cw) + `${FG_DIM}›${RST}` : code;
+					const lineNo = String(ln);
+					out.push(`  ${FG_LNUM}${" ".repeat(Math.max(0, nw - lineNo.length))}${lineNo}${RST} ${FG_RULE}│${RST} ${display}${RST}`);
+				}
+				if (total > maxShow) {
+					out.push(`  ${FG_DIM}  … ${total - maxShow} more lines (${total} total)${RST}`);
+				}
+				out.push("");
+				const rendered = out.join("\n");
 				text.setText(fillToolBackground(rendered));
 				(ctx as any).state._rt = rendered;
+
+				// Async syntax highlighting via Shiki
+				renderFileContent(d.content, d.filePath, d.offset || 0, maxShow, tw).then(hl => {
+					const padded = hl.split("\n").map(l => `  ${l}`).join("\n");
+					const rendered = `\n  ${header}\n${padded}\n`;
+					text.setText(fillToolBackground(rendered));
+					(ctx as any).state._rt = rendered;
+				}).catch(() => {});
+
 				return text;
 			}
 

package/test/bash-rendering.test.ts

@@ -211,7 +211,6 @@ describe("bash renderCall expansion", () => {
 			expect(lines[3]).toMatch(/^  /);
 			expect(lines[3].trim()).toBe("");
 			expect(lines[4]).toMatch(/^  second error/);
-			expect(lines[5]).toMatch(/^─+$/);
 		});
 	});