@gavin-hu/my-pi-agent 0.11.4 → 0.13.0

package/extensions/plan/tui.ts

@@ -1,10 +1,6 @@
 /**
  * Terminal rendering for the plan review screen.
  *
- * `sanitizePlanText` is exported so the transcript renderer (`tools.ts`) can
- * strip control characters from plan text with the same rules the review screen
- * uses.
- *
  * `PlanViewComponent` is the scrollable review screen `exit_plan_mode` opens
  * for approval. The plan body is rendered by Pi's own `Markdown` component with
  * the active Markdown theme, so headings, lists, code, links, and quotes match
@@ -30,7 +26,7 @@ import {
 	type TuiMouseEvent,
 	type TuiMouseEventResult,
 } from "@earendil-works/pi-tui";
-import { stripControlChars } from "../../lib/format.ts";
+import { sanitizeLine } from "../../lib/format.ts";
 import {
 	editorTheme,
 	screenHint,
@@ -45,8 +41,8 @@ import { titleRule } from "../../lib/tui/rules.ts";
 import { emptyState, checkbox } from "../../lib/tui/rows.ts";
 import { paint } from "../../lib/tui/tokens.ts";
 import { planTitle, type StoredPlan } from "./plans.ts";
-import { changedSections, extractPlanSections } from "./steps.ts";
-import { stripFeedback } from "./feedback.ts";
+import { changedSections, sanitizePlanText, type SectionDigest } from "./plan-text.ts";
+import { extractPlanSections } from "./steps.ts";
 
 /** What the user chose from the read/review screen. */
 export type PlanViewAction = "approve" | "refine" | "keep" | "browser";
@@ -71,10 +67,10 @@ interface BodyCache {
 export interface PlanViewOptions {
 	plan: StoredPlan;
 	/**
-	 * The content the previous review of this plan showed, when there was one.
-	 * Used only to mark the sections that changed since then.
+	 * The section digests the previous review of this plan showed, when there was
+	 * one. Used only to mark the sections that changed since then.
 	 */
-	previous?: string;
+	baseline?: SectionDigest[];
 	theme: Theme;
 	/**
 	 * Called once when the screen closes. `refinement` carries the typed text
@@ -110,17 +106,6 @@ const PRIMARY_HINTS: ScreenHint[] = [
 const SCROLL_HINTS: ScreenHint[] = ["↑/↓ or k/j scroll", "space/b page", "g/G ends"];
 /** Section-jump hint, shown when the plan has more than one heading section. */
 const SECTION_HINTS: ScreenHint[] = ["n/p section"];
-/** Spaces a tab expands to; the terminal's own tab stops are not width-modelled. */
-const TAB_WIDTH = 4;
-
-/**
- * Replace control characters (including ESC and the C1 block) and expand tabs
- * so model-authored plan text cannot drive the terminal. Newlines are kept, so
- * callers can still render or split the text line by line.
- */
-export function sanitizePlanText(text: string): string {
-	return stripControlChars(text.replace(/\t/g, " ".repeat(TAB_WIDTH)));
-}
 
 /** A task checkbox in a list marker: `- [x] `, `1. [ ] `. */
 const TASK_MARKER = /^([-*+]|\d+[.)])(\s+)(\[([ xX])\])(\s*)$/;
@@ -128,8 +113,11 @@ const TASK_MARKER = /^([-*+]|\d+[.)])(\s+)(\[([ xX])\])(\s*)$/;
 /**
  * Wrap the Markdown theme so task checkboxes read at a glance with the shared
  * `◼`/`◻` vocabulary, the same box the bytefly screen and the question dialog
- * draw. The replacement is one column wide instead of the bracket's three, so a
- * wrapped list continuation shifts left by two.
+ * draw. The box is one column wide instead of the bracket's three, so the two
+ * freed columns are kept as padding: pi-tui derives a continuation line's indent
+ * from the original marker's width, and shortening the marker without padding
+ * hangs every wrapped task line two columns too far right, where the width
+ * truncation clips its tail.
  */
 function planMarkdownTheme(theme: Theme, base: MarkdownTheme): MarkdownTheme {
 	return {
@@ -138,7 +126,9 @@ function planMarkdownTheme(theme: Theme, base: MarkdownTheme): MarkdownTheme {
 			const match = TASK_MARKER.exec(text);
 			if (!match) return base.listBullet(text);
 			const [, bullet, gap, , mark, trail] = match;
-			return `${base.listBullet(`${bullet}${gap}`)}${checkbox(theme, mark.toLowerCase() === "x")}${trail}`;
+			const themed = `${base.listBullet(`${bullet}${gap}`)}${checkbox(theme, mark.toLowerCase() === "x")}`;
+			const pad = Math.max(0, visibleWidth(text) - visibleWidth(themed) - visibleWidth(trail));
+			return `${themed}${" ".repeat(pad)}${trail}`;
 		},
 	};
 }
@@ -205,10 +195,7 @@ export class PlanViewComponent implements Component {
 		const base = this.options.markdownTheme ?? getMarkdownTheme();
 		const theme = planMarkdownTheme(this.theme, base);
 		const current = sanitizePlanText(this.options.plan.content);
-		const changed =
-			this.options.previous === undefined
-				? new Set<string>()
-				: changedSections(stripFeedback(this.options.previous), stripFeedback(current));
+		const changed = changedSections(this.options.baseline, current);
 		const chunks = extractPlanSections(current);
 		const lines: string[] = [];
 		const sections: SectionOffset[] = [];
@@ -221,14 +208,14 @@ export class PlanViewComponent implements Component {
 			sections.push({
 				title: chunk.title,
 				offset: lines.length,
-				...(changed.has(chunk.title) ? { changed: true } : {}),
+				...(changed[index] ? { changed: true } : {}),
 			});
 			lines.push(...rendered);
 			// Sections render independently, so restore the blank line a heading-only
 			// chunk omits before the next section.
 			if (index < chunks.length - 1 && lines.length > 0 && lines[lines.length - 1] !== "") lines.push("");
 		});
-		this.cache = { width, lines, sections, changedCount: chunks.filter((chunk) => changed.has(chunk.title)).length };
+		this.cache = { width, lines, sections, changedCount: changed.filter(Boolean).length };
 		return this.cache;
 	}
 
@@ -363,7 +350,7 @@ export class PlanViewComponent implements Component {
 		const theme = this.theme;
 		const w = Math.max(1, width);
 		const plan = this.options.plan;
-		const title = planTitle(basename(plan.path));
+		const title = sanitizeLine(planTitle(basename(plan.path)));
 
 		const previousWidth = this.cache?.width;
 		const built = plan.content.trim() ? this.build(w) : { width: w, lines: [], sections: [], changedCount: 0 };

package/extensions/plan/types.ts

@@ -2,6 +2,8 @@
  * Shared types for the plan-mode extension.
  */
 
+import type { PlanAnnotation } from "./feedback.ts";
+import type { SectionDigest } from "./plan-text.ts";
 import type { StepUpdate } from "./steps.ts";
 
 /** Persisted (custom entry) plan-mode state. */
@@ -14,6 +16,14 @@ export interface PlanModeEntry {
 	removed?: string[];
 }
 
+/** Persisted (custom entry) review baseline for one plan. */
+export interface ReviewBaselineEntry {
+	/** Resolved path of the plan file the review showed. */
+	path: string;
+	/** One digest per heading section, in document order. */
+	sections: SectionDigest[];
+}
+
 /** Structured result carried in `enter_plan_mode`'s `details`. */
 export interface EnterPlanModeDetails {
 	/** Whether the user agreed to enter plan mode. */
@@ -62,6 +72,8 @@ export interface ExitPlanModeDetails {
 	refined?: boolean;
 	/** The refinement the user typed, when `refined` is true. */
 	refinement?: string;
+	/** Comments the review carried when it approved or requested a refinement. */
+	annotations?: PlanAnnotation[];
 	/** True when no interactive UI was available to ask for approval. */
 	unavailable?: boolean;
 }

package/extensions/plan/web-client.ts

@@ -17,12 +17,15 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
   "use strict";
 
   var dataNode = document.getElementById("review-data");
-  var fallback = { blocks: [], annotations: [], outline: [], steps: { done: 0, total: 0 }, code: {}, token: "" };
+  // The caps come from the island, which takes them from the server's own
+  // validation; the fallback only guards a page whose island failed to parse.
+  var fallback = { blocks: [], annotations: [], outline: [], steps: { done: 0, total: 0 }, code: {}, limits: { comments: 200, comment: 2000, quote: 500 }, token: "" };
   var data = fallback;
   if (dataNode && dataNode.textContent) {
     try { data = JSON.parse(dataNode.textContent); } catch (error) { data = fallback; }
   }
   var token = typeof data.token === "string" ? data.token : "";
+  var limits = data.limits || fallback.limits;
   var annotations = Array.isArray(data.annotations) ? data.annotations.slice() : [];
   var saved = false;
   var approved = false;
@@ -34,6 +37,7 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
   var pendingQuote = null;
   var activeIndex = -1;
   var outlineItems = {};
+  var stream = null;
 
   var planEl = document.getElementById("plan");
   var statusEl = document.getElementById("status");
@@ -94,12 +98,20 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
     stateEl.className = "bf-chip bf-chip--accent review-state" + (tone ? " bf-chip--" + tone : "");
   }
 
-  function safeHref(url) {
+  // A link is rendered only for an http(s) or mailto target. Resolving against
+  // the review origin is what catches a target that only looks relative: the
+  // URL parser strips a tab or newline, so "/\t/evil.com" is cross-origin once
+  // it is parsed, and a disguised target must stay text.
+  function safeHref(url, base) {
     var trimmed = String(url).trim();
-    if (/^[\\/]{2}/.test(trimmed)) return null;
-    if (/^(https?:|mailto:)/i.test(trimmed)) return trimmed;
-    if (/^[a-z][a-z0-9+.-]*:/i.test(trimmed)) return null;
-    return trimmed;
+    if (!trimmed || /^\/\//.test(trimmed)) return null;
+    var resolved;
+    try { resolved = new URL(trimmed, base); } catch (error) { return null; }
+    if (resolved.protocol === "mailto:") return trimmed;
+    if (resolved.protocol !== "http:" && resolved.protocol !== "https:") return null;
+    if (resolved.username || resolved.password) return null;
+    if (resolved.origin === new URL(base).origin) return resolved.href;
+    return /^https?:\/\//i.test(trimmed) ? resolved.href : null;
   }
 
   // Inline token order matters: code, emphasis, and links are matched before a
@@ -120,7 +132,7 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
         var em = el("em"); em.textContent = match[1]; container.appendChild(em); return;
       }
       if ((match = /^\[([^\]]+)\]\(([^)]+)\)$/.exec(part))) {
-        var href = safeHref(match[2]);
+        var href = safeHref(match[2], location.href);
         if (!href) { container.appendChild(document.createTextNode(part)); return; }
         var link = el("a"); link.textContent = match[1]; link.href = href; link.target = "_blank"; link.rel = "noreferrer noopener";
         container.appendChild(link); return;
@@ -133,7 +145,7 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
         }
         var dot = url.indexOf(".");
         var target = /^www\./i.test(url) ? "http://" + url : url;
-        var safe = dot > 0 && /\.[^./]/.test(url.slice(dot)) ? safeHref(target) : null;
+        var safe = dot > 0 && /\.[^./]/.test(url.slice(dot)) ? safeHref(target, location.href) : null;
         if (safe) {
           var auto = el("a");
           auto.textContent = url;
@@ -311,7 +323,7 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
     if (!selection || selection.isCollapsed) return "";
     var range = selection.rangeCount ? selection.getRangeAt(0) : null;
     if (!range || !wrap.contains(range.commonAncestorContainer)) return "";
-    return selection.toString().replace(/\s+/g, " ").trim().slice(0, 500);
+    return selection.toString().replace(/\s+/g, " ").trim().slice(0, limits.quote);
   }
 
   function commentsBoxAfter(wrap) {
@@ -325,7 +337,9 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
   // Enter submits a comment; Shift+Enter is left for the browser.
   function submitOnEnter(area, submit) {
     area.addEventListener("keydown", function (event) {
-      if (event.key !== "Enter" || event.shiftKey) return;
+      // An IME uses Enter to commit a composition; submitting then would send a
+      // half-typed comment.
+      if (event.key !== "Enter" || event.shiftKey || event.isComposing) return;
       event.preventDefault();
       submit();
     });
@@ -343,6 +357,7 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
     var area = el("textarea", "bf-textarea");
     area.placeholder = "Leave feedback on this part of the plan (Enter to add)";
     area.setAttribute("aria-label", "Comment");
+    area.maxLength = limits.comment;
     composer.appendChild(area);
     var row = el("div", "bf-composer__row");
     var cancel = el("button"); cancel.type = "button"; cancel.className = "bf-btn"; cancel.textContent = "Cancel";
@@ -351,7 +366,7 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
     var submit = function () {
       var comment = area.value.replace(/\s+/g, " ").trim();
       if (!comment) { area.focus(); return; }
-      if (annotations.length >= 200) { setStatus("Comment limit reached (200).", "error"); return; }
+      if (annotations.length >= limits.comments) { setStatus("Comment limit reached (" + limits.comments + ").", "error"); return; }
       annotations.push(quote ? { anchor: block.start, quote: quote, comment: comment } : { anchor: block.start, comment: comment });
       dirty = true;
       renderPlan();
@@ -369,6 +384,7 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
     var area = el("textarea", "bf-textarea");
     area.value = annotation.comment;
     area.setAttribute("aria-label", "Edit comment");
+    area.maxLength = limits.comment;
     card.appendChild(area);
     var row = el("div", "bf-comment__row");
     var cancel = el("button"); cancel.type = "button"; cancel.className = "bf-btn"; cancel.textContent = "Cancel";
@@ -585,6 +601,10 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
       planEl.appendChild(box);
     }
     planEl.scrollTop = scrollTop;
+    // The DOM was rebuilt, so the active block's class is gone; restore it in
+    // place rather than scrolling, so j/k resume where the reviewer was.
+    var active = activeIndex >= 0 ? blockElements()[activeIndex] : null;
+    if (active) active.classList.add("bf-block--active");
     renderFacts();
     observeSections();
     updateState();
@@ -633,6 +653,12 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
     controls.appendChild(reload);
   }
 
+  // The stream exists only to notice a closed tab. Once the review is settled it
+  // has no job, and leaving it open retries a dead port until the tab closes.
+  function settleStream() {
+    if (stream && stream.close) { stream.close(); stream = null; }
+  }
+
   // Save and approve share the same POST shape; only the route, the settled
   // flag, and the wording differ. Both persist the current annotations.
   function submit(url, okText, failText, mark) {
@@ -644,6 +670,7 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
       if (response.ok) {
         mark();
         dirty = false;
+        settleStream();
         setStatus(okText, "saved");
         lockActions();
         updateState();
@@ -656,7 +683,12 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
         offerReload();
         return;
       }
-      throw new Error("server returned " + response.status);
+      // Surface the server's own reason (a malformed comment, a stale body)
+      // rather than a bare status code.
+      return response.json().then(
+        function (payload) { throw new Error(payload && payload.error ? payload.error : "server returned " + response.status); },
+        function () { throw new Error("server returned " + response.status); }
+      );
     }).catch(function (error) {
       setStatus(failText + error.message, "error");
     });
@@ -677,6 +709,7 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
   function cancel() {
     if (saved || approved || closed) return;
     closed = true;
+    settleStream();
     lockActions();
     setStatus("Closing\u2026");
     updateState();
@@ -742,18 +775,18 @@ export const REVIEW_CLIENT_JS = String.raw`(function () {
     if (event.key === "s") { event.preventDefault(); save(); return; }
   });
 
-  window.addEventListener("beforeunload", function () {
-    if (saved || approved || closed) return;
-    var url = "/api/cancel?token=" + encodeURIComponent(token);
-    if (navigator.sendBeacon) navigator.sendBeacon(url);
-  });
+  // A closed tab is detected by the stream below: the server sees the last
+  // client go away and cancels after a grace period, and a reload reconnects
+  // inside it. A beacon here would cancel the review on every reload, including
+  // the reload a 409 offers.
 
   window.addEventListener("scroll", updateProgress);
   window.addEventListener("resize", updateProgress);
+  window.addEventListener("pagehide", settleStream);
   if (planEl) planEl.addEventListener("scroll", updateProgress);
 
   try {
-    var stream = new EventSource("/events?token=" + encodeURIComponent(token));
+    stream = new EventSource("/events?token=" + encodeURIComponent(token));
     stream.addEventListener("open", function () { connected = true; everConnected = true; updateState(); });
     stream.addEventListener("error", function () {
       // The server ends the stream once the review is settled; keep showing the

package/extensions/plan/web-page.ts

@@ -16,6 +16,7 @@
 import {
 	brandLockup,
 	docHead,
+	SIDEBAR_COLLAPSE_MAX,
 	themeToggle,
 	WEB_BASE_CSS,
 	WEB_COMPONENTS_CSS,
@@ -57,6 +58,11 @@ export interface ReviewPageData {
 	steps: { done: number; total: number };
 	/** Highlighted HTML per line, keyed by the code block's 0-based start line. */
 	code: Record<string, string[]>;
+	/**
+	 * The caps the server enforces, so the page does not retype them: comment
+	 * count, comment length, and quote length, from `feedback.ts`.
+	 */
+	limits: { comments: number; comment: number; quote: number };
 	/** Whether the review may approve the plan (only the `exit_plan_mode` flow). */
 	canApprove: boolean;
 	/** Per-session secret the client echoes on every request. */
@@ -85,7 +91,6 @@ ${WEB_COMPONENTS_CSS}
 .review-progress__fill{display:block;height:100%;width:0;background:var(--accent);transition:width var(--motion-fast) linear}
 /* Review panel: the plan's review facts, the section outline, then the keys. */
 .bf-app__body--single{grid-template-columns:minmax(0,1fr)}
-.bf-app__sidebar .bf-panel{flex:1 1 auto;min-height:0;min-width:0}
 .review-panel{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4) var(--space-4) var(--space-2)}
 .review-facts{display:flex;flex-direction:column;gap:var(--space-2);padding-bottom:var(--space-3);border-bottom:1px solid var(--border)}
 .review-fact{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);font-size:var(--fs-sm);color:var(--muted)}
@@ -167,7 +172,7 @@ ${WEB_COMPONENTS_CSS}
 .review-nav .lvl-2 a,.review-nav .lvl-3 a,.review-nav .lvl-4 a,.review-nav .lvl-5 a,.review-nav .lvl-6 a{padding-left:8px}
 .review-hints{display:none}
 }
-@media (max-width:860px){
+@media (max-width:${SIDEBAR_COLLAPSE_MAX}px){
 .bf-review{padding:var(--space-4) 18px 80px}
 .review-nav__title{display:none}
 }

package/extensions/plan/web-router.ts

@@ -50,8 +50,13 @@ const HOST_PATTERN = /^(127\.0\.0\.1|localhost|\[::1\])(:\d+)?$/i;
 
 const HTML_SECURITY: Record<string, string> = {
 	"Content-Type": "text/html; charset=utf-8",
+	// `frame-ancestors` keeps a local page from framing the review and clickjacking
+	// the one control with a side effect (Approve & run); the rest is the same
+	// no-script, no-network envelope the page already relied on.
 	"Content-Security-Policy":
-		"default-src 'none'; img-src 'self' data:; style-src 'unsafe-inline'; script-src 'self'; connect-src 'self'",
+		"default-src 'none'; img-src 'self' data:; style-src 'unsafe-inline'; script-src 'self'; " +
+		"connect-src 'self'; frame-ancestors 'none'; base-uri 'self'; form-action 'none'",
+	"X-Frame-Options": "DENY",
 	"X-Content-Type-Options": "nosniff",
 	"Referrer-Policy": "no-referrer",
 	"Cache-Control": "no-store",
@@ -62,7 +67,7 @@ const SCRIPT_HEADERS: Record<string, string> = {
 	"Content-Type": "text/javascript; charset=utf-8",
 };
 
-const JSON_HEADERS: Record<string, string> = {
+export const JSON_HEADERS: Record<string, string> = {
 	"Content-Type": "application/json; charset=utf-8",
 	"X-Content-Type-Options": "nosniff",
 	"Referrer-Policy": "no-referrer",
@@ -112,7 +117,10 @@ function checkEnvelope(
 ): ServeResponse | undefined {
 	const upper = method.toUpperCase();
 	if (upper !== "GET" && upper !== "HEAD" && upper !== "POST") {
-		return { ...errorResponse(405, "Only GET and POST are served."), headers: { ...JSON_HEADERS, Allow: "GET, POST" } };
+		return {
+			...errorResponse(405, "Only GET, HEAD, and POST are served."),
+			headers: { ...JSON_HEADERS, Allow: "GET, HEAD, POST" },
+		};
 	}
 	// Fail closed: a missing or non-string Host is rejected too, not just a
 	// foreign one, so the DNS-rebinding guard cannot be skipped.