@tiagojct/subsub 0.16.0 → 0.18.0

package/src/web.ts

@@ -16,16 +16,17 @@
 
 import { spawn, type ChildProcess } from "node:child_process";
 import { randomBytes, timingSafeEqual } from "node:crypto";
-import { createReadStream, existsSync, mkdirSync, readFileSync, renameSync, statSync, writeFileSync, appendFileSync } from "node:fs";
+import { createReadStream, existsSync, mkdirSync, readdirSync, readFileSync, renameSync, statSync, writeFileSync, appendFileSync } from "node:fs";
 import { createServer, type IncomingMessage, type Server, type ServerResponse } from "node:http";
 import { homedir } from "node:os";
-import { extname, join, normalize, resolve, sep } from "node:path";
+import { basename, dirname, extname, join, normalize, relative, resolve, sep } from "node:path";
 import { StringDecoder } from "node:string_decoder";
 import { agentDirFor, chooseCwd, PACKAGE_DIR, packageVersion } from "./cli.ts";
 import { configPath, expand, loadConfig, RECOMMENDED_MODELS, readConfigFile, saveConfig, type SubsubConfig, uiLanguage, withStarbuck } from "./config.ts";
 import { TESTED_MODELS } from "./init.ts";
 import { KEY_PROVIDERS, saveApiKey } from "./keys.ts";
-import { obsidianRoot } from "./layout.ts";
+import { NOTE_DIRS, obsidianRoot, SETTINGS_DIR } from "./layout.ts";
+import { field, frontMatter } from "./notes.ts";
 import { realish, within } from "./paths.ts";
 
 // ---------------------------------------------------------------- options
@@ -199,9 +200,49 @@ const TYPES: Record<string, string> = {
 	".ico": "image/x-icon",
 };
 
+/** Files that the notes pane shows. */
+const NOTE_TYPES = new Set([".md", ".markdown"]);
+
+/** Images that a note shows (a figure cut out of a PDF, for example). */
+const IMAGE_TYPES: Record<string, string> = { ".png": "image/png", ".jpg": "image/jpeg", ".jpeg": "image/jpeg", ".gif": "image/gif", ".webp": "image/webp" };
+
 /** Files that the Open button may hand to the system (never programs or scripts). */
 export const OPENABLE = new Set([".md", ".markdown", ".txt", ".pdf", ".bib", ".csv", ".qmd"]);
 
+/** A file inside the working folder or the Sub-Sub folder, judged by its real path, so a link cannot point outside. */
+export function allowedFile(raw: string, cwd: string, vault?: string): string | undefined {
+	// expand() resolves against the process folder: use it for "~" only.
+	const target = resolve(cwd, raw.startsWith("~") ? expand(raw) : raw);
+	const real = realish(target);
+	const inside = within(real, realish(cwd)) || Boolean(vault && within(real, realish(vault)));
+	return inside && existsSync(target) && statSync(target).isFile() ? target : undefined;
+}
+
+/** The note a [[wikilink]] names: the first <folder>/<name>.md in the Sub-Sub folder, as Obsidian would find it. */
+export function wikilinkTarget(name: string, root: string): string | undefined {
+	const file = name.endsWith(".md") ? name : `${name}.md`;
+	return ["", ...NOTE_DIRS, SETTINGS_DIR].map((d) => join(root, d, file)).find((f) => existsSync(f));
+}
+
+/** The notes in the Sub-Sub folders, newest first (dot folders such as Research/.plans left out). */
+export function listNotes(root: string, max = 300): Array<{ path: string; rel: string; modified: number }> {
+	const out: Array<{ path: string; rel: string; modified: number }> = [];
+	for (const d of [...NOTE_DIRS, SETTINGS_DIR]) {
+		let names: string[] = [];
+		try {
+			names = readdirSync(join(root, d), { recursive: true }) as string[];
+		} catch {
+			continue;
+		}
+		for (const n of names) {
+			if (!n.endsWith(".md") || n.split(/[\\/]/).some((x) => x.startsWith("."))) continue;
+			const path = join(root, d, n);
+			out.push({ path, rel: join(d, n), modified: statSync(path).mtimeMs });
+		}
+	}
+	return out.sort((a, b) => b.modified - a.modified).slice(0, max);
+}
+
 const CSP = [
 	"default-src 'none'",
 	"script-src 'self'",
@@ -214,6 +255,14 @@ const CSP = [
 	"frame-ancestors 'none'",
 ].join("; ");
 
+function readText(path: string): string {
+	try {
+		return readFileSync(path, "utf8");
+	} catch {
+		return "";
+	}
+}
+
 function same(a: string, b: string): boolean {
 	const x = Buffer.from(a);
 	const y = Buffer.from(b);
@@ -300,6 +349,7 @@ export async function startWeb(opts: WebOptions, env: NodeJS.ProcessEnv = proces
 	const agentDir = agentDirFor(env, home);
 	const cwd = chooseCwd(process.cwd(), home, cfg.vault, opts.here);
 	const lang = uiLanguage(cfg.language);
+	const notesRoot = cfg.vault ?? cwd;
 	const token = randomBytes(24).toString("base64url");
 	const webDir = join(PACKAGE_DIR, "web");
 	const bin = join(PACKAGE_DIR, "bin", "subsub.js");
@@ -313,6 +363,7 @@ export async function startWeb(opts: WebOptions, env: NodeJS.ProcessEnv = proces
 	const clients = new Set<ServerResponse>();
 	const dialogs = new Map<string, any>();
 	let subsubState: unknown = null;
+	let lastFind: { q?: string } | null = null;
 	let busy = false;
 	let lastSeen = Date.now();
 	let restarting = false;
@@ -347,6 +398,12 @@ export async function startWeb(opts: WebOptions, env: NodeJS.ProcessEnv = proces
 					subsubState = null;
 				}
 				broadcast({ type: "subsub_state", state: subsubState });
+			} else if (ev.method === "setStatus" && ev.statusKey === "subsub.find") {
+				try {
+					lastFind = ev.statusText ? JSON.parse(ev.statusText) : null;
+				} catch {
+					lastFind = null;
+				}
 			} else if (ev.method === "notify") {
 				broadcast(ev);
 			}
@@ -388,13 +445,23 @@ export async function startWeb(opts: WebOptions, env: NodeJS.ProcessEnv = proces
 			out.session = await agent.request({ type: "get_state" });
 			lastSession = (out.session as { sessionFile?: string }).sessionFile ?? lastSession;
 			out.messages = ((await agent.request({ type: "get_messages" })) as { messages: unknown[] }).messages;
-			out.commands = ((await agent.request({ type: "get_commands" })) as { commands: unknown[] }).commands;
+			const commands = ((await agent.request({ type: "get_commands" })) as { commands: Array<Record<string, any>> }).commands;
+			// RPC has no argument hints: read them from the prompt files.
+			out.commands = commands.map((c) => {
+				const front = c.source === "prompt" && c.sourceInfo?.path ? frontMatter(readText(c.sourceInfo.path)) : undefined;
+				const hint = front && field(front, "argument-hint");
+				return hint ? { ...c, hint } : c;
+			});
 		} catch (err) {
 			out.error = (err as Error).message;
 		}
 		return out;
 	}
 
+	async function currentSession(): Promise<string | undefined> {
+		return ((await agent.request({ type: "get_state" })) as { sessionFile?: string }).sessionFile;
+	}
+
 	async function sessions(): Promise<unknown[]> {
 		const { SessionManager } = await import("@earendil-works/pi-coding-agent");
 		const list = await SessionManager.list(cwd);
@@ -521,7 +588,8 @@ export async function startWeb(opts: WebOptions, env: NodeJS.ProcessEnv = proces
 					const message = String(body.message ?? "").trim();
 					if (!message) return send(res, 400, { error: "empty message" });
 					try {
-						await agent.request({ type: "prompt", message, ...(busy ? { streamingBehavior: "followUp" } : {}) });
+						// A command answers only after its dialogs close (/read, /undo), so wait longer than the default.
+						await agent.request({ type: "prompt", message, ...(busy ? { streamingBehavior: "followUp" } : {}) }, 60 * 60_000);
 					} catch (err) {
 						// No provider yet: the page opens the model dialog instead of showing pi's text.
 						if (/no api key|no model|no models available/i.test((err as Error).message)) return send(res, 409, { error: "nomodel" });
@@ -609,14 +677,66 @@ export async function startWeb(opts: WebOptions, env: NodeJS.ProcessEnv = proces
 						if (body.provider === "opencode-go" && Object.keys(current.models).length === 0) saveConfig({ models: TESTED_MODELS, model: undefined }, env);
 					});
 				}
+				case "GET /api/notes":
+					return send(res, 200, { root: notesRoot, notes: listNotes(notesRoot) });
+				case "GET /api/note": {
+					const raw = url.searchParams.get("path") ?? "";
+					const wiki = !/[\\/]/.test(raw) && !/\.\w+$/.test(raw) ? wikilinkTarget(raw, notesRoot) : undefined;
+					// A relative path is tried in the working folder, then in the Sub-Sub folder (Literature/x.md).
+					const file = allowedFile(wiki ?? raw, cwd, cfg.vault) ?? allowedFile(raw, notesRoot, cfg.vault);
+					if (!file) return send(res, 404, { error: "not found in the Sub-Sub folder" });
+					if (!NOTE_TYPES.has(extname(file).toLowerCase())) return send(res, 415, { error: "not a note" });
+					if (statSync(file).size > 2_000_000) return send(res, 413, { error: "too large to show" });
+					return send(res, 200, { path: file, name: basename(file), text: readFileSync(file, "utf8") });
+				}
+				case "GET /api/note-file": {
+					const raw = url.searchParams.get("path") ?? "";
+					const file = allowedFile(raw, cwd, cfg.vault) ?? allowedFile(raw, notesRoot, cfg.vault);
+					if (!file) return send(res, 404, { error: "not found in the Sub-Sub folder" });
+					const type = IMAGE_TYPES[extname(file).toLowerCase()];
+					if (!type) return send(res, 415, { error: "not an image" });
+					if (statSync(file).size > 20_000_000) return send(res, 413, { error: "too large to show" });
+					res.writeHead(200, { ...common, "Content-Type": type, "Cache-Control": "no-store", "X-Content-Type-Options": "nosniff" });
+					return void createReadStream(file).pipe(res);
+				}
+				case "GET /api/library": {
+					const q = (url.searchParams.get("q") ?? "").replace(/\s+/g, " ").trim().slice(0, 200);
+					if (!q) return send(res, 200, { q, items: [] });
+					await agent.request({ type: "prompt", message: `/subsub-find ${q}` });
+					return send(res, 200, lastFind?.q === q ? lastFind : { q, items: [] });
+				}
+				case "POST /api/session/name": {
+					const body = await readJson(req);
+					const name = String(body.name ?? "").replace(/\s+/g, " ").trim();
+					if (!name || name.length > 120) return send(res, 400, { error: "a name of 1 to 120 characters" });
+					const known = (await sessions()) as Array<{ path: string }>;
+					if (!known.some((x) => x.path === body.path)) return send(res, 404, { error: "no such session" });
+					if (body.path === (await currentSession())) await agent.request({ type: "set_session_name", name });
+					else {
+						const { SessionManager } = await import("@earendil-works/pi-coding-agent");
+						SessionManager.open(String(body.path)).appendSessionInfo(name);
+					}
+					return send(res, 200, { ok: true });
+				}
+				case "POST /api/session/trash": {
+					const body = await readJson(req);
+					const known = (await sessions()) as Array<{ path: string }>;
+					if (!known.some((x) => x.path === body.path)) return send(res, 404, { error: "no such session" });
+					if (body.path === (await currentSession())) return send(res, 409, { error: "the open conversation" });
+					// Nothing is deleted: the file moves to a trash folder next to the agent folder, in the same
+					// subfolder as under sessions/, so that moving it back is one step.
+					const rel = relative(join(agentDir, "sessions"), String(body.path));
+					const to = join(dirname(agentDir), "trash", rel.startsWith("..") ? basename(rel) : rel);
+					mkdirSync(dirname(to), { recursive: true });
+					renameSync(String(body.path), to);
+					return send(res, 200, { ok: true });
+				}
 				case "POST /api/open": {
 					const body = await readJson(req);
-					const target = resolve(cwd, expand(String(body.path ?? "")));
 					const vault = cfg.vault;
 					// Judge the real file, so a link inside the Sub-Sub folder cannot open a document outside it.
-					const real = realish(target);
-					const inside = within(real, realish(cwd)) || Boolean(vault && within(real, realish(vault)));
-					if (!inside || !existsSync(target)) return send(res, 404, { error: "not found in the Sub-Sub folder" });
+					const target = allowedFile(String(body.path ?? ""), cwd, vault);
+					if (!target) return send(res, 404, { error: "not found in the Sub-Sub folder" });
 					// Documents only: a file that the model wrote must never be run.
 					if (!OPENABLE.has(extname(target).toLowerCase())) return send(res, 403, { error: "Sub-Sub opens only notes and documents (.md, .txt, .pdf, .bib, .csv, .qmd)." });
 					if (vault && within(target, vault) && obsidianRoot(vault)) openExternal(`obsidian://open?path=${encodeURIComponent(target)}`);

package/templates/Zotero agent.md

@@ -41,10 +41,10 @@ Shared rules for Sub-Sub. Sub-Sub reads this file at the start of every session.
 - Create a note only when the user asks. Ask before creating more than 10 notes.
 - Write from the full text (get_fulltext) when it exists. Otherwise use the abstract and the Zotero notes, and write "(from abstract)" after the summary.
 - Front matter field evidence: full text, abstract or metadata (what you read). Page numbers only with evidence: full text. Sub-Sub refuses a literature note without this field.
-- Do not copy the abstract in full. Give page numbers for quotes when the text shows them.
+- Do not copy the abstract in full. Give the page of a quote as (p. N) right after it, when you read the full text; Sub-Sub links it to that page of the PDF in Zotero.
 - If a note for the citekey exists, do not overwrite it. Add a dated section or ask.
 - After the note is written, offer to link it in Zotero with attach_note.
-- The profile can change this format: the Reader profile writes quotes and questions instead of a summary.
+- /read writes a reading note instead: quotes with their place and questions, which the user answers.
 
 Template:
 

package/web/app.css

@@ -195,6 +195,8 @@ select:hover { border-color: var(--rule-strong); }
 }
 .app.side-collapsed { grid-template-columns: 0 minmax(0, 1fr); }
 .app.side-collapsed .side { display: none; }
+.app.note-open { grid-template-columns: var(--side-w) minmax(0, 1fr) minmax(20rem, 36%); }
+.app.note-open.side-collapsed { grid-template-columns: 0 minmax(0, 1fr) minmax(20rem, 40%); }
 
 /* ---------------------------------------------------------------- top bar */
 
@@ -274,6 +276,8 @@ select:hover { border-color: var(--rule-strong); }
 /* ---------------------------------------------------------------- side panel */
 
 .side {
+	/* The containing block of the switch's hidden input: without it, the page itself scrolls. */
+	position: relative;
 	border-right: 1px solid var(--rule);
 	background: var(--surface);
 	padding: 0.9rem 0.75rem 0.75rem;
@@ -558,6 +562,7 @@ body.layout-full { --measure: 72rem; }
 .msg-action-btn { font-size: 0.75rem; padding: 0.15rem 0.45rem; color: var(--faint); }
 .msg-action-btn:hover { color: var(--text); background: var(--surface); }
 .msg-action-btn.copied { color: var(--add); }
+.table-actions { display: flex; justify-content: flex-end; margin: -0.35rem 0 0.9rem; }
 
 /* Tool calls: one quiet line each; the result opens below. */
 .tool { margin: 0.35rem 0; font-size: 0.82rem; color: var(--muted); }
@@ -736,7 +741,7 @@ body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0;
 	padding: 0.3rem;
 	z-index: 5;
 }
-.suggest button { display: flex; align-items: baseline; gap: 0.6rem; width: 100%; text-align: left; padding: 0.38rem 0.55rem; border-radius: 5px; }
+.suggest button, .suggest .hint-row { display: flex; align-items: baseline; gap: 0.6rem; width: 100%; text-align: left; padding: 0.38rem 0.55rem; border-radius: 5px; }
 .suggest button[aria-selected="true"], .suggest button:hover { background: var(--accent-soft); }
 .suggest .name { font-family: var(--mono); font-size: 0.8rem; color: var(--accent); white-space: nowrap; }
 .suggest .desc { color: var(--muted); font-size: 0.82rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@@ -792,6 +797,10 @@ body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0;
 
 .modal-buttons { display: flex; justify-content: flex-end; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.75rem; }
 .modal-buttons button { min-width: 5.5rem; }
+/* Long choices (the reasons of /read) read better as a list than as a row of buttons. */
+.modal-buttons.choices { flex-direction: column; align-items: stretch; }
+.modal-buttons.choices button { text-align: left; }
+.modal-buttons.choices .ghost { align-self: flex-end; }
 .modal-shortcut-hint { font-size: 0.78rem; color: var(--faint); margin-right: auto; }
 .modal-head { display: flex; justify-content: space-between; align-items: center; }
 .modal input[type="text"], .modal input[type="password"], .modal textarea, .modal select {
@@ -845,9 +854,68 @@ body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0;
 .side .phone-only { display: none; }
 .settings { display: grid; gap: 0.6rem; padding: 0 0.3rem; }
 .settings label { display: grid; gap: 0.25rem; font-size: 0.78rem; color: var(--muted); }
-.settings select, .settings button { width: 100%; text-align: left; color: var(--text); }
+.settings button { width: 100%; text-align: left; color: var(--text); }
 .settings .model-btn { font-family: var(--mono); font-size: 0.78rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 
+/* ---------------------------------------------------------------- the flow of works (/lit) */
+
+.flow { display: grid; gap: 1rem; margin: 1rem 0; font-family: var(--sans); }
+.flow-row { display: grid; grid-template-columns: minmax(0, 15rem) repeat(auto-fit, minmax(0, 13rem)); gap: 1.4rem; align-items: center; }
+.flow-box { position: relative; padding: 0.45rem 0.7rem; border: 1px solid var(--rule-strong); border-radius: var(--radius); background: var(--raised); font-size: 0.84rem; text-align: center; }
+.flow-row + .flow-row .flow-box::before { content: ""; position: absolute; left: 50%; top: calc(-1rem - 1px); height: 1rem; border-left: 1px solid var(--muted); }
+.flow-side { position: relative; padding: 0.35rem 0.6rem; border: 1px dashed var(--rule-strong); border-radius: var(--radius); color: var(--muted); font-size: 0.78rem; }
+.flow-side::before { content: ""; position: absolute; right: 100%; top: 50%; width: 1.4rem; border-top: 1px dashed var(--muted); }
+
+/* ---------------------------------------------------------------- library search and notes */
+
+#notes-btn { font-family: var(--sans); }
+#notes-btn[aria-expanded="true"] { color: var(--accent); border-color: var(--accent); }
+
+.items { list-style: none; margin: 0; padding: 0; max-height: 18rem; overflow-y: auto; }
+.items:empty { display: none; }
+.items > li { padding: 0.4rem 0.5rem; border-radius: 5px; }
+.items > li:hover { background: var(--bg); }
+.items > li.muted { font-size: 0.82rem; }
+.item-title { font-size: 0.86rem; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
+.item-meta { font-size: 0.72rem; color: var(--faint); margin-top: 0.1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.item-actions { display: flex; gap: 0.6rem; margin-top: 0.2rem; }
+.item-actions button, .item-actions a { font-size: 0.76rem; color: var(--accent); padding: 0; text-decoration: none; }
+.item-actions button:hover, .item-actions a:hover { text-decoration: underline; text-underline-offset: 0.18em; }
+
+.sessions li { position: relative; }
+.session-tools { position: absolute; top: 0.3rem; right: 0.3rem; display: none; gap: 0.3rem; background: var(--raised); border-radius: 4px; }
+.sessions li:hover .session-tools, .sessions li:focus-within .session-tools { display: flex; }
+/* No hover on a touch screen: the buttons stay under the conversation. */
+@media (hover: none) { .session-tools { display: flex; position: static; justify-content: flex-end; background: none; } }
+.session-tools button { width: auto; padding: 0.1rem 0.35rem; font-size: 0.7rem; color: var(--muted); }
+.session-tools button:hover { color: var(--text); background: var(--bg); }
+
+.note-pane {
+	grid-row: 2;
+	grid-column: 3;
+	border-left: 1px solid var(--rule);
+	background: var(--surface);
+	display: flex;
+	flex-direction: column;
+	min-height: 0;
+	min-width: 0;
+}
+.note-pane[hidden] { display: none; }
+.note-head { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.9rem; border-bottom: 1px solid var(--rule); }
+.note-name { flex: 1; min-width: 0; font-size: 0.84rem; font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.note-pane > .search { margin: 0.6rem 0.9rem 0; width: auto; }
+.note-body { flex: 1; overflow-y: auto; padding: 0.9rem 1.1rem 1.5rem; }
+.note-body .front { font-size: 0.74rem; color: var(--muted); margin: 0 0 1rem; }
+.note-body .front summary { cursor: pointer; }
+.note-body .front pre { background: var(--bg); border: 1px solid var(--rule); border-radius: var(--radius); padding: 0.5rem 0.7rem; margin: 0.4rem 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
+.note-list { list-style: none; margin: 0; padding: 0; }
+.note-list button { width: 100%; text-align: left; padding: 0.4rem 0.5rem; border-radius: 5px; display: grid; gap: 0.1rem; }
+.note-list button:hover { background: var(--bg); }
+.note-list .rel { font-size: 0.84rem; overflow-wrap: anywhere; }
+.note-list .when { font-size: 0.72rem; color: var(--faint); }
+.note-body img.note-img { display: block; max-width: 100%; height: auto; margin: 0.8rem 0; border: 1px solid var(--rule); border-radius: var(--radius); background: #fff; }
+a[data-note] { color: var(--accent); text-decoration: underline; text-decoration-color: var(--accent-soft); text-underline-offset: 0.18em; cursor: pointer; }
+
 @media (max-width: 64rem) {
 	.composer-hint { display: none; }
 }
@@ -865,6 +933,8 @@ body > p.empty { text-align: center; color: var(--muted); padding: 30vh 1rem 0;
 		box-shadow: var(--shadow);
 	}
 	.side.open { transform: none; }
+	.app.note-open, .app.note-open.side-collapsed { grid-template-columns: minmax(0, 1fr); }
+	.note-pane { position: fixed; z-index: 25; inset: 0; border-left: 0; }
 	.top { padding: 0.5rem 0.75rem; gap: 0.5rem; }
 	.wide-only { display: none !important; }
 	.library .library-text { display: none; }