nou-cli 0.5.1 → 0.5.3

package/dist/src/ui/App.js

@@ -3,65 +3,84 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { readFileSync, writeFileSync } from "fs";
 import path from "path";
 import { Box, Text, useApp, useInput, useWindowSize } from "ink";
-import { buildSystemPrompt } from "../agent/index.js";
+import { nouRulesOnly } from "../context/index.js";
+import { MCP_PRESETS, McpManager, loadMcpServers, removeUserServer, saveUserServers, USER_MCP_FILE } from "../mcp/index.js";
+import { findOtherMcpServers } from "../mcp/import.js";
+import { ago, listConversations, loadConversation, saveConversation } from "../conversations/index.js";
+import { externalEntries, externalSessions } from "../conversations/external.js";
+import { buildSystemPrompt, newSessionId } from "../agent/index.js";
 import { ENGINES, createEngine, engineInfo, installEngine, isEngineId, isInstalled } from "../engines/index.js";
 import { harness, problemsIntroduced } from "../agent/harness.js";
-import { describe, providers, resolveModel, saveModel } from "../providers/index.js";
+import { describe, providers, resolveModel, saveModel, setupProblem } from "../providers/index.js";
 import { sameModel } from "../providers/ollama.js";
-import { loadSettings, saveSettings } from "../config/index.js";
+import { FOLLOW_SPEEDS, isTrustedFolder, loadSettings, saveSettings } from "../config/index.js";
 import { branch as gitBranch, diffAgainstHead, isRepo, sameStatus, status as gitStatus, statusAsync as gitStatusAsync } from "../git/index.js";
 import { BUILTIN_PLUGINS, addStarter, discoverPlugins, isEnabled, loadPlugin, scaffoldPlugin, starterPlugins, trustPatch, trustState } from "../plugins/index.js";
 import { DiagnosticsManager, formatDiagnostic, newProblems } from "../diagnostics/index.js";
 import { Timeline } from "../history/index.js";
 import { lsp } from "../lsp/index.js";
 import { onGrammarLoaded, preload } from "../syntax/index.js";
+import { setCodeTheme } from "../syntax/themes.js";
 import { checkForUpdate, currentVersion } from "../update/index.js";
-import { changedLines, lineCounts } from "./text.js";
+import { changedLines, lineCounts, loadFallbackHighlighter } from "./text.js";
+import { findDefinition, wordAt } from "./definition.js";
 import { ProblemsView } from "./ProblemsView.js";
 import { useMouse } from "./mouse.js";
 import { C } from "./theme.js";
 import { FileTree } from "./FileTree.js";
 import { CodeView } from "./CodeView.js";
 import { Editor } from "./Editor.js";
+import { SLASH_COMMANDS } from "./commands.js";
 import { WHEEL_STEP } from "./scroll.js";
 import { Chat } from "./Chat.js";
 import { copyToClipboard } from "./clipboard.js";
 import { Header } from "./Header.js";
-import { QuickOpen, listAllFiles } from "./QuickOpen.js";
+import { Tabs, layoutTabs } from "./Tabs.js";
+import { GAME_PANEL, GamePanel } from "./GamePanel.js";
+import { Terminal } from "./Terminal.js";
+import { Shell } from "../terminal/index.js";
+import { QuickOpen, listAllFiles, score } from "./QuickOpen.js";
 import { Settings } from "./Settings.js";
 const FOCUS_ORDER = ["tree", "code", "chat"];
 const MIN_TREE = 14;
 const MIN_CODE = 20;
 const MIN_CHAT = 24;
 const NO_LINES = new Set();
+const NO_FILES = new Set();
 const DOUBLE_CLICK_MS = 500;
-const HELP = `Commands:
-  /settings            models, preferences and plugins
-  /model               show providers and the current model
-  /model <provider[:model]>  switch, e.g. /model anthropic  /model ollama:qwen3:8b
-  /models [provider]   list models a provider offers
-  /connect <provider>  enter an API key (and URL), e.g. /connect fireworks  /connect litellm
-  /pull <model>        download an Ollama model
-  /engine [name]       which agent answers: nou, claude-code, codex or pi
-  /auto [ask|auto-edit|auto]  how much Nou does without asking (also: Shift+Tab)
-  /copy [code|file]    copy the last reply, its last code block, or the open file
-  /plugins             your plugins and the starter ones you can add
-  /plugins add <name>  add a starter plugin (copied to ~/.nou/plugins to edit)
-  /plugins new <name>  start your own plugin in .nou/plugins/
-  /clear               start a fresh conversation
-  /compact             summarize the conversation so far, to free up context
-  /undo                undo Nou's last change (also: u)
-  /rewind              undo everything from Nou's last turn
-  /history             recent changes
-  /diff [file]         everything changed this session ([ ] step through files)
-  /sessions            earlier sessions; /diff <n> shows one of them
-  /version             which version of Nou this is
+/** How long each follow step stays on screen before the next. */
+const FOLLOW_STEP_MS = { slow: 2500, normal: 1200, fast: 450, instant: 0 };
+/** Steps follow mode may fall behind before it skips ahead. */
+const MAX_FOLLOW_LAG = 12;
+/** Columns the tabs get in the code view's title, leaving room for the scroll position and badges. */
+const tabsWidth = (codeWidth) => Math.max(16, codeWidth - 3);
+/** How much of the conversation a newly switched-to engine is given (the latest part when it's longer). */
+const HANDOFF_CHARS = 24_000;
+/** The conversation so far as text, for an engine taking over from another one; null when there's none. */
+export function conversationSoFar(entries) {
+    const said = entries
+        .filter((e) => e.kind === "user" || e.kind === "assistant" || e.kind === "tool")
+        .map((e) => (e.kind === "user" ? `User: ${e.text}` : e.kind === "assistant" ? `Assistant: ${e.text}` : `(${e.text})`));
+    if (!said.some((line) => line.startsWith("User:")))
+        return null;
+    let text = said.join("\n\n");
+    if (text.length > HANDOFF_CHARS)
+        text = `[earlier messages left out]\n${text.slice(-HANDOFF_CHARS)}`;
+    return `You are taking over a conversation the user was having with another assistant in this project. Here it is, so you can carry on from where it left off (the files may have changed since; check before relying on them):\n<conversation>\n${text}\n</conversation>`;
+}
+/** /help: every command from the shared list, then the keys. */
+const HELP = `Commands (type / in the chat for a menu, or press ? for every action):
+${SLASH_COMMANDS.map((c) => `  /${`${c.name}${c.args ? ` ${c.args}` : ""}`.padEnd(30)} ${c.description}`).join("\n")}
 Keys:
-  Ctrl+P  find a file      Tab  switch pane      Esc  stop / back
+  ?  every action, searchable (also Ctrl+P then >)   Ctrl+P  find a file
+  Tab  switch pane      Esc  stop / back
   Shift+Tab  ask / auto-edit / auto                < > resize pane  = reset
   m  mouse on/off (off: select text to copy; Shift+drag also works in most terminals)
   /  start a command from any pane
   e  edit open file (or double-click in the code)  v  diff (git / Nou / session)  f  follow mode
+  Ctrl+F  find in the open file (Enter/↓ next, ↑ previous)
+  b  back to the previous file (Ctrl+P lists recent files first)   [ ]  previous/next tab · x close tab
+  Ctrl+click, Option+click or right-click a name: go to its definition (an import's path opens the file)
   p  problems              u    undo Nou's edit   s   settings
   c  (in files) show only changed files            Ctrl+C twice  quit
 Mouse: wheel scrolls (Shift+wheel sideways) · click/drag a scrollbar · double-click in the code to edit there (in the editor: select a word), drag to select
@@ -84,16 +103,45 @@ function readText(filePath) {
         return "";
     }
 }
-export function App({ initialModel, permContext }) {
+export function App({ initialModel, permContext, resume }) {
     const { exit } = useApp();
     const { columns, rows } = useWindowSize();
     const [settings, setSettings] = useState(loadSettings);
+    setCodeTheme(settings.codeTheme); // before anything below highlights code
     const [view, setView] = useState("main");
     const [connectTo, setConnectTo] = useState();
-    const [quickOpen, setQuickOpen] = useState(false);
+    /** Why settings were opened for you (a request failed on the provider's setup). */
+    const [setupReason, setSetupReason] = useState(null);
+    /** The file finder / command palette: closed (null), or open with this query (">" for commands). */
+    const [quickOpen, setQuickOpen] = useState(null);
     const [focus, setFocus] = useState("chat");
+    /** The Games panel: whether it's open, the pane it's being dragged over, and the pane to go back to. */
+    const [gamesOpen, setGamesOpen] = useState(false);
+    const [gameDrag, setGameDrag] = useState(null);
+    const beforeGame = useRef("chat");
+    /** It docks under a pane, splitting that pane's column: under the one it's dragged over while moving. */
+    const gameDock = gameDrag ?? settings.gameDock ?? "chat";
+    /** The terminal panel under the code (` or /terminal): its shell lives on while the panel is closed. */
+    const [termOpen, setTermOpen] = useState(false);
+    const [termVersion, setTermVersion] = useState(0);
+    const shellRef = useRef(null);
+    const beforeTerm = useRef("code");
     const [follow, setFollow] = useState(settings.followMode);
+    // Follow mode replays what the agent reads a step at a time (it reads far faster than you can watch):
+    // the steps waiting, and the timer that shows the next one.
+    const followQueue = useRef([]);
+    const followTimer = useRef(null);
+    const [followLag, setFollowLag] = useState(0);
+    const clearFollow = () => {
+        followQueue.current = [];
+        if (followTimer.current)
+            clearTimeout(followTimer.current);
+        followTimer.current = null;
+        setFollowLag(0);
+    };
     const [entries, setEntries] = useState([]);
+    /** This conversation, as saved for /resume: a new one after /clear, an old one once resumed. */
+    const [conversationId, setConversationId] = useState(newSessionId);
     const [streaming, setStreaming] = useState("");
     // Streamed text arrives a token at a time; redrawing the whole screen for each one is wasted work.
     const streamed = useRef({ text: "", timer: null });
@@ -114,11 +162,17 @@ export function App({ initialModel, permContext }) {
         }
     };
     const [busy, setBusy] = useState(null);
+    /** Files Nou has changed (or is asking to) since it started working: they shimmer in the tree until it's done. */
+    const [working, setWorking] = useState(NO_FILES);
     const [choice, setChoice] = useState(initialModel);
     const [approval, setApproval] = useState(null);
     const [openFile, setOpenFile] = useState(null);
     const [content, setContent] = useState("");
     const [reveal, setReveal] = useState(null);
+    /** The open files, as tabs over the code view, in the order they were opened. */
+    const [tabs, setTabs] = useState([]);
+    /** Files opened this session, latest first: Ctrl+P lists them first, and b goes back to the previous one. */
+    const [recent, setRecent] = useState([]);
     const [treeVersion, setTreeVersion] = useState(0);
     // The last change Nou made per file, so we can flag edited lines and re-open the diff.
     const [changes, setChanges] = useState(new Map());
@@ -150,17 +204,44 @@ export function App({ initialModel, permContext }) {
     const [editorMouse, setEditorMouse] = useState([]);
     /** Wheel events waiting for the next frame, added up per pane. */
     const pendingWheel = useRef({ pane: "chat", lines: 0, columns: 0, timer: null });
+    /** The chat's command menu is open (Tab completes there instead of switching panes). */
+    const chatMenuOpen = useRef(false);
+    const [chatMenu, setChatMenu] = useState(false);
     const [chatPrefill, setChatPrefill] = useState(null);
     const [treeClick, setTreeClick] = useState(null);
+    /** Whether the code view's find bar is open (it takes the keyboard). */
+    const codeFinding = useRef(false);
+    const onCodeFinding = useCallback((open) => {
+        codeFinding.current = open;
+    }, []);
+    /** Bumped to open the code view's find bar from outside it (the palette, the status bar). */
+    const [findRequest, setFindRequest] = useState(0);
+    const startFind = () => {
+        if (!openFile)
+            return info("Open a file first (Ctrl+P), then Ctrl+F searches it.");
+        setDiffMode("off");
+        setEditing(false);
+        setCodePanel("code");
+        setFocus("code");
+        setFindRequest((n) => n + 1);
+    };
+    const [codeDefine, setCodeDefine] = useState(null);
+    const [chatClick, setChatClick] = useState(null);
+    /** Dragging over the chat's messages selects them (copied when you let go). */
+    const [chatSelect, setChatSelect] = useState(null);
     // Pane geometry from the last render, so mouse events can be mapped to the pane under the pointer.
-    const layout = useRef({ treeWidth: 0, codeWidth: 0, paneHeight: 0 });
+    const layout = useRef({ treeWidth: 0, codeWidth: 0, paneHeight: 0, heights: { tree: 0, code: 0, chat: 0 }, game: null, terminal: null });
     /** Pane widths while a border is dragged (saved on release); the saved ones otherwise. */
     const [paneWidths, setPaneWidths] = useState(settings.paneWidths);
     const paneWidthsRef = useRef(paneWidths);
     paneWidthsRef.current = paneWidths;
     /** What a mouse drag is moving: a pane border, a pane's scrollbar, or the editor's selection. */
+    /** Where the status bar's parts and the header's model badge are, from the last render. */
+    const clickable = useRef({ status: [], modelFrom: Infinity });
     const lastClick = useRef(null);
     const dragging = useRef(null);
+    /** Which border is being dragged, for the status bar. */
+    const [resizing, setResizing] = useState(null);
     const pullAbort = useRef(null);
     const diagnosticsRef = useRef(null);
     diagnosticsRef.current ??= new DiagnosticsManager();
@@ -175,11 +256,12 @@ export function App({ initialModel, permContext }) {
     const settingsRef = useRef(settings);
     settingsRef.current = settings;
     const refreshGit = useCallback(() => setGit(gitStatus()), []);
-    const allFiles = useMemo(() => (quickOpen ? listAllFiles() : []), [quickOpen]);
+    const allFiles = useMemo(() => (quickOpen !== null ? listAllFiles() : []), [quickOpen !== null]);
     const repo = useMemo(() => isRepo(), []);
     const branch = useMemo(() => (repo ? gitBranch() : null), [repo, git]);
     const open = useCallback((filePath) => {
         setOpenFile(filePath);
+        setRecent((r) => [filePath, ...r.filter((f) => f !== filePath)].slice(0, 30));
         setContent(readText(filePath));
         setDiffMode("off");
         setEditing(false);
@@ -193,23 +275,32 @@ export function App({ initialModel, permContext }) {
     const engineConfig = useRef({});
     if (!hooksRef.current) {
         hooksRef.current = {
-            onEntry: (entry) => setEntries((prev) => [...prev, entry]),
+            onEntry: (entry) => {
+                setEntries((prev) => [...prev, entry]);
+                if (entry.kind === "error")
+                    setupCheckRef.current(entry.text);
+            },
             onStream: showStream,
             onBusy: setBusy,
-            onRead: (filePath) => {
-                if (!followRef.current)
-                    return;
-                open(filePath);
-                setReveal(filePath);
+            onOpen: (filePath, line, to) => {
+                clearFollow(); // what was asked for wins over reads still waiting to be shown
+                openAtRef.current(filePath, line ?? 1, false, to);
             },
+            onRead: (filePath, line, to) => followStepRef.current({ file: filePath, ...(line ? { line } : {}), ...(to ? { to } : {}) }),
             onChange: (change, status, turn) => {
                 if (status === "applied") {
                     timelineRef.current.record({ path: change.path, before: change.isNew ? null : change.before, after: change.after, source: "nou", turn });
                 }
                 const lines = status === "applied" ? changedLines(change.before, change.after) : NO_LINES;
                 setChanges((prev) => new Map(prev).set(change.path, { change, status, lines }));
+                setWorking((w) => {
+                    if (status === "rejected")
+                        return w.has(change.path) ? new Set([...w].filter((p) => p !== change.path)) : w;
+                    return w.has(change.path) ? w : new Set(w).add(change.path);
+                });
                 // Diffs awaiting approval are shown unless you're in the middle of editing a file (the chat says what's waiting).
                 if ((status === "pending" && !draftActiveRef.current) || followRef.current) {
+                    clearFollow(); // an edit is shown as it happens, ahead of reads still waiting
                     setOpenFile(change.path);
                     setContent(status === "applied" ? change.after : readText(change.path));
                     setDiffMode("off");
@@ -239,9 +330,29 @@ export function App({ initialModel, permContext }) {
     }
     useEffect(() => diagnostics.subscribe(() => setDiagVersion((v) => v + 1)), []);
     useEffect(() => onGrammarLoaded(() => setSyntaxVersion((v) => v + 1)), []);
+    useEffect(() => setSyntaxVersion((v) => v + 1), [settings.codeTheme]); // re-color the code
+    useEffect(() => void loadFallbackHighlighter(), []); // once Nou is on screen (it's slow to load)
     useEffect(() => {
         void checkForUpdate().then(setUpdate);
     }, []);
+    useEffect(() => {
+        if (!busy)
+            setWorking(NO_FILES); // done: the files stop shimmering (● still marks them)
+    }, [!busy]);
+    // After each reply, the conversation is saved so /resume can pick it back up.
+    useEffect(() => {
+        const first = entries.find((e) => e.kind === "user");
+        if (busy || !first)
+            return;
+        const engine = agentRef.current;
+        saveConversation({ id: conversationId, title: first.text.replace(/\s+/g, " ").slice(0, 80), updated: Date.now(), engine: engine.id, entries, state: engine.snapshot?.() });
+    }, [!busy, entries.length, conversationId]);
+    /** Earlier conversations for the palette, read from disk when it opens. */
+    const recentChats = useMemo(() => (quickOpen !== null ? resumable() : []), [quickOpen !== null]);
+    useEffect(() => {
+        if (resume)
+            void resumeConversation(resume === "last" ? "last" : "");
+    }, []);
     // Discover plugins once and load the enabled ones.
     useEffect(() => {
         void (async () => {
@@ -254,6 +365,7 @@ export function App({ initialModel, permContext }) {
     // Starter plugins are listed until you add them (or have your own plugin with the same name).
     const allPlugins = useMemo(() => [...BUILTIN_PLUGINS, ...plugins, ...starters.filter((s) => !plugins.some((p) => p.id === s.id))], [plugins, starters]);
     const activePlugins = useMemo(() => allPlugins.filter((p) => isEnabled(p, settings) && p.plugin), [allPlugins, settings.plugins, settings.trustedPlugins]);
+    const pluginCommands = useMemo(() => activePlugins.flatMap((p) => (p.plugin.commands ?? []).map((c) => ({ name: c.name, args: "[args]", description: `${c.description} (${p.plugin.name})` }))), [activePlugins]);
     // Checkers come from enabled plugins (built-in ones included).
     const firstCheck = useRef(true);
     useEffect(() => {
@@ -263,12 +375,32 @@ export function App({ initialModel, permContext }) {
             setTimeout(() => void diagnostics.checkProject(), 1500);
         }
     }, [activePlugins]);
-    // Keep the agent's system prompt and tools in sync with settings and plugins.
+    // MCP servers (yours, and in a trusted folder the project's): connected in the background; their tools
+    // join the engine's as they come up.
+    const mcpRef = useRef(null);
+    const [mcpVersion, setMcpVersion] = useState(0);
+    mcpRef.current ??= new McpManager(() => setMcpVersion((v) => v + 1));
+    const connectMcp = () => mcpRef.current.connect(loadMcpServers(isTrustedFolder()));
+    useEffect(() => {
+        void connectMcp().then(() => {
+            // Servers you use in other tools, offered once there's nothing set up here yet.
+            if (loadMcpServers(false).length)
+                return;
+            const found = findOtherMcpServers();
+            if (found.length) {
+                const from = [...new Set(found.map((f) => f.from.replace(/ \(this project\)$/, "")))].join(", ");
+                info(`Found ${found.length} MCP server${found.length > 1 ? "s" : ""} you use in ${from} (${found.map((f) => f.name).join(", ")}). Type /mcp import to use them here too.`);
+            }
+        });
+        return () => mcpRef.current?.close();
+    }, []);
+    // Keep the agent's system prompt and tools in sync with settings, plugins and MCP servers.
     useEffect(() => {
         const { extras, extraTools } = harness({ diagnostics, plugins: activePlugins.map((p) => p.plugin), git: settings.gitContext && repo });
-        engineConfig.current = { system: buildSystemPrompt(permContext, extras), extras: [...extras, permContext].filter(Boolean), extraTools, effort: settings.effort };
+        // Other engines read AGENTS.md / CLAUDE.md themselves: they get only the NOU.md rules on top.
+        engineConfig.current = { system: buildSystemPrompt(permContext, extras), extras: [...extras, nouRulesOnly(permContext)].filter(Boolean), extraTools: [...extraTools, ...mcpRef.current.tools()], effort: settings.effort };
         agentRef.current.configure(engineConfig.current);
-    }, [settings.gitContext, settings.effort, activePlugins]);
+    }, [settings.gitContext, settings.effort, activePlugins, mcpVersion]);
     // Pick up changes made outside Nou (other editors, git commands).
     const polling = useRef(false);
     useEffect(() => {
@@ -338,7 +470,84 @@ export function App({ initialModel, permContext }) {
         engine.configure(engineConfig.current);
         agentRef.current = engine;
         updateSettings({ engine: id });
-        info(`Now using the ${target.label} engine (model: ${target.model(choice)}). This starts a new conversation.${target.approvals === "after" ? " It edits without asking first; review its changes in the diff view and press u to undo." : ""}`);
+        const handoff = conversationSoFar(entries);
+        if (handoff)
+            engine.note(handoff);
+        info(`Now using the ${target.label} engine (model: ${target.model(choice)}). ${handoff ? "It has the conversation so far." : "This starts a new conversation."}${target.approvals === "after" ? " It edits without asking first; review its changes in the diff view and press u to undo." : ""}`);
+    };
+    /**
+     * /resume: lists this folder's earlier conversations, or picks one back up (by number, or "last"). The
+     * engine it was with carries on from its own saved state where it can (Nou's messages, Claude Code's
+     * session, Codex's thread); otherwise it's handed the conversation, like switching engines.
+     */
+    const resumeConversation = async (arg) => {
+        if (busy)
+            return info("Wait for the current reply to finish (or press Esc) before resuming another conversation.", "error");
+        const list = resumable();
+        if (!list.length)
+            return info("No earlier conversations in this folder yet: Nou's are saved after each reply, and Claude Code's and Codex's own sessions here show up too.");
+        if (!arg) {
+            const rows = list.slice(0, 10).map((c, i) => `  ${String(i + 1).padStart(2)}. ${c.title}  (${c.messages} message${c.messages === 1 ? "" : "s"} · ${"file" in c ? `${engineInfo(c.engine).label} CLI` : engineInfo(isEngineId(c.engine) ? c.engine : "nou").label} · ${ago(c.updated)})`);
+            return info(`Earlier conversations here. /resume <number> picks one up (or /resume last):\n${rows.join("\n")}`);
+        }
+        const pick = arg === "last" ? list[0] : list[Number(arg) - 1] ?? list.find((c) => c.id === arg);
+        if (!pick)
+            return info(`There's no conversation ${arg}: /resume lists them.`, "error");
+        if ("file" in pick)
+            return resumeExternal(pick);
+        const saved = loadConversation(pick.id);
+        if (!saved)
+            return info(`Couldn't read conversation ${arg}.`, "error");
+        const engine = engineFor(isEngineId(saved.engine) ? saved.engine : null);
+        const restored = saved.engine === engine.id && !!saved.state && !!engine.restore?.(saved.state);
+        if (!restored) {
+            const handoff = conversationSoFar(saved.entries);
+            if (handoff)
+                engine.note(handoff);
+        }
+        setConversationId(saved.id);
+        setQueued([]);
+        setEntries([...saved.entries, { kind: "info", text: `Resumed "${saved.title}" from ${ago(saved.updated)} with ${engineInfo(engine.id).label}. ${restored ? "It picks up right where it left off." : "It has the conversation so far."}` }]);
+        setFocus("chat");
+    };
+    /** Nou's saved conversations and Claude Code's and Codex's own sessions here, latest first, without doubles. */
+    function resumable() {
+        const own = listConversations().filter((c) => c.id !== conversationId);
+        const current = agentRef.current.snapshot?.();
+        const known = new Set([...own.map((c) => c.ref), current?.claudeSession, current?.codexThread].filter(Boolean));
+        return [...own, ...externalSessions().filter((s) => !known.has(s.id))].sort((a, b) => b.updated - a.updated);
+    }
+    /** The engine to resume with: back to `id` when it's installed (it picks up best), else the current one, cleared. */
+    const engineFor = (id) => {
+        let engine = agentRef.current;
+        if (id && id !== engine.id && isInstalled(engineInfo(id))) {
+            engine.dispose?.();
+            engine = createEngine(id, choice, engineConfig.current.system ?? buildSystemPrompt(permContext), hooksRef.current);
+            engine.configure(engineConfig.current);
+            agentRef.current = engine;
+            updateSettings({ engine: id });
+        }
+        engine.clear();
+        return engine;
+    };
+    /** A session from Claude Code's or Codex's own CLI: that engine resumes it, so it carries on with all of it. */
+    const resumeExternal = (session) => {
+        const label = engineInfo(session.engine).label;
+        if (!isInstalled(engineInfo(session.engine))) {
+            return info(`That's a ${label} session: switch to its engine first (/engine ${session.engine}, which installs it), then /resume it again.`, "error");
+        }
+        const engine = engineFor(session.engine);
+        const restored = !!engine.restore?.(session.engine === "claude-code" ? { claudeSession: session.id } : { codexThread: session.id });
+        const entries = externalEntries(session);
+        if (!restored) {
+            const handoff = conversationSoFar(entries);
+            if (handoff)
+                engine.note(handoff);
+        }
+        setConversationId(newSessionId());
+        setQueued([]);
+        setEntries([...entries, { kind: "info", text: `Resumed "${session.title}" from ${label}'s CLI (${ago(session.updated)}). ${label} picks up right where it left off, with Nou's diffs and undo from here on.` }]);
+        setFocus("chat");
     };
     /** Downloads an Ollama model, showing progress in the status line. Esc stops it. */
     const pullModel = async (model) => {
@@ -488,10 +697,16 @@ export function App({ initialModel, permContext }) {
         return next;
     };
     /** Adds a wheel event to its pane's total; the panes get one update per frame however many events arrive. */
+    const lastVerticalWheel = useRef(0);
     const queueWheel = (pane, dir, horizontal) => {
+        // A trackpad scrolling down also sends stray sideways steps: while scrolling up or down, ignore them.
+        if (!horizontal)
+            lastVerticalWheel.current = Date.now();
+        else if (Date.now() - lastVerticalWheel.current < 300)
+            return;
         const q = pendingWheel.current;
         if (q.timer && q.pane !== pane)
-            flushWheel();
+            flushWheel(true);
         q.pane = pane;
         if (horizontal)
             q.columns += dir * WHEEL_STEP;
@@ -499,21 +714,31 @@ export function App({ initialModel, permContext }) {
             q.lines += dir * WHEEL_STEP;
         q.timer ??= setTimeout(flushWheel, 16);
     };
-    const flushWheel = () => {
+    /**
+     * Scrolls by what the wheel added up, spread over a few frames: half of what's left each frame, so a
+     * notch glides over 2-3 frames and a fast flick eases out instead of jumping dozens of lines at once.
+     * `all` sends the rest at once (the pointer moved to another pane).
+     */
+    const flushWheel = (all = false) => {
         const q = pendingWheel.current;
         if (q.timer)
             clearTimeout(q.timer);
         q.timer = null;
         if (!q.lines && !q.columns)
             return;
-        const { pane, lines, columns } = q;
-        q.lines = 0;
-        q.columns = 0;
+        const part = (n) => (all || Math.abs(n) <= 1 ? n : Math.sign(n) * Math.ceil(Math.abs(n) / 2));
+        const lines = part(q.lines);
+        const columns = part(q.columns);
+        const { pane } = q;
+        q.lines -= lines;
+        q.columns -= columns;
         setWheel((w) => ({ pane, lines, columns, nonce: (w?.nonce ?? 0) + 1 }));
+        if (q.lines || q.columns)
+            q.timer = setTimeout(flushWheel, 16);
     };
     /** Scrolls a pane to where its scrollbar was clicked or dragged (rows start at y=3, under the border and title). */
     const scrollPane = (pane, y) => {
-        const { paneHeight } = layout.current;
+        const paneHeight = pane === "game" || pane === "terminal" ? 0 : layout.current.heights[pane];
         const fraction = (y - 3) / Math.max(1, paneHeight - 4);
         setScrollTo((s) => ({ pane, fraction, nonce: (s?.nonce ?? 0) + 1 }));
     };
@@ -522,10 +747,60 @@ export function App({ initialModel, permContext }) {
     // (starting the editor). Drag to select in the editor, drag a scrollbar to scroll, drag the border
     // between panes to resize them.
     useMouse((event) => {
-        if (view !== "main" || quickOpen)
+        if (view !== "main" || quickOpen !== null)
             return;
+        // The Games panel sits under a pane: it takes the clicks that land on it, × on its title closes it,
+        // and dragging its title docks it under the pane you let go over.
+        const term = layout.current.terminal;
+        if (term && event.x >= term.x && event.x < term.x + term.width && event.y >= term.y && event.y < term.y + term.height && !dragging.current) {
+            if (event.kind === "wheel")
+                return queueWheel("terminal", event.dir, false);
+            if (event.kind !== "click")
+                return;
+            if (event.y === term.y + 1 && event.x >= term.x + term.width - 5)
+                return toggleTerminal(false); // ×
+            if (focus !== "terminal")
+                beforeTerm.current = focus;
+            setFocus("terminal");
+            return;
+        }
+        const game = layout.current.game;
+        if (gamesOpen && game) {
+            const drag = dragging.current;
+            if (drag === "game") {
+                const { treeWidth, codeWidth } = layout.current;
+                const over = event.x < treeWidth ? "tree" : event.x < treeWidth + codeWidth ? "code" : "chat";
+                if (event.kind === "release") {
+                    dragging.current = null;
+                    setGameDrag(null);
+                    updateSettings({ gameDock: over });
+                }
+                else
+                    setGameDrag(over);
+                return;
+            }
+            const inside = event.x >= game.x && event.x < game.x + game.width && event.y >= game.y && event.y < game.y + game.height;
+            if (inside) {
+                if (event.kind !== "click")
+                    return;
+                if (event.y === game.y + 1 && event.x >= game.x + game.width - 5) {
+                    // × closes it
+                    setGamesOpen(false);
+                    if (focus === "game")
+                        setFocus(beforeGame.current === "game" ? "chat" : beforeGame.current);
+                    return;
+                }
+                if (focus !== "game")
+                    beforeGame.current = focus;
+                setFocus("game");
+                if (event.y <= game.y + 1)
+                    dragging.current = "game";
+                return;
+            }
+        }
         const { treeWidth, codeWidth, paneHeight } = layout.current;
         const codeLeft = treeWidth;
+        const chatAt = (x, y, kind) => setChatSelect((c) => ({ row: y - 3, col: x - treeWidth - codeWidth - 3, kind, nonce: (c?.nonce ?? 0) + 1 }));
         const editorAt = (x, y, kind) => setEditorMouse((m) => [...m.slice(-15), { x: x - codeLeft - 1, y: y - 3, kind, seq: (m[m.length - 1]?.seq ?? 0) + 1 }]);
         if (event.kind === "drag") {
             lastClick.current = null; // a press that became a drag doesn't start a double-click
@@ -534,32 +809,48 @@ export function App({ initialModel, permContext }) {
                 moveBorder(drag, event.x);
             else if (drag === "editor")
                 editorAt(event.x, event.y, "drag");
-            else if (drag)
+            else if (drag === "chatText")
+                chatAt(event.x, event.y, "drag");
+            else if (drag && typeof drag === "object")
                 scrollPane(drag.scroll, event.y);
             return;
         }
         if (event.kind === "release") {
             // The release says where the button let go, so a drag lands there even in a terminal that
             // doesn't report the movement in between.
-            if (dragging.current === "tree" || dragging.current === "chat")
+            if (dragging.current === "tree" || dragging.current === "chat") {
                 updateSettings({ paneWidths: moveBorder(dragging.current, event.x) });
-            else if (dragging.current && typeof dragging.current === "object")
+                setResizing(null);
+            }
+            else if (dragging.current && typeof dragging.current === "object" && "scroll" in dragging.current)
                 scrollPane(dragging.current.scroll, event.y);
             if (dragging.current === "editor")
                 editorAt(event.x, event.y, "release");
+            if (dragging.current === "chatText")
+                chatAt(event.x, event.y, "release");
             dragging.current = null;
             return;
         }
+        if (event.kind === "click" && !approval && event.y === 0 && event.x >= clickable.current.modelFrom)
+            return setView("settings");
+        if (event.kind === "click" && event.y === paneHeight + 1)
+            return clickable.current.status.find((z) => event.x >= z.from && event.x < z.to)?.run();
         if (event.y < 1 || event.y > paneHeight)
             return; // header or status bar
         const pane = event.x < treeWidth ? "tree" : event.x < treeWidth + codeWidth ? "code" : "chat";
         if (event.kind === "wheel")
             return queueWheel(pane, event.dir, event.horizontal);
         // Each border is two columns: the left pane's edge and the right pane's.
-        if (Math.abs(event.x - (treeWidth - 0.5)) <= 1)
-            return void (dragging.current = "tree");
-        if (Math.abs(event.x - (treeWidth + codeWidth - 0.5)) <= 1)
-            return void (dragging.current = "chat");
+        // On the panes' top border row, a little either side of a border grabs it too: an easier target.
+        const reach = event.y === 1 ? 2 : 1;
+        for (const border of ["tree", "chat"]) {
+            const edge = border === "tree" ? treeWidth - 0.5 : treeWidth + codeWidth - 0.5;
+            if (Math.abs(event.x - edge) <= reach) {
+                dragging.current = border;
+                setResizing(border);
+                return;
+            }
+        }
         // Each pane's scrollbar is the column inside its right border.
         const scrollbarX = pane === "tree" ? treeWidth - 2 : pane === "code" ? treeWidth + codeWidth - 2 : columns - 2;
         if (event.x === scrollbarX && event.y >= 3) {
@@ -567,12 +858,46 @@ export function App({ initialModel, permContext }) {
             scrollPane(pane, event.y);
             return;
         }
+        // The code view's title row holds the tabs: a click switches, the × closes.
+        if (event.kind === "click" && pane === "code" && event.y === 2 && tabs.length && !diff) {
+            const at = event.x - codeLeft - 1;
+            const layout = layoutTabs(tabs, openFile, tabsWidth(codeWidth));
+            setFocus("code"); // so x, Ctrl+W and [ ] work next
+            if (layout.prev !== null && at === layout.prev)
+                return cycleTab(-1);
+            if (layout.next !== null && at === layout.next)
+                return cycleTab(1);
+            const zone = layout.zones.find((z) => at >= z.from && at < z.to);
+            if (!zone)
+                return;
+            if (Math.abs(at - zone.close) <= 1)
+                closeTab(zone.file);
+            else
+                switchTab(zone.file);
+            return;
+        }
+        // Ctrl/Alt+click or right-click on code: go to the definition of what's under the pointer.
+        if (event.kind === "click" && event.define && pane === "code" && event.y >= 3 && codePanel === "code") {
+            lastClick.current = null;
+            setFocus("code");
+            if (showEditor)
+                editorAt(event.x, event.y, "define");
+            else if (openFile && !diff)
+                setCodeDefine((d) => ({ row: event.y - 3, x: event.x - codeLeft - 1, nonce: (d?.nonce ?? 0) + 1 }));
+            return;
+        }
         if (approval)
             return;
         setFocus(pane);
         // Rows start under the pane's top border (y=1) and title (y=2).
         if (pane === "tree" && event.y >= 3)
             setTreeClick((c) => ({ row: event.y - 3, nonce: (c?.nonce ?? 0) + 1 }));
+        // Messages start after the chat's border and the two-column bar in front of each line.
+        if (pane === "chat" && event.y >= 3) {
+            setChatClick((c) => ({ row: event.y - 3, col: event.x - treeWidth - codeWidth - 3, nonce: (c?.nonce ?? 0) + 1 }));
+            dragging.current = "chatText";
+            chatAt(event.x, event.y, "press");
+        }
         // Two clicks in the same spot within half a second are a double-click.
         const last = lastClick.current;
         const double = !!last && Date.now() - last.time < DOUBLE_CLICK_MS && Math.abs(last.x - event.x) <= 1 && last.y === event.y;
@@ -597,9 +922,10 @@ export function App({ initialModel, permContext }) {
             return;
         if (showEditor && focus === "code" && editorStateRef.current?.selection)
             return; // the editor copies it
+        if (focus === "terminal")
+            return; // the terminal stops its command
         if (busy || approval) {
-            pullAbort.current?.abort();
-            agentRef.current?.cancel();
+            stop();
             approval?.resolve(false);
             setApproval(null);
             return;
@@ -725,8 +1051,11 @@ export function App({ initialModel, permContext }) {
         info(`You have unsaved edits in ${draft.current.path}. Open it and save (Ctrl+S) first, or turn on auto-save in settings.`, "error");
         return false;
     };
-    /** Opens a file at a line, in the editor if `edit` (used by the Problems list and go-to-definition). */
-    const openAt = (file, line, edit = false) => {
+    /**
+     * Opens a file at a line, in the editor if `edit` (used by the Problems list and go-to-definition).
+     * With `to`, lines `line` to `to` are highlighted: something the user asked Nou to find.
+     */
+    const openAt = (file, line, edit = false, to) => {
         if (!settleDraft(file))
             return;
         if (file !== openFile)
@@ -739,12 +1068,107 @@ export function App({ initialModel, permContext }) {
             setFocus("code");
         }
         else {
-            setFocusLine((f) => ({ line, nonce: (f?.nonce ?? 0) + 1 }));
+            setFocusLine((f) => ({ line, ...(to !== undefined ? { to, path: file } : {}), nonce: (f?.nonce ?? 0) + 1 }));
         }
     };
+    // Every file that's shown gets a tab (however it was opened: the tree, Nou, a link...).
+    useEffect(() => {
+        if (openFile)
+            setTabs((t) => (t.includes(openFile) ? t : [...t, openFile].slice(-20)));
+    }, [openFile]);
+    /** Switches to another open file's tab. */
+    const switchTab = (file) => {
+        if (file === openFile || !settleDraft(file))
+            return;
+        clearFollow();
+        open(file);
+        setReveal(file);
+    };
+    const cycleTab = (step) => {
+        if (tabs.length < 2 || !openFile)
+            return;
+        const i = tabs.indexOf(openFile);
+        switchTab(tabs[(i + step + tabs.length) % tabs.length]);
+    };
+    /** Closes a tab (the open file's by default), moving to its neighbour. */
+    const closeTab = (file = openFile) => {
+        if (!file)
+            return;
+        const i = tabs.indexOf(file);
+        const rest = tabs.filter((f) => f !== file);
+        if (file !== openFile)
+            return setTabs(rest);
+        const next = rest[Math.min(Math.max(0, i), rest.length - 1)];
+        if (!settleDraft(next ?? ""))
+            return;
+        if (draft.current?.path === file)
+            draft.current = null;
+        setTabs(rest);
+        if (next) {
+            open(next);
+            setReveal(next);
+        }
+        else {
+            setOpenFile(null);
+            setContent("");
+            setEditing(false);
+            setDiffMode("off");
+        }
+    };
+    const showFollowStep = (step) => {
+        if (step.line)
+            openAt(step.file, step.line, false, step.to ?? step.line);
+        else if (step.file !== openFile) {
+            if (!settleDraft(step.file))
+                return;
+            open(step.file);
+            setReveal(step.file);
+        }
+    };
+    const showFollowRef = useRef(showFollowStep);
+    showFollowRef.current = showFollowStep;
+    /** Shows the next waiting step, then waits as long as the follow speed says before the one after. */
+    const playFollow = () => {
+        const step = followQueue.current.shift();
+        setFollowLag(followQueue.current.length);
+        if (!step) {
+            followTimer.current = null;
+            return;
+        }
+        showFollowRef.current(step);
+        followTimer.current = setTimeout(playFollow, FOLLOW_STEP_MS[settingsRef.current.followSpeed] ?? FOLLOW_STEP_MS.normal);
+    };
+    const followStep = (step) => {
+        if (!followRef.current)
+            return;
+        if (!FOLLOW_STEP_MS[settings.followSpeed])
+            return showFollowStep(step);
+        followQueue.current.push(step);
+        // Never fall too far behind: past that, the oldest steps are skipped.
+        if (followQueue.current.length > MAX_FOLLOW_LAG)
+            followQueue.current.splice(0, followQueue.current.length - MAX_FOLLOW_LAG);
+        setFollowLag(followQueue.current.length);
+        if (!followTimer.current)
+            playFollow();
+    };
+    const followStepRef = useRef(followStep);
+    followStepRef.current = followStep;
+    useEffect(() => {
+        if (!follow)
+            clearFollow();
+    }, [follow]);
+    const openAtRef = useRef(openAt);
+    openAtRef.current = openAt;
+    /** A file named in the chat (clicked, or shown by Nou): open it there, highlighting the lines it names. */
+    const openRef = useEvent((ref) => {
+        clearFollow();
+        const file = path.relative(process.cwd(), path.resolve(ref.path)).replace(/\\/g, "/");
+        openAt(file, ref.line ?? 1, false, ref.line ? ref.to ?? ref.line : undefined);
+    });
     const startEditing = () => {
         if (!openFile || !settleDraft(openFile))
             return;
+        clearFollow();
         setDiffMode("off");
         setCodePanel("code");
         setEditorStart((s) => ({ line: viewport?.top ?? 1, nonce: s.nonce + 1 }));
@@ -773,31 +1197,35 @@ export function App({ initialModel, permContext }) {
         // handles them itself when its input is empty), Esc stops the turn, and every other key works as usual.
         if (approval && !(showEditor && focus === "code")) {
             if (key.escape) {
-                agentRef.current?.cancel();
+                stop();
                 return answer(false);
             }
-            if (focus !== "chat" && /^[yYnN]$/.test(input))
+            if (focus !== "chat" && focus !== "terminal" && /^[yYnN]$/.test(input))
                 return answer(/[yY]/.test(input));
             if (focus !== "chat" && input === "o" && pendingChange)
                 return openPending();
         }
         if (key.ctrl && input === "p") {
-            setQuickOpen(true);
+            setQuickOpen("");
             return;
         }
         if (showEditor && focus === "code")
             return; // the editor owns the keyboard
+        if (focus === "code" && codeFinding.current)
+            return; // so does the find bar
+        if (focus === "game" || focus === "terminal")
+            return; // and the Games panel and the terminal
         if (key.tab && key.shift)
             return cycleAutoMode();
+        if (key.tab && focus === "chat" && chatMenuOpen.current)
+            return; // Tab completes the command
         if (key.tab) {
             setFocus((f) => FOCUS_ORDER[(FOCUS_ORDER.indexOf(f) + 1) % FOCUS_ORDER.length]);
             return;
         }
         if (key.escape) {
-            if (busy) {
-                pullAbort.current?.abort();
-                agentRef.current?.cancel();
-            }
+            if (busy)
+                stop();
             else if (diffMode !== "off") {
                 setDiffMode("off");
                 setSessionView(null);
@@ -808,22 +1236,21 @@ export function App({ initialModel, permContext }) {
         }
         if (focus === "chat")
             return; // letters belong to the text box
-        if (input === "/") {
+        if (input === "?")
+            setQuickOpen(">"); // every action, searchable
+        else if (input === "/") {
             // Commands work from anywhere: / jumps to the chat's command box.
             setFocus("chat");
             setChatPrefill((p) => ({ text: "/", nonce: (p?.nonce ?? 0) + 1 }));
         }
         else if (input === "f")
             setFollow((f) => !f);
-        else if (input === "m") {
-            updateSettings({ mouse: !settings.mouse });
-            info(settings.mouse ? "Mouse off: drag to select text and copy it as usual in your terminal. m turns it back on." : "Mouse on: wheel scrolls, click focuses, drag borders to resize.");
-        }
-        else if (input === "p") {
-            setCodePanel((p) => (p === "problems" ? "code" : "problems"));
-            setEditing(false);
-            setFocus("code");
-        }
+        else if (input === "m")
+            toggleMouse();
+        else if (input === "`")
+            toggleTerminal();
+        else if (input === "p")
+            toggleProblems();
         else if (input === "u")
             undoLast();
         else if (input === "<" || input === ">") {
@@ -840,8 +1267,14 @@ export function App({ initialModel, permContext }) {
             cycleDiff();
         else if ((input === "]" || input === "[") && diffMode === "session")
             stepSessionFile(input === "]" ? 1 : -1);
+        else if (input === "]" || input === "[")
+            cycleTab(input === "]" ? 1 : -1);
+        else if (input === "x" || (key.ctrl && input === "w"))
+            closeTab();
         else if (input === "e")
             startEditing();
+        else if (input === "b")
+            goBack();
         else if (input === "s" || input === ",")
             setView("settings");
         else if (input === "r") {
@@ -850,7 +1283,7 @@ export function App({ initialModel, permContext }) {
         }
         else if (input === "q")
             requestQuit();
-    }, { isActive: view === "main" && !quickOpen && !(codePanel === "problems" && focus === "code") });
+    }, { isActive: view === "main" && quickOpen === null && !(codePanel === "problems" && focus === "code") });
     /** What the user is looking at, attached to each message so "this file" / "here" make sense. */
     const editorContext = () => {
         if (!openFile)
@@ -880,6 +1313,56 @@ ${snippet}
     const contextChip = openFile
         ? `${openFile}${showEditor && editorState ? `:${editorState.line}${editorState.dirty ? " ✎ unsaved" : ""}` : viewport ? `:${viewport.top}-${viewport.bottom}` : ""}`
         : null;
+    /** /mcp: list servers; add (a preset, a command, or a URL), remove, or import the ones from other tools. */
+    const mcpCommand = async ([action, name, ...more]) => {
+        if (action === "add") {
+            if (!name)
+                return info(`Usage: /mcp add <name> <command and arguments | url>, or a ready-made one: ${Object.keys(MCP_PRESETS).join(", ")}`, "error");
+            const preset = MCP_PRESETS[name];
+            const target = more.join(" ").trim();
+            if (!preset && !target)
+                return info(`Usage: /mcp add ${name} <command and arguments | url>`, "error");
+            const config = preset && !target ? preset.config : /^https?:\/\//.test(target) ? { url: target } : { command: more[0], args: more.slice(1) };
+            saveUserServers({ [name]: config });
+            info(`Added ${name} to ${USER_MCP_FILE}. Connecting...`);
+            await connectMcp();
+            const st = mcpRef.current.status().find((x) => x.name === name);
+            return info(st?.state === "ready" ? `${name} is connected: ${st.tools} tools. Just ask; tools that change things ask you first.` : `${name} didn't connect: ${st?.error ?? "unknown error"}`, st?.state === "ready" ? "info" : "error");
+        }
+        if (action === "remove") {
+            if (!name || !removeUserServer(name))
+                return info(`No server called "${name ?? ""}" in ${USER_MCP_FILE}.`, "error");
+            await connectMcp();
+            return info(`Removed ${name}.`);
+        }
+        if (action === "import") {
+            const have = new Set(loadMcpServers(true).map((e) => e.name));
+            const found = findOtherMcpServers().filter((f) => !have.has(f.name));
+            if (!found.length)
+                return info("No MCP servers to import: none set up in Claude Code, Claude Desktop, Cursor, Windsurf, VS Code, Gemini CLI or Codex that Nou doesn't have.");
+            saveUserServers(Object.fromEntries(found.map((f) => [f.name, f.config])));
+            info(`Imported ${found.map((f) => `${f.name} (from ${f.from})`).join(", ")} into ${USER_MCP_FILE}. Connecting...`);
+            await connectMcp();
+            return mcpCommand([]);
+        }
+        if (action === "reconnect") {
+            mcpRef.current.close();
+            await connectMcp();
+            return mcpCommand([]);
+        }
+        if (action)
+            return info("Usage: /mcp, /mcp add <name> <command|url>, /mcp add browser, /mcp remove <name>, /mcp import, /mcp reconnect", "error");
+        const list = mcpRef.current.status();
+        const mark = { ready: "●", connecting: "◌", failed: "✖", off: "○" };
+        const lines = list.map((x) => `  ${mark[x.state]} ${x.name.padEnd(16)} ${x.state === "ready" ? `${x.tools} tools` : x.state}${x.scope === "project" ? " · this project" : ""}${x.error ? ` · ${x.error}` : ""}`);
+        const others = findOtherMcpServers().filter((f) => !list.some((x) => x.name === f.name));
+        return info([
+            list.length ? `MCP servers:\n${lines.join("\n")}` : "No MCP servers yet.",
+            `Ready-made: ${Object.entries(MCP_PRESETS).map(([k, v]) => `/mcp add ${k} (${v.about})`).join(" · ")}`,
+            others.length ? `In your other tools: ${others.map((f) => `${f.name} (${f.from})`).join(", ")}. /mcp import adds them.` : "",
+            `Yours are in ${USER_MCP_FILE}; a project's in .mcp.json (used in trusted folders).`,
+        ].filter(Boolean).join("\n"));
+    };
     const pluginsCommand = async ([action, name]) => {
         if (action === "add") {
             const starter = starters.find((s) => s.id === name);
@@ -924,6 +1407,27 @@ ${snippet}
                 return showSessionDiff(arg);
             case "sessions":
                 return showSessions();
+            case "open": {
+                // A path (with :line or :line-line), or part of a file's name.
+                const m = arg.match(/^(.*?)(?::(\d+)(?:-(\d+))?)?$/);
+                const wanted = m[1].replace(/^\.\//, "");
+                if (!wanted)
+                    return info("Usage: /open <file>[:line] (part of the name is enough), or ask in the chat where something is.", "error");
+                const files = listAllFiles();
+                const file = files.includes(wanted) ? wanted : files
+                    .map((f) => ({ f, m: score(f, wanted) }))
+                    .filter((r) => r.m)
+                    .sort((a, b) => b.m.score - a.m.score)[0]?.f;
+                if (!file)
+                    return info(`No file matches "${wanted}". To find where something is in the code, ask in the chat.`, "error");
+                return openRef({ path: file, ...(m[2] ? { line: Number(m[2]) } : {}), ...(m[3] ? { to: Number(m[3]) } : {}) });
+            }
+            case "games":
+                return toggleGames();
+            case "cancel":
+                return cancelLast();
+            case "mcp":
+                return mcpCommand(rest);
             case "problems":
                 setCodePanel("problems");
                 setFocus("code");
@@ -1028,7 +1532,12 @@ ${snippet}
             case "clear":
                 agentRef.current.clear();
                 setEntries([]);
+                setConversationId(newSessionId()); // the last one stays saved for /resume
                 return;
+            case "terminal":
+                return toggleTerminal();
+            case "resume":
+                return resumeConversation(rest[0] ?? "");
             case "plugins":
                 return pluginsCommand(rest);
             case "version":
@@ -1054,11 +1563,110 @@ ${snippet}
             }
         }
     };
+    /** Takes you to where the provider's setup is fixed: its key and URL form, or its list of models. */
+    const fixSetup = (provider, reason, form) => {
+        setConnectTo(form && provider.connect ? provider : undefined);
+        setSetupReason(reason);
+        setView("settings");
+    };
+    // A request that failed because of the provider's setup (not the request) opens the fix for it.
+    const setupCheck = (error) => {
+        // Only a failed request to the model ("provider:model: ..."), never a tool's error or a problem report.
+        if (agentRef.current?.id !== "nou" || !error.startsWith(`${describe(choice)}: `))
+            return;
+        const provider = choice.provider;
+        const problem = setupProblem(provider, error);
+        if (!problem)
+            return;
+        const what = problem === "key" ? "the key was rejected" : problem === "url" ? "its URL didn't answer" : "it doesn't have that model";
+        info(`${provider.label}: ${what}. Opened its settings to fix it (Esc to come back).`);
+        fixSetup(provider, error.split("\n")[0], problem !== "model");
+    };
+    const setupCheckRef = useRef(setupCheck);
+    setupCheckRef.current = setupCheck;
+    /**
+     * Takes back your last message: stops Nou if it's still on it, removes the message and its reply from the
+     * conversation (yours on screen and the model's), and puts the text back in the input to edit and resend.
+     * Files it changed stay changed: /rewind undoes those.
+     */
+    // What was queued behind it comes back into the input too, rather than being sent.
+    const [retract, setRetract] = useState(null);
+    const cancelLast = () => {
+        setRetract({ queued });
+        setQueued([]);
+        if (busy)
+            stop();
+    };
+    useEffect(() => {
+        if (!retract || busy)
+            return;
+        const later = retract.queued;
+        setRetract(null);
+        const engine = agentRef.current;
+        const at = entries.findLastIndex((e) => e.kind === "user");
+        if (at < 0)
+            return info("There's no message to take back.");
+        if (!engine.retractLast)
+            return info(`${engineInfo(engine.id).label} keeps its own history, so a message can't be taken back there: /clear starts over.`, "error");
+        engine.retractLast();
+        const text = [entries[at].text, ...later].join("\n");
+        stopped.current = false;
+        setEntries((prev) => [...prev.slice(0, at), { kind: "info", text: "Took back your last message; it's in the input to edit and resend. (Any files it changed stay changed: /rewind undoes them.)" }]);
+        setChatPrefill((p) => ({ text, nonce: (p?.nonce ?? 0) + 1 }));
+        setFocus("chat");
+    }, [retract, busy]);
+    /** Messages sent while Nou works: they go together when it finishes (commands each in turn). */
+    const [queued, setQueued] = useState([]);
+    /** Set when you stop Nou: what was queued goes back into the input instead of being sent. */
+    const stopped = useRef(false);
+    const stop = () => {
+        pullAbort.current?.abort();
+        agentRef.current?.cancel();
+        stopped.current = true;
+    };
+    useEffect(() => {
+        if (busy || approval || !queued.length)
+            return;
+        if (stopped.current) {
+            stopped.current = false;
+            setChatPrefill((p) => ({ text: queued.join("\n"), nonce: (p?.nonce ?? 0) + 1 }));
+            setQueued([]);
+            return;
+        }
+        // Messages queued together go together, as one message, so they're answered at once rather than one
+        // after another. A command runs on its own, in its turn.
+        const isCommand = (text) => text.startsWith("/");
+        const take = isCommand(queued[0]) ? 1 : Math.max(1, queued.findIndex(isCommand) === -1 ? queued.length : queued.findIndex(isCommand));
+        setQueued(queued.slice(take));
+        send(queued.slice(0, take).join("\n\n"));
+    }, [busy, approval, queued]);
+    useEffect(() => {
+        if (busy)
+            stopped.current = false;
+    }, [busy]);
+    /** From the chat: while Nou works, a message waits its turn, or (`now`) stops Nou and goes right away. */
+    const submit = (text, now = false) => {
+        if (!busy)
+            return send(text);
+        if (now) {
+            stop();
+            stopped.current = false; // this one is meant to go
+            setQueued((q) => [text, ...q]);
+        }
+        else
+            setQueued((q) => [...q, text]);
+    };
     const send = (text) => {
         if (text.startsWith("/")) {
             void runCommand(text);
             return;
         }
+        const missing = agentRef.current?.id === "nou" ? choice.provider.unavailable() : null;
+        if (missing) {
+            info(`${choice.provider.label} isn't set up yet (${missing}). Opened its settings: enter what it needs, then send again.`, "error");
+            fixSetup(choice.provider, `${choice.provider.label} isn't set up: ${missing}`, true);
+            return;
+        }
         setEntries((prev) => [...prev, { kind: "user", text }]);
         void agentRef.current.send(text, editorContext() ?? undefined);
     };
@@ -1085,6 +1693,7 @@ ${snippet}
     }
     // Stable callbacks for the memoized panes.
     const onTreeOpen = useEvent((filePath) => {
+        clearFollow(); // you went somewhere yourself: follow mode stops replaying what Nou read
         open(filePath);
         setFocus("code");
     });
@@ -1092,23 +1701,36 @@ ${snippet}
     const onJump = useEvent((file, line) => openAt(file, line));
     const onCloseProblems = useEvent(() => setCodePanel("code"));
     const onViewport = useEvent((top, bottom) => setViewport((v) => (v?.top === top && v.bottom === bottom ? v : { top, bottom })));
-    const onSend = useEvent(send);
+    const onSend = useEvent(submit);
+    const onChatMenu = useEvent((open) => {
+        chatMenuOpen.current = open;
+        setChatMenu(open);
+    });
     const onAnswer = useEvent(answer);
     const onEditorHover = useEvent((text, line, col) => (lspEnabled && openFile ? lsp.hover(openFile, text, line, col) : Promise.resolve(null)));
-    const onEditorDefinition = useEvent((text, line, col) => {
+    /**
+     * Go to definition (Ctrl+G, Ctrl/Alt+click, right-click): the language server's answer when there is one,
+     * otherwise Nou's own (an imported name goes to its import line; a click on an import's path opens it).
+     */
+    const goToDefinition = async (text, line, col, inEditor) => {
         if (!openFile)
             return;
-        if (!lspEnabled)
-            return info("Go to definition needs a language server (see /settings → Plugins).", "error");
-        void lsp.definition(openFile, text, line, col).then((target) => {
-            if (!target)
-                return info("No definition found here.");
-            // Keep unsaved text when jumping within the same file.
-            if (target.file === openFile && draft.current)
-                draft.current = { ...draft.current, text };
+        const file = openFile;
+        const target = (lspEnabled ? await lsp.definition(file, text, line, col).catch(() => null) : null) ?? findDefinition(file, text, line, col);
+        if (!target) {
+            const word = wordAt(text.split(/\r?\n/)[line - 1] ?? "", col)?.word;
+            return info(word ? `No definition found for ${word}.` : "Ctrl+click (or Option+click, or right-click) a name to go to its definition.");
+        }
+        // Keep unsaved text when jumping within the same file.
+        if (inEditor && target.file === file && draft.current)
+            draft.current = { ...draft.current, text };
+        if (inEditor)
             openAt(target.file, target.line, true);
-        });
-    });
+        else
+            openAt(target.file, target.line, false, target.line);
+    };
+    const onEditorDefinition = useEvent((text, line, col) => void goToDefinition(text, line, col, true));
+    const onCodeDefine = useEvent((line, col) => void goToDefinition(content, line, col, false));
     const onEditorSave = useEvent((text) => saveFromEditor(text));
     const onEditorExit = useEvent(() => {
         draft.current = null;
@@ -1136,8 +1758,9 @@ ${snippet}
     });
     const lspEnabled = activePlugins.some((p) => p.id === "lsp");
     if (view === "settings") {
-        return (_jsx(Settings, { width: columns, height: rows, settings: settings, choice: choice, plugins: allPlugins, ...(connectTo ? { connectTo } : {}), onModel: (next) => void chooseModel(next), onEngine: (id) => void switchEngine(id), onChange: updateSettings, onTogglePlugin: (id, enabled) => void togglePlugin(id, enabled), onRescanPlugins: rescanPlugins, onClose: () => {
+        return (_jsx(Settings, { width: columns, height: rows, settings: settings, choice: choice, plugins: allPlugins, ...(connectTo ? { connectTo } : {}), reason: setupReason, onModel: (next) => void chooseModel(next), onEngine: (id) => void switchEngine(id), onChange: updateSettings, onTogglePlugin: (id, enabled) => void togglePlugin(id, enabled), onRescanPlugins: rescanPlugins, onClose: () => {
                 setConnectTo(undefined);
+                setSetupReason(null);
                 setView("main");
             } }));
     }
@@ -1145,34 +1768,158 @@ ${snippet}
     const treeWidth = paneWidths ? Math.max(MIN_TREE, Math.round(columns * paneWidths.tree)) : Math.max(24, Math.floor(columns * 0.2));
     const chatWidth = paneWidths ? Math.max(MIN_CHAT, Math.min(Math.round(columns * paneWidths.chat), columns - treeWidth - MIN_CODE)) : Math.max(34, Math.floor(columns * 0.3));
     const codeWidth = Math.max(MIN_CODE, columns - treeWidth - chatWidth);
-    layout.current = { treeWidth, codeWidth, paneHeight: height };
+    const tabStrip = tabs.length && openFile ? _jsx(Tabs, { tabs: tabs, active: openFile, width: tabsWidth(codeWidth), dirty: showEditor && !!editorState?.dirty }) : undefined;
+    // The Games panel takes the bottom of its pane's column: up to 19 rows, and never more than half.
+    const gameHeight = gamesOpen ? Math.min(GAME_PANEL.height, Math.floor(height / 2)) : 0;
+    const heights = { tree: height, code: height, chat: height };
+    heights[gameDock] -= gameHeight;
+    // The terminal takes the bottom third of the code's column (above the Games panel when that's there too).
+    const termHeight = termOpen ? Math.max(6, Math.min(Math.floor(height / 3), heights.code - 6)) : 0;
+    heights.code -= termHeight;
+    const dockLeft = gameDock === "tree" ? 0 : gameDock === "code" ? treeWidth : treeWidth + codeWidth;
+    const dockWidth = gameDock === "tree" ? treeWidth : gameDock === "code" ? codeWidth : chatWidth;
+    layout.current = { treeWidth, codeWidth, paneHeight: height, heights, game: gamesOpen ? { x: dockLeft, y: 1 + heights[gameDock] + (gameDock === "code" ? termHeight : 0), width: dockWidth, height: gameHeight } : null, terminal: termOpen ? { x: treeWidth, y: 1 + heights.code, width: codeWidth, height: termHeight } : null };
     const wheelFor = (pane) => (wheel?.pane === pane ? wheel : null);
     const scrollFor = (pane) => (scrollTo?.pane === pane ? scrollTo : null);
     const totals = diagnostics.counts();
     const checking = diagnostics.busy;
-    const mode = approval
-        ? { label: "APPROVE", color: C.yellow }
-        : showEditor ? { label: "EDIT", color: C.green }
-            : diff ? { label: "DIFF", color: C.accent2 }
-                : busy ? { label: "WORKING", color: C.accent2 }
-                    : { label: focus.toUpperCase(), color: C.accent };
+    /** Starts a command in the chat's input, for commands that need something typed after them. */
+    const typeCommand = (text) => {
+        setFocus("chat");
+        setChatPrefill((p) => ({ text, nonce: (p?.nonce ?? 0) + 1 }));
+    };
+    const toggleMouse = () => {
+        updateSettings({ mouse: !settings.mouse });
+        info(settings.mouse ? "Mouse off: drag to select text and copy it as usual in your terminal. m turns it back on." : "Mouse on: wheel scrolls, click focuses, drag borders to resize.");
+    };
+    /** Opens the terminal panel (starting its shell the first time) and gives it the keyboard, or closes it. */
+    function toggleTerminal(open = !termOpen) {
+        shellRef.current ??= new Shell(() => setTermVersion((v) => v + 1));
+        setTermOpen(open);
+        if (open) {
+            if (focus !== "terminal")
+                beforeTerm.current = focus;
+            setFocus("terminal");
+        }
+        else if (focus === "terminal")
+            setFocus(beforeTerm.current === "terminal" ? "code" : beforeTerm.current);
+    }
+    function leaveTerminal() {
+        setFocus(beforeTerm.current === "terminal" ? "code" : beforeTerm.current);
+    }
+    /** Opens the Games panel and gives it the keyboard, or closes it. */
+    const toggleGames = (open = !gamesOpen) => {
+        setGamesOpen(open);
+        if (open) {
+            if (focus !== "game")
+                beforeGame.current = focus;
+            setFocus("game");
+        }
+        else if (focus === "game")
+            setFocus(beforeGame.current);
+    };
+    // Plain functions, not hooks: this runs after the settings screen's early return.
+    const leaveGames = () => setFocus(beforeGame.current === "game" ? "chat" : beforeGame.current);
+    const gamesSettings = () => {
+        setFocus(beforeGame.current === "game" ? "chat" : beforeGame.current);
+        setView("settings");
+    };
+    /** Back to the file that was open before this one. */
+    const goBack = () => {
+        clearFollow();
+        const previous = recent.find((f) => f !== openFile);
+        if (!previous)
+            return info("No earlier file to go back to yet: Ctrl+P lists the files you've opened.");
+        open(previous);
+        setReveal(previous);
+    };
+    const toggleProblems = () => {
+        setCodePanel((p) => (p === "problems" ? "code" : "problems"));
+        setEditing(false);
+        setFocus("code");
+    };
+    // Everything Nou can do, for the command palette (? or Ctrl+P then >), with the key that does it.
+    const paletteActions = [
+        { title: "Find a file", keys: "Ctrl+P", run: () => setQuickOpen("") },
+        { title: "Find in the open file", keys: "Ctrl+F", run: startFind },
+        { title: "Open a file at a line", keys: "/open", run: () => typeCommand("/open ") },
+        { title: "Go back to the previous file", keys: "b", run: goBack },
+        { title: "Cancel your last message (edit it and resend)", keys: "/cancel", run: cancelLast },
+        { title: "Resume an earlier conversation", keys: "/resume", run: () => void resumeConversation("") },
+        { title: termOpen ? "Close the terminal" : "Open a terminal under the code", keys: "`", run: () => toggleTerminal() },
+        ...recentChats.slice(0, 5).map((c) => ({ title: `Resume: ${c.title}${"file" in c ? ` (${engineInfo(c.engine).label} CLI)` : ""}`, keys: ago(c.updated), run: () => void resumeConversation(c.id) })),
+        { title: "MCP servers: tools from other programs", keys: "/mcp", run: () => void runCommand("/mcp") },
+        { title: "Browser control (Playwright MCP)", keys: "/mcp add browser", run: () => void runCommand("/mcp add browser") },
+        { title: "Import MCP servers from Claude Code, Cursor, Codex...", keys: "/mcp import", run: () => void runCommand("/mcp import") },
+        { title: gamesOpen ? "Close the Games panel" : "Games: Pong, Snake, Breakout", keys: "/games", run: () => toggleGames() },
+        { title: "Next tab", keys: "]", run: () => cycleTab(1) },
+        { title: "Previous tab", keys: "[", run: () => cycleTab(-1) },
+        { title: "Close the tab", keys: "x", run: () => closeTab() },
+        { title: "Edit the open file", keys: "e · double-click", run: startEditing },
+        { title: "Diff the open file (vs git, Nou's edit, this session)", keys: "v", run: cycleDiff },
+        { title: "Undo Nou's last change", keys: "u", run: undoLast },
+        { title: "Rewind everything from Nou's last turn", keys: "/rewind", run: rewind },
+        { title: "Changes this session", keys: "/diff", run: () => showSessionDiff("") },
+        { title: "Earlier sessions", keys: "/sessions", run: showSessions },
+        { title: "Recent changes", keys: "/history", run: showHistory },
+        { title: "Problems: every error and warning", keys: "p", run: toggleProblems },
+        { title: "Switch model", keys: "/model", run: () => setView("settings") },
+        { title: "Connect a provider (API key)", keys: "/connect", run: () => typeCommand("/connect ") },
+        { title: "Switch engine (Nou, Claude Code, Codex, pi)", keys: "/engine", run: () => void runCommand("/engine") },
+        { title: "Ask before every edit and command", keys: "Shift+Tab", run: () => cycleAutoMode("ask") },
+        { title: "Auto-edit: apply edits without asking", keys: "Shift+Tab", run: () => cycleAutoMode("auto-edit") },
+        { title: "Auto: edits and commands without asking", keys: "Shift+Tab", run: () => cycleAutoMode("auto") },
+        { title: `Follow mode ${follow ? "off" : "on"}: jump to files Nou works on`, keys: "f", run: () => setFollow((f) => !f) },
+        { title: `Replay speed for follow mode: ${settings.followSpeed} (next: ${FOLLOW_SPEEDS[(FOLLOW_SPEEDS.indexOf(settings.followSpeed) + 1) % FOLLOW_SPEEDS.length]})`, keys: "settings", run: () => updateSettings({ followSpeed: FOLLOW_SPEEDS[(FOLLOW_SPEEDS.indexOf(settings.followSpeed) + 1) % FOLLOW_SPEEDS.length] }) },
+        { title: `Mouse ${settings.mouse ? "off (select text in the terminal)" : "on"}`, keys: "m", run: toggleMouse },
+        { title: "Copy the last reply", keys: "/copy", run: () => void runCommand("/copy") },
+        { title: "Copy the last code block", keys: "/copy code", run: () => void runCommand("/copy code") },
+        { title: "Copy the open file", keys: "/copy file", run: () => void runCommand("/copy file") },
+        { title: "Summarize the conversation to free up context", keys: "/compact", run: () => void runCommand("/compact") },
+        { title: "Start a fresh conversation", keys: "/clear", run: () => void runCommand("/clear") },
+        { title: "Download an Ollama model", keys: "/pull", run: () => typeCommand("/pull ") },
+        { title: "Plugins", keys: "/plugins", run: () => void runCommand("/plugins") },
+        { title: "Settings: model, engine, preferences, plugins", keys: "s", run: () => setView("settings") },
+        { title: "Reset the pane widths", keys: "=", run: () => {
+                setPaneWidths(null);
+                updateSettings({ paneWidths: null });
+            } },
+        { title: "Go to the chat", keys: "Tab · Esc", run: () => setFocus("chat") },
+        { title: "Go to the files", keys: "Tab", run: () => setFocus("tree") },
+        { title: "Go to the code", keys: "Tab", run: () => setFocus("code") },
+        { title: "All commands and keys", keys: "/help", run: () => void runCommand("/help") },
+        ...pluginCommands.map((c) => ({ title: `${c.description}`, keys: `/${c.name}`, run: () => typeCommand(`/${c.name} `) })),
+        { title: "Quit Nou", keys: "Ctrl+C ×2", run: quit },
+    ];
+    const mode = resizing
+        ? { label: "RESIZE", color: C.cyan }
+        : approval
+            ? { label: "APPROVE", color: C.yellow }
+            : showEditor ? { label: "EDIT", color: C.green }
+                : diff ? { label: "DIFF", color: C.accent2 }
+                    : busy ? { label: "WORKING", color: C.accent2 }
+                        : { label: focus.toUpperCase(), color: C.accent };
     // Shortcuts for the status bar, most useful first; the ones that don't fit are left out (all of them are in /help).
-    const hints = approval && !(showEditor && focus === "code")
-        ? [["y", "accept"], ["n", "reject"], ...(pendingChange && diff !== pendingChange ? [["o", "show the edit"]] : []), ["Esc", "stop"], ["Shift+Tab", "auto mode"]]
-        : showEditor && focus === "code"
-            ? editorState?.selection
-                ? [["Ctrl+C", "copy"], ["Ctrl+X", "cut"], ["Tab", "indent"], ["Ctrl+/", "comment"], ["Esc", "deselect"]]
-                : [["Esc", "done"], ["Ctrl+S", settings.autoSave === "off" ? "save" : "save (auto-save on)"], ["Ctrl+Z", "undo"], ["Shift+→", "select"], ["Ctrl+F", "find"], ["Ctrl+/", "comment"], ["/help", "all keys"]]
-            : focus === "chat"
-                ? busy
-                    ? [["Esc", "stop"], ["Shift+↑↓", "scroll"], ["Tab", "next pane"]]
-                    : [["Enter", "send"], ["/", "commands"], ["Tab", "next pane"], ["Ctrl+P", "find file"], ["Shift+↑↓", "scroll"]]
-                : focus === "tree"
-                    ? [["Enter", "open"], ["e", "edit"], ["/", "command"], ["c", "changes"], ["Ctrl+P", "find"], ["u", "undo"], ["p", "problems"], ["< >", "resize"], ["m", "select text"], ["s", "settings"]]
-                    : diff
-                        ? [["Esc", "close diff"], ["n/N", "next/prev change"], ...(diffMode === "session" ? [["[ ]", "prev/next file"]] : []), ["v", "cycle diff"]]
-                        : [["double-click/e", "edit"], ["v", "diff"], ["u", "undo"], ["/", "command"], ["p", "problems"], ["< >", "resize"], ["m", "select text"], ["s", "settings"]];
-    const statusUsed = mode.label.length + 2 + autoMode.length + 2 + 10 + ` ✖ ${totals.errors} ▲ ${totals.warnings} `.length + (checking.length ? 4 + checking.join(", ").length : 0) + 2;
+    const hints = resizing
+        ? [[`files ${treeWidth} · code ${codeWidth} · chat ${chatWidth}`, "columns"], ["release", "to keep it"], ["=", "reset"]]
+        : approval && !(showEditor && focus === "code")
+            ? [["y", "accept"], ["n", "reject"], ...(pendingChange && diff !== pendingChange ? [["o", "show the edit"]] : []), ["Esc", "stop"], ["Shift+Tab", "auto mode"]]
+            : showEditor && focus === "code"
+                ? editorState?.selection
+                    ? [["Ctrl+C", "copy"], ["Ctrl+X", "cut"], ["Tab", "indent"], ["Ctrl+/", "comment"], ["Esc", "deselect"]]
+                    : [["Esc", "done"], ["Ctrl+S", settings.autoSave === "off" ? "save" : "save (auto-save on)"], ["Ctrl+Z", "undo"], ["Shift+→", "select"], ["Ctrl+F", "find"], ["Ctrl+/", "comment"], ["/help", "all keys"]]
+                : focus === "chat"
+                    ? chatMenu ? [["↑↓", "choose"], ["Tab", "complete"], ["Enter", "run"], ["Esc", "close"]]
+                        : busy
+                            ? [["Esc", "stop"], ["Shift+↑↓", "scroll"], ["Tab", "next pane"]]
+                            : [["Enter", "send"], ["/", "commands"], ["Tab", "next pane"], ["Ctrl+P", "find file"], ["Shift+↑↓", "scroll"]]
+                    : focus === "tree"
+                        ? [["Enter", "open"], ["e", "edit"], ["/", "command"], ["c", "changes"], ["Ctrl+P", "find"], ["u", "undo"], ["p", "problems"], ["< >", "resize"], ["m", "select text"], ["s", "settings"]]
+                        : diff
+                            ? [["Esc", "close diff"], ["n/N", "next/prev change"], ...(diffMode === "session" ? [["[ ]", "prev/next file"]] : []), ["v", "cycle diff"]]
+                            : [["double-click/e", "edit"], ["Ctrl+F", "find"], ["v", "diff"], ...(recent.length > 1 ? [["b", "back"]] : []), ["u", "undo"], ["/", "command"], ["p", "problems"], ["< >", "resize"], ["m", "select text"], ["s", "settings"]];
+    const followChip = follow ? ` ◉ follow${followLag ? ` ·${followLag}` : ""} ` : " ○ follow ";
+    const statusUsed = mode.label.length + 2 + autoMode.length + 2 + followChip.length + ` ✖ ${totals.errors} ▲ ${totals.warnings} `.length + (checking.length ? 4 + checking.join(", ").length : 0) + 2;
     const shownHints = [];
     for (let used = statusUsed, i = 0; i < hints.length; i++) {
         used += hints[i][0].length + hints[i][1].length + 4;
@@ -1180,12 +1927,47 @@ ${snippet}
             break;
         shownHints.push(hints[i]);
     }
-    return (_jsxs(Box, { flexDirection: "column", width: columns, height: rows, children: [_jsx(Header, { width: columns, branch: branch, changes: git.size, model: agentRef.current.id === "nou" ? describe(choice) : `${engineInfo(agentRef.current.id).label} · ${engineInfo(agentRef.current.id).model(choice)}`, local: choice.provider.local, busy: busy, update: update }), _jsxs(Box, { flexDirection: "row", height: height, children: [_jsx(FileTree, { width: treeWidth, height: height, focused: focus === "tree", openFile: openFile, reveal: reveal, version: treeVersion, changed: edited, git: git, problemCounts: problemCounts, wheel: wheelFor("tree"), scrollTo: scrollFor("tree"), click: treeClick, onOpen: onTreeOpen, onHover: onTreeHover }), codePanel === "problems" && !pendingChange ? (_jsx(ProblemsView, { width: codeWidth, height: height, focused: focus === "code", problems: diagnostics.all(), checking: checking, wheel: wheelFor("code"), onJump: onJump, onClose: onCloseProblems })) : showEditor ? (_jsx(Editor, { width: codeWidth, height: height, focused: focus === "code", filePath: openFile, initial: draft.current?.path === openFile ? draft.current.text : content, baseline: draft.current?.path === openFile ? draft.current.baseline : content, startLine: editorStart.line, ...(editorStart.col ? { startCol: editorStart.col } : {}), problems: fileProblems, autoSave: settings.autoSave, syntaxVersion: syntaxVersion, wheel: wheelFor("code"), scrollTo: scrollFor("code"), mouse: editorMouse, onHover: onEditorHover, onDefinition: onEditorDefinition, onSave: onEditorSave, onExit: onEditorExit, onState: onEditorState }, `${openFile}:${editorStart.nonce}`)) : (_jsx(CodeView, { width: codeWidth, height: height, focused: focus === "code", filePath: openFile, content: content, diff: diff, diffLabel: diffMode === "git" ? "vs HEAD" : diffMode === "session" ? sessionView?.label ?? "this session" : "Nou's edit", pending: !!pendingChange && diff === pendingChange, marked: record?.lines ?? NO_LINES, problems: fileProblems, focusLine: focusLine, syntaxVersion: syntaxVersion, diffNote: pendingChange && diff === pendingChange ? pendingNote?.short ?? (checking.length ? "checking…" : null) : null, wheel: wheelFor("code"), scrollTo: scrollFor("code"), onViewport: onViewport })), _jsx(Chat, { width: chatWidth, height: height, focused: focus === "chat", entries: entries, streaming: streaming, busy: busy, approval: approval?.request ?? null, approvalNote: pendingChange ? pendingNote?.detail ?? null : null, contextChip: contextChip, wheel: wheelFor("chat"), scrollTo: scrollFor("chat"), prefill: chatPrefill, onSubmit: onSend, onAnswer: onAnswer })] }), _jsx(Box, { children: _jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { backgroundColor: mode.color, color: "black", bold: true, children: ` ${mode.label} ` }), _jsx(Text, { backgroundColor: C.panel, color: autoMode === "ask" ? C.dim : C.orange, bold: autoMode !== "ask", children: ` ${autoMode === "ask" ? "ask" : autoMode} ` }), _jsx(Text, { backgroundColor: C.panel, color: follow ? C.green : C.dim, children: follow ? " ◉ follow " : " ○ follow " }), _jsx(Text, { backgroundColor: C.panel, color: totals.errors ? C.red : C.dim, children: ` ✖ ${totals.errors}` }), _jsx(Text, { backgroundColor: C.panel, color: totals.warnings ? C.yellow : C.dim, children: ` ▲ ${totals.warnings} ` }), checking.length > 0 && _jsxs(Text, { color: C.accent2, children: [" \u27F3 ", checking.join(", ")] }), exitArmed
+    // The status bar and the header can be clicked: what each part shows, it does.
+    const hintAction = {
+        y: () => answer(true), n: approval ? () => answer(false) : undefined, o: openPending,
+        "Shift+Tab": () => cycleAutoMode(), "/": () => typeCommand("/"), "Ctrl+P": () => setQuickOpen(""),
+        Tab: () => setFocus((f) => FOCUS_ORDER[(FOCUS_ORDER.indexOf(f) + 1) % FOCUS_ORDER.length]),
+        e: startEditing, "double-click/e": startEditing, b: goBack, "Ctrl+F": showEditor ? undefined : startFind, v: cycleDiff, u: undoLast, p: toggleProblems, m: toggleMouse,
+        s: () => setView("settings"), "/help": () => void runCommand("/help"),
+        Esc: busy ? stop : diff && !showEditor ? () => setDiffMode("off") : undefined,
+    };
+    const zones = [];
+    {
+        let x = ` ${mode.label} `.length;
+        const add = (width, run) => {
+            if (run)
+                zones.push({ from: x, to: x + width, run });
+            x += width;
+        };
+        add(` ${autoMode} `.length, () => cycleAutoMode());
+        add(followChip.length, () => setFollow((f) => !f));
+        add(` ✖ ${totals.errors} ▲ ${totals.warnings} `.length, toggleProblems);
+        if (checking.length)
+            add(3 + checking.join(", ").length);
+        if (!exitArmed) {
+            shownHints.forEach(([key, label], i) => {
+                add(i === 0 ? 2 : 3);
+                add(key.length + 1 + label.length, hintAction[key]);
+            });
+        }
+    }
+    const modelLabel = agentRef.current.id === "nou" ? describe(choice) : `${engineInfo(agentRef.current.id).label} · ${engineInfo(agentRef.current.id).model(choice)}`;
+    clickable.current = { status: zones, modelFrom: columns - (" ⌂ LOCAL ".length + ` ${modelLabel} `.length + 1) };
+    return (_jsxs(Box, { flexDirection: "column", width: columns, height: rows, children: [_jsx(Header, { width: columns, branch: branch, changes: git.size, model: modelLabel, local: choice.provider.local, busy: busy, update: update }), _jsxs(Box, { flexDirection: "row", height: height, children: [_jsx(FileTree, { width: treeWidth, height: heights.tree, focused: focus === "tree", openFile: openFile, reveal: reveal, version: treeVersion, changed: edited, working: working, git: git, problemCounts: problemCounts, wheel: wheelFor("tree"), scrollTo: scrollFor("tree"), click: treeClick, onOpen: onTreeOpen, onHover: onTreeHover }), codePanel === "problems" && !pendingChange ? (_jsx(ProblemsView, { width: codeWidth, height: heights.code, focused: focus === "code", problems: diagnostics.all(), checking: checking, wheel: wheelFor("code"), onJump: onJump, onClose: onCloseProblems })) : showEditor ? (_jsx(Editor, { ...(tabStrip ? { tabs: tabStrip } : {}), width: codeWidth, height: heights.code, focused: focus === "code", filePath: openFile, initial: draft.current?.path === openFile ? draft.current.text : content, baseline: draft.current?.path === openFile ? draft.current.baseline : content, startLine: editorStart.line, ...(editorStart.col ? { startCol: editorStart.col } : {}), problems: fileProblems, autoSave: settings.autoSave, syntaxVersion: syntaxVersion, wheel: wheelFor("code"), scrollTo: scrollFor("code"), mouse: editorMouse, onHover: onEditorHover, onDefinition: onEditorDefinition, onSave: onEditorSave, onExit: onEditorExit, onState: onEditorState }, `${openFile}:${editorStart.nonce}`)) : (_jsx(CodeView, { ...(tabStrip && !diff ? { tabs: tabStrip } : {}), width: codeWidth, height: heights.code, focused: focus === "code", filePath: openFile, content: content, diff: diff, diffLabel: diffMode === "git" ? "vs HEAD" : diffMode === "session" ? sessionView?.label ?? "this session" : "Nou's edit", pending: !!pendingChange && diff === pendingChange, marked: record?.lines ?? NO_LINES, problems: fileProblems, focusLine: focusLine, syntaxVersion: syntaxVersion, diffNote: pendingChange && diff === pendingChange ? pendingNote?.short ?? (checking.length ? "checking…" : null) : null, wheel: wheelFor("code"), scrollTo: scrollFor("code"), onViewport: onViewport, defineAt: codeDefine, onDefine: onCodeDefine, onFinding: onCodeFinding, findRequest: findRequest })), _jsx(Chat, { width: chatWidth, height: heights.chat, focused: focus === "chat", entries: entries, streaming: streaming, busy: busy, approval: approval?.request ?? null, approvalNote: pendingChange ? pendingNote?.detail ?? null : null, contextChip: contextChip, wheel: wheelFor("chat"), scrollTo: scrollFor("chat"), prefill: chatPrefill, extraCommands: pluginCommands, onMenu: onChatMenu, onSubmit: onSend, queued: queued, onAnswer: onAnswer, click: chatClick, select: chatSelect, onOpenRef: openRef })] }), _jsx(Box, { children: _jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { backgroundColor: mode.color, color: "black", bold: true, children: ` ${mode.label} ` }), _jsx(Text, { backgroundColor: C.panel, color: autoMode === "ask" ? C.dim : C.orange, bold: autoMode !== "ask", children: ` ${autoMode === "ask" ? "ask" : autoMode} ` }), _jsx(Text, { backgroundColor: C.panel, color: follow ? C.green : C.dim, children: followChip }), _jsx(Text, { backgroundColor: C.panel, color: totals.errors ? C.red : C.dim, children: ` ✖ ${totals.errors}` }), _jsx(Text, { backgroundColor: C.panel, color: totals.warnings ? C.yellow : C.dim, children: ` ▲ ${totals.warnings} ` }), checking.length > 0 && _jsxs(Text, { color: C.accent2, children: [" \u27F3 ", checking.join(", ")] }), exitArmed
                             ? _jsxs(Text, { color: C.yellow, bold: true, children: ["  ", "Press again to quit", draft.current && settings.autoSave === "off" ? ` (unsaved changes in ${draft.current.path} will be lost)` : ""] })
-                            : shownHints.map(([key, action], i) => (_jsxs(Text, { children: [i === 0 ? "  " : _jsx(Text, { color: C.dim, children: " \u00B7 " }), _jsx(Text, { color: C.text, children: key }), _jsxs(Text, { color: C.dim, children: [" ", action] })] }, key)))] }) }), quickOpen && (_jsx(QuickOpen, { width: columns, top: 3, files: allFiles, onPick: (file) => {
-                    setQuickOpen(false);
+                            : shownHints.map(([key, action], i) => (_jsxs(Text, { children: [i === 0 ? "  " : _jsx(Text, { color: C.dim, children: " \u00B7 " }), _jsx(Text, { color: C.text, children: key }), _jsxs(Text, { color: C.dim, children: [" ", action] })] }, key)))] }) }), layout.current.terminal && shellRef.current && (_jsx(Box, { position: "absolute", marginLeft: layout.current.terminal.x, marginTop: layout.current.terminal.y, children: _jsx(Terminal, { shell: shellRef.current, version: termVersion, width: layout.current.terminal.width, height: layout.current.terminal.height, focused: focus === "terminal", wheel: wheelFor("terminal"), onLeave: leaveTerminal }) })), layout.current.game && (_jsx(Box, { position: "absolute", marginLeft: layout.current.game.x, marginTop: layout.current.game.y, children: _jsx(GamePanel, { width: layout.current.game.width, height: layout.current.game.height, focused: focus === "game", moving: !!gameDrag, installed: settings.games, onLeave: leaveGames, onOpenSettings: gamesSettings }) })), quickOpen !== null && (_jsx(QuickOpen, { width: columns, top: 3, files: allFiles, recent: recent, actions: paletteActions, initialQuery: quickOpen, onPick: (file) => {
+                    setQuickOpen(null);
+                    clearFollow();
                     open(file);
                     setReveal(file);
                     setFocus("code");
-                }, onClose: () => setQuickOpen(false) }))] }));
+                }, onRun: (action) => {
+                    setQuickOpen(null);
+                    action.run();
+                }, onClose: () => setQuickOpen(null) }))] }));
 }