@xingjisoft/neutrino 0.1.3 → 0.1.4

package/dist/sanitize.js

@@ -0,0 +1,61 @@
+/**
+ * Text hygiene for anything that will be drawn into the terminal Buffer.
+ *
+ * The renderer copies a cell's glyph straight into the output stream, so a cell
+ * that somehow holds a *control* character turns into a command the terminal
+ * executes: an ESC sequence can move the cursor, clear the screen or leave the
+ * alternate buffer, and a TAB shifts the rest of the row. Tool output (ANSI
+ * colours from `ls --color`, `git`, `npm`, progress bars, …), file contents and
+ * pasted text routinely carry such bytes, so they must be neutralised before
+ * they can reach the screen.
+ *
+ * `sanitizeText` is the *display-side* cleanup: it removes whole escape
+ * sequences (not just the ESC byte, which would leave `[31m` behind as literal
+ * text), expands tabs so every character's measured width matches what the
+ * terminal will draw, and drops any remaining control code. Newlines are kept
+ * because the wrapping/markdown layer needs them to lay text out.
+ */
+// Control Sequence Introducer: ESC [ params intermediates final
+const CSI = /\x1b\[[0-?]*[ -/]*[@-~]/g;
+// Operating System Command: ESC ] … (BEL | ST)
+const OSC = /\x1b\][\s\S]*?(?:\x07|\x1b\\)/g;
+// Device Control / Privacy Message / Application Program Command … ST
+const DCS = /\x1b[P^_X][\s\S]*?\x1b\\/g;
+// Two-character Fe/Fs/Fp escapes (ESC 7, ESC =, ESC (B, …)
+const ESC_SIMPLE = /\x1b[ -/]*[@-~]/g;
+// A lone ESC that nothing else matched.
+const ESC_LONE = /\x1b/g;
+/** Remove ANSI/VT escape sequences from `text`. */
+export function stripAnsi(text) {
+    return text
+        .replace(OSC, "")
+        .replace(DCS, "")
+        .replace(CSI, "")
+        .replace(ESC_SIMPLE, "")
+        .replace(ESC_LONE, "");
+}
+// C0 controls (except LF, which the layout engine needs) plus DEL and C1.
+const OTHER_CONTROLS = /[\x00-\x08\x0b\x0c\x0e-\x1f\x7f-\x9f]/g;
+/**
+ * Make `text` safe to render: normalise newlines, drop escape sequences, expand
+ * tabs and remove every other control code. The result contains no character
+ * the terminal would interpret as a command, so it can never corrupt the grid.
+ */
+export function sanitizeText(text, opts = {}) {
+    const tabWidth = opts.tabWidth ?? 4;
+    let s = text.replace(/\r\n?/g, "\n");
+    s = stripAnsi(s);
+    if (tabWidth > 0)
+        s = s.replace(/\t/g, " ".repeat(tabWidth));
+    s = s.replace(OTHER_CONTROLS, "");
+    if (opts.singleLine)
+        s = s.replace(/\s*\n\s*/g, " ");
+    return s;
+}
+/** True if `ch` is a character the terminal would treat as a control code. */
+export function isControlChar(ch) {
+    if (!ch)
+        return false;
+    const cp = ch.codePointAt(0) ?? 0;
+    return cp < 32 || (cp >= 0x7f && cp <= 0x9f);
+}

package/dist/screens/chat.js

@@ -1,12 +1,14 @@
 import { Screen } from "../terminal/screen.js";
 import { C } from "../colors.js";
-import { loadPrompt, saveSession, } from "../config.js";
+import { loadConfig, loadPrompt, saveSession, } from "../config.js";
 import { drawHeader } from "../header.js";
 import { computeInputWindow, cursorFromColumn, drawInputBox, drawScrollbar, wrapText } from "../ui.js";
 import { drawSpans, renderMarkdownText } from "../markdown.js";
 import { ellipsize, displayWidth } from "../width.js";
-import { LLMClient } from "../llm/client.js";
+import { sanitizeText } from "../sanitize.js";
+import { LLMClient, describeError } from "../llm/client.js";
 import { executeTool, getToolDefinitions } from "../llm/tools.js";
+import { COMPACT_KEEP, COMPACT_MAX_CHARS_PER_MESSAGE, planCompaction, transcriptFor, } from "../compact.js";
 const TOOLS = getToolDefinitions();
 function parseArgs(s) {
     if (!s || !s.trim())
@@ -45,6 +47,20 @@ export class ChatScreen extends Screen {
     scrollbarGeom = null;
     lastEscTime = 0;
     initialized = false;
+    // ---- auto context compression ----
+    /** Prompt tokens of the most recent request — the best proxy for how large
+     *  the current context has grown. Reset once the history is compressed. */
+    lastPromptTokens = 0;
+    compressing = false;
+    // ---- collapsible tool output ----
+    /** Message indices whose tool output is expanded (everything starts
+     *  collapsed). */
+    expandedTools = new Set();
+    /** For each line produced by buildLines, the tool message index it belongs
+     *  to, or -1 when it is not part of a tool block. */
+    toolLineIndex = [];
+    /** Terminal row -> tool message index, rebuilt each render for hit-testing. */
+    toolRows = new Map();
     constructor(initialMessage = "") {
         super();
         this.initialMessage = initialMessage;
@@ -79,11 +95,30 @@ export class ChatScreen extends Screen {
             this.app.render();
         }
     }
+    /**
+     * The input row is persistent chrome: it is drawn with absolute positioning
+     * and must survive any terminal-side drift (ConPTY reflow, a stray scroll).
+     * Repainting it every frame makes the input area self-healing — the log can
+     * never end up "covering" it.
+     */
+    alwaysRepaintRows() {
+        const h = this.app.height;
+        const rows = [];
+        for (let y = h - 5; y <= h - 1; y++)
+            if (y >= 0)
+                rows.push(y);
+        return rows;
+    }
     showsCursor() {
         // The chat input is always focused; a cursor is drawn when it holds text.
         return this.inputValue.length > 0;
     }
     onPaste(text) {
+        if (!text)
+            return;
+        // A pasted tab/ESC would otherwise sit in the input box and be re-emitted
+        // by the renderer on every frame, corrupting the rows around it.
+        text = sanitizeText(text, { singleLine: true });
         if (!text)
             return;
         if (this.showInfo)
@@ -186,6 +221,7 @@ export class ChatScreen extends Screen {
         if (key.ctrl && key.name === "l") {
             const sysText = this.messages[0] && this.messages[0].role === "system" ? this.messages[0].content : "";
             this.messages = [{ role: "system", content: sysText }];
+            this.expandedTools.clear();
             this.streamingContent = null;
             this.scrollTop = 0;
             this.followBottom = true;
@@ -235,6 +271,12 @@ export class ChatScreen extends Screen {
                 this.app.render();
                 return;
             }
+            // A click inside the conversation log toggles a tool block open/closed.
+            const tool = this.toolRows.get(ev.y);
+            if (tool !== undefined) {
+                this.toggleTool(tool);
+                return;
+            }
             return;
         }
         if (ev.type === "wheel") {
@@ -307,10 +349,17 @@ export class ChatScreen extends Screen {
         this.paused = false;
         this.app.state.isThinking = true;
         const token = ++this.turnToken;
-        const apiMessages = this.buildApiMessages();
         this.streamingContent = "";
         this.app.render();
-        void this.agentLoop(apiMessages, token);
+        void (async () => {
+            // Shrink the history before building the request when it has outgrown the
+            // configured budget.
+            await this.autoCompress(token);
+            if (token !== this.turnToken)
+                return;
+            const apiMessages = this.buildApiMessages();
+            await this.agentLoop(apiMessages, token);
+        })();
     }
     buildApiMessages() {
         const api = [{ role: "system", content: loadPrompt() }];
@@ -318,6 +367,10 @@ export class ChatScreen extends Screen {
             if (m.role === "user" || m.role === "assistant") {
                 api.push({ role: m.role, content: m.content });
             }
+            else if (m.role === "summary") {
+                // A compressed summary is fed back to the model as its own prior output.
+                api.push({ role: "assistant", content: m.content });
+            }
         }
         return api;
     }
@@ -326,6 +379,9 @@ export class ChatScreen extends Screen {
             while (true) {
                 if (token !== this.turnToken)
                     return;
+                // Keep the payload inside budget during a long single turn: once the
+                // context is too large, drop the body of older tool results.
+                apiMessages = this.trimApiMessages(apiMessages);
                 const client = new LLMClient(this.model, this.modelProvider, this.intensity);
                 let content = "";
                 let hasContent = false;
@@ -343,6 +399,7 @@ export class ChatScreen extends Screen {
                 if (client.usage) {
                     this.tokens.prompt += client.usage.prompt;
                     this.tokens.completion += client.usage.completion;
+                    this.lastPromptTokens = client.usage.prompt;
                 }
                 else {
                     this.tokens.completion += Math.max(1, Math.ceil(content.length / 4));
@@ -399,7 +456,7 @@ export class ChatScreen extends Screen {
             this.onTurnFinished();
         }
         catch (e) {
-            const err = e instanceof Error ? e.message : String(e);
+            const err = describeError(e);
             this.messages.push({ role: "assistant", content: (this.streamingContent ?? "") + `\n[Error: ${err}]` });
             this.streamingContent = null;
             this.onTurnFinished();
@@ -413,8 +470,121 @@ export class ChatScreen extends Screen {
         this.app.render();
         this.maybeFlushQueue();
     }
+    /** Expand/collapse the tool block belonging to message `index`. */
+    toggleTool(index) {
+        if (this.expandedTools.has(index))
+            this.expandedTools.delete(index);
+        else
+            this.expandedTools.add(index);
+        this.app.render();
+    }
+    /** Auto-compress threshold in (estimated) prompt tokens; 0 means "off". */
+    compressThreshold() {
+        const raw = loadConfig().context_compress_threshold;
+        const n = typeof raw === "number" ? raw : Number(raw);
+        return Number.isFinite(n) && n >= 0 ? n : 0;
+    }
+    /**
+     * Once the context has grown past the configured threshold, replace the older
+     * part of the conversation with a model-written summary. Runs at the start of
+     * a turn, before the request is built. If summarising fails the old messages
+     * are simply dropped, so the context always shrinks.
+     */
+    async autoCompress(token) {
+        const threshold = this.compressThreshold();
+        if (threshold <= 0 || this.lastPromptTokens < threshold)
+            return;
+        const system = this.messages.find((m) => m.role === "system");
+        const rest = this.messages.filter((m) => m.role !== "system");
+        const items = rest.map((m) => ({
+            role: m.role,
+            content: m.role === "tool" ? m.result : m.content ?? "",
+            name: m.role === "tool" ? m.name : undefined,
+            ref: m,
+        }));
+        const plan = planCompaction(items, COMPACT_KEEP);
+        if (!plan)
+            return;
+        const transcript = transcriptFor(plan.head, COMPACT_MAX_CHARS_PER_MESSAGE);
+        this.compressing = true;
+        this.app.render();
+        const snapshotLen = this.messages.length;
+        let summary = "";
+        try {
+            summary = await this.summarizeTranscript(transcript);
+        }
+        catch {
+            summary = "";
+        }
+        this.compressing = false;
+        if (token !== this.turnToken)
+            return;
+        // A new message (queued by the user while we were summarising) would be
+        // dropped by the swap below, so bail out and retry on the next turn.
+        if (this.messages.length !== snapshotLen) {
+            this.app.render();
+            return;
+        }
+        const count = plan.head.length;
+        const content = summary
+            ? `[Context compressed]\n${summary}`
+            : `[Context compressed]\n(${count} earlier messages were omitted to free up context.)`;
+        const summaryMsg = { role: "summary", content, count };
+        const kept = plan.tail.map((i) => i.ref);
+        this.messages = system ? [system, summaryMsg, ...kept] : [summaryMsg, ...kept];
+        // Message indices shifted, so any expanded tool block no longer lines up.
+        this.expandedTools.clear();
+        // The context is small again; its real size is re-learned from the next reply.
+        this.lastPromptTokens = 0;
+        this.save();
+    }
+    /**
+     * Summarise a transcript produced by `transcriptFor`. Split out so tests can
+     * stub it without touching the network.
+     */
+    async summarizeTranscript(transcript) {
+        const client = new LLMClient(this.model, this.modelProvider, this.intensity);
+        const text = await client.summarize(transcript);
+        if (client.usage) {
+            this.tokens.prompt += client.usage.prompt;
+            this.tokens.completion += client.usage.completion;
+        }
+        return text;
+    }
+    /**
+     * Keep the outbound payload within budget during a long single turn: once the
+     * context is over the threshold, blank out all but the most recent tool
+     * results. Their full text stays in the visible log, which is collapsible.
+     */
+    trimApiMessages(apiMessages) {
+        const threshold = this.compressThreshold();
+        if (threshold <= 0 || this.lastPromptTokens < threshold)
+            return apiMessages;
+        const toolIdx = [];
+        for (let i = 0; i < apiMessages.length; i++) {
+            if (apiMessages[i].role === "tool")
+                toolIdx.push(i);
+        }
+        const dropCount = toolIdx.length - COMPACT_KEEP;
+        if (dropCount <= 0)
+            return apiMessages;
+        const copy = apiMessages.slice();
+        for (let k = 0; k < dropCount; k++) {
+            copy[toolIdx[k]] = { ...copy[toolIdx[k]], content: "[tool output omitted to save context]" };
+        }
+        return copy;
+    }
     save() {
-        const chatMessages = this.messages.filter((m) => m.role === "user" || m.role === "assistant" || m.role === "tool");
+        const chatMessages = [];
+        for (const m of this.messages) {
+            if (m.role === "user" || m.role === "assistant" || m.role === "tool") {
+                chatMessages.push(m);
+            }
+            else if (m.role === "summary") {
+                // Persist a compressed summary as a plain assistant message.
+                chatMessages.push({ role: "assistant", content: m.content });
+            }
+        }
         if (chatMessages.length === 0)
             return;
         try {
@@ -426,38 +596,75 @@ export class ChatScreen extends Screen {
     }
     buildLines(width) {
         const lines = [];
-        const pushText = (text, style) => {
-            for (const ln of wrapText(text, width)) {
-                lines.push({ spans: [{ text: ln, style }] });
-            }
+        // Parallel map from rendered line -> owning tool message index (-1 = none),
+        // used to turn a click on any line of a tool block into an expand/collapse.
+        const toolLineIndex = [];
+        const add = (line, tool = -1) => {
+            lines.push(line);
+            toolLineIndex.push(tool);
         };
-        for (const m of this.messages) {
+        const pushText = (text, style, tool = -1) => {
+            for (const ln of wrapText(text, width))
+                add({ spans: [{ text: ln, style }] }, tool);
+        };
+        const pushMarkdown = (text, style) => {
+            for (const ln of renderMarkdownText(text, width, style))
+                add(ln);
+        };
+        for (let mi = 0; mi < this.messages.length; mi++) {
+            const m = this.messages[mi];
             if (m.role === "system") {
-                pushText(m.content, { fg: C.dim });
+                pushText(sanitizeText(m.content), { fg: C.dim });
             }
             else if (m.role === "user") {
-                lines.push({ spans: [{ text: "You:", style: { fg: C.accent, bold: true } }] });
-                lines.push(...renderMarkdownText(m.content, width, { fg: C.user }));
-                lines.push({ spans: [] });
+                add({ spans: [{ text: "You:", style: { fg: C.accent, bold: true } }] });
+                pushMarkdown(sanitizeText(m.content), { fg: C.user });
+                add({ spans: [] });
             }
             else if (m.role === "assistant") {
-                lines.push({ spans: [{ text: "Neutrino:", style: { fg: C.accent, bold: true } }] });
-                lines.push(...renderMarkdownText(m.content, width, { fg: C.assistant }));
-                lines.push({ spans: [] });
+                add({ spans: [{ text: "Neutrino:", style: { fg: C.accent, bold: true } }] });
+                pushMarkdown(sanitizeText(m.content), { fg: C.assistant });
+                add({ spans: [] });
+            }
+            else if (m.role === "summary") {
+                add({
+                    spans: [
+                        {
+                            text: `✂ Context compressed (${m.count} earlier messages)`,
+                            style: { fg: C.amber, bold: true },
+                        },
+                    ],
+                });
+                pushText(sanitizeText(m.content), { fg: C.dim });
+                add({ spans: [] });
             }
             else if (m.role === "tool") {
-                lines.push({ spans: [{ text: `⚙ ${m.name}`, style: { fg: C.toolHeader, bold: true } }] });
-                const argText = m.arguments.command ?? m.arguments.path ?? "";
+                // Header + the command/path always show; the (often huge) output body is
+                // collapsed by default and toggled by clicking the block.
+                add({ spans: [{ text: `⚙ ${m.name}`, style: { fg: C.toolHeader, bold: true } }] }, mi);
+                const argText = sanitizeText(m.arguments.command ?? m.arguments.path ?? "", { singleLine: true });
                 if (argText)
-                    lines.push({ spans: [{ text: "  " + argText, style: { fg: C.dim } }] });
-                pushText(m.result || "(no output)", { fg: C.dim });
-                lines.push({ spans: [] });
+                    add({ spans: [{ text: "  " + argText, style: { fg: C.dim } }] }, mi);
+                // Command output routinely carries ANSI colours and tabs; clean it once
+                // so the collapsed line count and the expanded body agree.
+                const body = sanitizeText(m.result || "");
+                if (this.expandedTools.has(mi)) {
+                    pushText(body || "(no output)", { fg: C.dim }, mi);
+                    add({ spans: [{ text: "  ▾ click to collapse", style: { fg: C.toolHeader } }] }, mi);
+                }
+                else {
+                    const n = body ? body.split("\n").length : 0;
+                    const summary = n > 0 ? `${n} line${n === 1 ? "" : "s"} hidden` : "no output";
+                    add({ spans: [{ text: `  ▸ ${summary} — click to expand`, style: { fg: C.dim } }] }, mi);
+                }
+                add({ spans: [] });
             }
         }
         if (this.streamingContent !== null) {
-            lines.push({ spans: [{ text: "Neutrino:", style: { fg: C.accent, bold: true } }] });
-            lines.push(...renderMarkdownText(this.streamingContent, width, { fg: C.assistant }));
+            add({ spans: [{ text: "Neutrino:", style: { fg: C.accent, bold: true } }] });
+            pushMarkdown(sanitizeText(this.streamingContent), { fg: C.assistant });
         }
+        this.toolLineIndex = toolLineIndex;
         return lines;
     }
     render(buf) {
@@ -466,7 +673,11 @@ export class ChatScreen extends Screen {
         const h = buf.height;
         let status = "";
         let statusStyle = { fg: C.dim };
-        if (this.queued) {
+        if (this.compressing) {
+            status = "Compressing context…";
+            statusStyle = { fg: C.amber, bold: true };
+        }
+        else if (this.queued) {
             status = "Will send when paused or idle...";
             statusStyle = { fg: C.amber };
         }
@@ -500,10 +711,16 @@ export class ChatScreen extends Screen {
             lines.length > viewH
                 ? { x: w - 1, top: logTop, bottom: logBottom, total: lines.length, viewport: viewH }
                 : null;
+        // Remember which tool block (if any) each visible row belongs to, so a
+        // click can expand/collapse it (see the onMouse handler).
+        this.toolRows.clear();
         for (let y = logTop; y <= logBottom; y++) {
             const li = this.scrollTop + (y - logTop);
             if (li >= lines.length)
                 break;
+            const tool = this.toolLineIndex[li];
+            if (tool !== undefined && tool >= 0)
+                this.toolRows.set(y, tool);
             drawSpans(buf, 2, y, lines[li].spans, Math.max(4, w - 4));
         }
         // A scrollbar on the right edge of the log, shown only when the

package/dist/screens/settings.js

@@ -1,10 +1,14 @@
 import { Screen } from "../terminal/screen.js";
 import { C } from "../colors.js";
-import { INTENSITY_LEVELS, MODEL_FILE, loadConfig, saveConfig } from "../config.js";
+import { COMPRESS_THRESHOLD_OPTIONS, CONFIG_FILE, INTENSITY_LEVELS, loadConfig, saveConfig, } from "../config.js";
 import { drawHeader } from "../header.js";
 import { centerVertically, drawHint } from "../ui.js";
+/** The settings that can be changed here, top to bottom. */
+const ROWS = ["intensity", "compress"];
 export class SettingsScreen extends Screen {
     intensityIdx = 2;
+    thresholdIdx = 3;
+    rowIdx = 0;
     lastHoverX = -1;
     lastHoverY = -1;
     onActivate() {
@@ -12,18 +16,42 @@ export class SettingsScreen extends Screen {
         const current = String(config.default_intensity ?? "High");
         const i = INTENSITY_LEVELS.indexOf(current);
         this.intensityIdx = i >= 0 ? i : 2;
+        const threshold = Number(config.context_compress_threshold ?? 32000);
+        const t = COMPRESS_THRESHOLD_OPTIONS.findIndex((o) => o.value === threshold);
+        this.thresholdIdx = t >= 0 ? t : 3;
+    }
+    /** Change the value of a row by `delta` steps and persist it immediately. */
+    cycle(row, delta) {
+        if (row === "intensity") {
+            const n = INTENSITY_LEVELS.length;
+            this.intensityIdx = (this.intensityIdx + delta + n) % n;
+        }
+        else {
+            const n = COMPRESS_THRESHOLD_OPTIONS.length;
+            this.thresholdIdx = (this.thresholdIdx + delta + n) % n;
+        }
+        this.save();
     }
     onKey(key) {
         if (key.name === "up") {
-            this.intensityIdx = (this.intensityIdx + INTENSITY_LEVELS.length - 1) % INTENSITY_LEVELS.length;
+            this.rowIdx = (this.rowIdx + ROWS.length - 1) % ROWS.length;
             this.app.render();
         }
         else if (key.name === "down") {
-            this.intensityIdx = (this.intensityIdx + 1) % INTENSITY_LEVELS.length;
+            this.rowIdx = (this.rowIdx + 1) % ROWS.length;
+            this.app.render();
+        }
+        else if (key.name === "left") {
+            this.cycle(ROWS[this.rowIdx], -1);
+            this.app.render();
+        }
+        else if (key.name === "right") {
+            this.cycle(ROWS[this.rowIdx], 1);
             this.app.render();
         }
         else if (key.name === "enter" || key.name === "return") {
             this.save();
+            this.app.render();
         }
         else if (key.name === "escape") {
             this.save();
@@ -39,9 +67,9 @@ export class SettingsScreen extends Screen {
                 return;
             this.lastHoverX = ev.x;
             this.lastHoverY = ev.y;
-            for (let i = 0; i < layout.optionYs.length; i++) {
-                if (ev.y === layout.optionYs[i] && i !== this.intensityIdx) {
-                    this.intensityIdx = i;
+            for (let i = 0; i < layout.rowYs.length; i++) {
+                if (ev.y === layout.rowYs[i] && i !== this.rowIdx) {
+                    this.rowIdx = i;
                     this.app.render();
                     return;
                 }
@@ -49,8 +77,7 @@ export class SettingsScreen extends Screen {
             return;
         }
         if (ev.type === "wheel") {
-            this.intensityIdx =
-                (this.intensityIdx + (ev.dir === -1 ? -1 : 1) + INTENSITY_LEVELS.length) % INTENSITY_LEVELS.length;
+            this.cycle(ROWS[this.rowIdx], ev.dir === -1 ? -1 : 1);
             this.app.render();
             return;
         }
@@ -60,10 +87,15 @@ export class SettingsScreen extends Screen {
                 this.app.popScreen();
                 return;
             }
-            for (let i = 0; i < layout.optionYs.length; i++) {
-                if (ev.y === layout.optionYs[i]) {
-                    this.intensityIdx = i;
-                    this.save();
+            for (let i = 0; i < layout.rowYs.length; i++) {
+                if (ev.y === layout.rowYs[i]) {
+                    if (this.rowIdx === i) {
+                        // Clicking the already-selected row advances its value.
+                        this.cycle(ROWS[i], 1);
+                    }
+                    else {
+                        this.rowIdx = i;
+                    }
                     this.app.render();
                     return;
                 }
@@ -74,59 +106,66 @@ export class SettingsScreen extends Screen {
             }
         }
     }
+    rowTexts() {
+        return [
+            { label: "Default intensity", value: INTENSITY_LEVELS[this.intensityIdx] },
+            { label: "Auto-compress context", value: COMPRESS_THRESHOLD_OPTIONS[this.thresholdIdx].label },
+        ];
+    }
     layout() {
         const h = this.app.height;
-        const lines = [
-            "Settings",
-            "",
-            `Model: ${this.app.state.selectedProvider}/${this.app.state.selectedModelName}`,
-            `Default intensity:`,
-        ];
-        const total = lines.length + INTENSITY_LEVELS.length + 2;
+        const rows = this.rowTexts();
+        const labelW = Math.max(...rows.map((r) => r.label.length));
+        // title, blank, model, blank, option rows, blank, hint
+        const total = 6 + rows.length;
         const top = centerVertically(h, total);
-        const optionYs = INTENSITY_LEVELS.map((_, i) => top + 4 + i);
-        const hintY = top + 4 + INTENSITY_LEVELS.length + 2;
+        const rowYs = rows.map((_, i) => top + 4 + i);
+        const hintY = top + 5 + rows.length;
         if (hintY > h - 1)
             return null;
-        return { optionYs, hintY };
+        return { rowYs, hintY, labelW };
     }
     save() {
         const config = loadConfig();
         config.default_intensity = INTENSITY_LEVELS[this.intensityIdx];
+        config.context_compress_threshold = COMPRESS_THRESHOLD_OPTIONS[this.thresholdIdx].value;
         saveConfig(config);
     }
     render(buf) {
         drawHeader(buf, this.app.state);
         const h = buf.height;
-        const lines = [
-            "Settings",
-            "",
-            `Model: ${this.app.state.selectedProvider}/${this.app.state.selectedModelName}`,
-            `Default intensity:`,
-        ];
-        const content = INTENSITY_LEVELS.map((l, i) => ({
-            text: l,
-            selected: i === this.intensityIdx,
-        }));
-        const total = lines.length + content.length + 2;
+        const rows = this.rowTexts();
+        const labelW = Math.max(...rows.map((r) => r.label.length));
+        const total = 6 + rows.length;
         const top = centerVertically(h, total);
         let y = top;
-        buf.centerText(y, lines[0], { fg: C.accent, bold: true });
+        buf.centerText(y, "Settings", { fg: C.accent, bold: true });
         y += 2;
-        buf.centerText(y, lines[2], { fg: C.assistant });
-        y += 1;
-        buf.centerText(y, lines[3], { fg: C.dim });
-        y += 1;
-        for (const c of content) {
-            const text = (c.selected ? "▸ " : "  ") + c.text;
-            buf.centerText(y, text, c.selected ? { fg: C.accent, bg: C.highlightBg } : { fg: C.assistant });
+        buf.centerText(y, `Model: ${this.app.state.selectedProvider}/${this.app.state.selectedModelName}`, {
+            fg: C.assistant,
+        });
+        y += 2;
+        for (let i = 0; i < rows.length; i++) {
+            const selected = i === this.rowIdx;
+            const marker = selected ? "▸ " : "  ";
+            const label = rows[i].label.padEnd(labelW);
+            const value = selected ? `◂ ${rows[i].value} ▸` : rows[i].value;
+            const text = marker + label + "   " + value;
+            if (selected) {
+                buf.centerText(y, " " + text + " ", { fg: C.accent, bg: C.highlightBg, bold: true });
+            }
+            else {
+                buf.centerText(y, text, { fg: C.assistant });
+            }
             y += 1;
         }
         y += 1;
-        buf.centerText(y, `model.json: ${MODEL_FILE}`, { fg: C.dim });
-        y += 1;
         if (y < h) {
-            drawHint(buf, y, "↑/↓ change  ·  Enter apply  ·  click to choose  ·  right-click back  ·  Esc back");
+            buf.centerText(y, `config: ${CONFIG_FILE}`, { fg: C.dim });
+            y += 1;
+        }
+        if (y < h) {
+            drawHint(buf, y, "↑/↓ select  ·  ←/→ change  ·  Enter apply  ·  right-click back  ·  Esc back");
         }
     }
 }