windows-development-sandbox 1.5.0 → 1.9.0

package/dist/cli/menu/pages/agents-page.js

@@ -0,0 +1,345 @@
+// Section 1: the agents. "Start" lists the agents you can start here (Enter starts one) after "Repeat last", and ends
+// with "Add an agent…" (the new one appears in the list); "Options" holds how a start goes (attach, window, folder) and
+// the other ways to start; "On this PC" has the not-sandboxed entries while agent commands are on.
+import fs from 'node:fs';
+import path from 'node:path';
+import { DEFAULTS } from '../../../core/config/index.js';
+import { errMsg } from '../../../core/util/index.js';
+import { commandLine, readHistory } from '../../history.js';
+import { AgentCommandsService } from '../../services/index.js';
+import { commandSpec } from '../../manifest.js';
+import { Text, Theme, } from '../../tui/index.js';
+import { AddAgent, makeDefaultAgent, removeAgent } from '../add-agent.js';
+import { CommandForm } from '../command-form.js';
+import { askPath } from '../settings/ask-path.js';
+import { SeveralAgents } from '../several.js';
+import { ListPage } from './list-page.js';
+/** The agents of `harnesses` that are not built in. Pure. */
+export function addedAgents(names) {
+    return names.filter((n) => !(n in DEFAULTS.harnesses));
+}
+const agentOf = (id) => (id.startsWith('agent:') ? id.slice(6) : undefined);
+/** The keys of the Start category: make an agent the default, remove one you added. Pure. */
+export function agentActions(m) {
+    const isOther = (id) => {
+        const name = agentOf(id);
+        return name !== undefined && name !== m.defaultAgent;
+    };
+    return [
+        { key: 'd', label: 'make default', importance: 1, applies: isOther },
+        {
+            key: 'x',
+            label: 'remove',
+            importance: 1,
+            applies: (id) => isOther(id) && (m.removable ?? []).includes(agentOf(id) ?? ''),
+        },
+    ];
+}
+/**
+ * The "not sandboxed" entries: only while agent commands are on (typing the agent then starts the sandbox, so a way to
+ * run the real one is needed), one per agent found installed on this PC.
+ */
+export function hostAgentsToShow(enabled, found) {
+    return enabled ? found.map((a) => a.harness) : [];
+}
+const WINDOW_TEXT = { config: 'as configured', hide: 'hidden', show: 'shown' };
+/** The command line a start stands for. Pure. */
+export function startArgv(m, agent, cwd) {
+    return [
+        'launch',
+        '--harness',
+        agent,
+        ...(m.attach ? ['--terminal'] : []),
+        ...(m.window === 'hide' ? ['--headless'] : m.window === 'show' ? ['--window'] : []),
+        ...(path.resolve(m.folder).toLowerCase() === path.resolve(cwd).toLowerCase() ? [] : ['--workspace', m.folder]),
+    ];
+}
+/** The categories of the agents section; "On this PC" only when there is something in it. Pure. */
+export function agentCategories(m) {
+    return [
+        {
+            id: 'start',
+            label: 'Start',
+            description: 'Agents you can start in ' + m.folder + '. Add an agent at the end of the list.',
+        },
+        { id: 'options', label: 'Options', description: 'How a start goes, and the other ways to start.' },
+        ...(m.hostAgents.length
+            ? [
+                {
+                    id: 'host',
+                    label: 'On this PC',
+                    description: 'The real agents on this PC, with no sandbox around them.',
+                },
+            ]
+            : []),
+    ];
+}
+/** The list for the agents section. Pure. */
+export function agentsOptions(m, cwd = process.cwd()) {
+    const section = 'Start in ' + path.basename(m.folder);
+    const agents = [...m.agents].sort((a, b) => Number(b.name === m.defaultAgent) - Number(a.name === m.defaultAgent));
+    return {
+        path: [],
+        categories: agentCategories(m),
+        items: [
+            ...(m.last
+                ? [
+                    {
+                        value: 'repeat',
+                        label: 'Repeat last',
+                        category: 'start',
+                        section: 'Quick start',
+                        hint: Theme.muted(Text.truncate(commandLine(m.last), 50)),
+                        description: 'Runs the last command again.',
+                    },
+                ]
+                : []),
+            ...agents.map((a) => ({
+                value: 'agent:' + a.name,
+                label: a.name,
+                category: 'start',
+                section,
+                hint: (a.name === m.defaultAgent ? Theme.accent('default  ') : '') +
+                    (a.ready ? Theme.ok('ready') : Theme.muted('installs on first start')),
+                description: 'Starts ' +
+                    a.name +
+                    ' in ' +
+                    path.basename(m.folder) +
+                    '.' +
+                    (a.name === m.defaultAgent ? ' It is the default agent.' : '') +
+                    ((m.removable ?? []).includes(a.name) && a.name !== m.defaultAgent
+                        ? ' You added it: x removes it.'
+                        : (m.removable ?? []).includes(a.name)
+                            ? ' You added it. Make another agent the default to remove it.'
+                            : ''),
+                details: [Theme.muted('Command  ') + commandLine(startArgv(m, a.name, cwd))],
+            })),
+            {
+                value: 'add',
+                label: 'Add an agent…',
+                category: 'start',
+                section,
+                description: 'Add another agent by its npm or Python package, or a program on this PC. It is saved in your settings and appears in this list.',
+            },
+            {
+                value: 'opt:attach',
+                label: 'Attach this terminal',
+                category: 'options',
+                section: 'This start',
+                hint: m.attach ? Theme.ok('yes') : Theme.muted('no'),
+                flip: true,
+                description: 'Shows the agent in this terminal (Ctrl+] detaches). Without it the agent runs in the sandbox.',
+            },
+            {
+                value: 'opt:window',
+                label: 'Sandbox window',
+                category: 'options',
+                section: 'This start',
+                hint: WINDOW_TEXT[m.window],
+                description: 'Hide or show the Windows Sandbox window (sbx-show brings a hidden one back).',
+            },
+            {
+                value: 'opt:folder',
+                label: 'Folder',
+                category: 'options',
+                section: 'This start',
+                hint: Text.middle(m.folder, 40),
+                description: 'The project folder to work on.',
+            },
+            {
+                value: 'more',
+                label: 'More start options…',
+                category: 'options',
+                section: 'Start differently',
+                description: 'Node and Python versions, databases, scripts and the rest of the start form.',
+            },
+            {
+                value: 'several',
+                label: 'Start several agents…',
+                category: 'options',
+                section: 'Start differently',
+                description: 'One or more projects, one or more agents each, all in one sandbox.',
+            },
+            {
+                value: 'noagent',
+                label: 'Sandbox without an agent…',
+                category: 'options',
+                section: 'Start differently',
+                description: 'Tools and databases only.',
+            },
+            ...m.hostAgents.map((agent) => ({
+                value: 'host:' + agent,
+                label: agent + ' (not sandboxed)',
+                category: 'host',
+                description: 'Runs the real ' + agent + ' on this PC, with no sandbox around it.',
+            })),
+        ],
+        enterLabel: (_category, id) => ENTER[id ?? ''] ?? (id?.startsWith('agent:') ? 'start' : id?.startsWith('host:') ? 'run' : 'open'),
+        actions: (category) => (category === 'start' ? agentActions(m) : []),
+    };
+}
+/** What Enter does on the rows that are not an agent. */
+const ENTER = {
+    repeat: 'run again',
+    add: 'add',
+    'opt:attach': 'switch',
+    'opt:window': 'change',
+    'opt:folder': 'choose',
+};
+export class AgentsPage extends ListPage {
+    ctx;
+    file;
+    draft;
+    label = 'Agents';
+    attach = false;
+    window = 'config';
+    folder = process.cwd();
+    model;
+    /** What load() looked up (programs on PATH, the history file): not asked again for every list that is built. */
+    facts;
+    constructor(app, ctx, 
+    /** Your own config file and its unsaved changes: where "Add an agent" writes to. */
+    file, draft) {
+        super(app);
+        this.ctx = ctx;
+        this.file = file;
+        this.draft = draft;
+    }
+    /** Every agent: the configured ones, and any added in Settings that is not saved yet. */
+    harnesses() {
+        const config = this.file.userConfig();
+        const staged = this.draft.has(this.file, ['harnesses'])
+            ? this.draft.value(this.file, ['harnesses'])
+            : undefined;
+        return { ...config.harnesses, ...staged };
+    }
+    /** Is this agent already in the sandbox's persistent storage (so starting it needs no install)? */
+    installed(name, harnesses) {
+        const h = harnesses[name];
+        const dir = path.join(this.ctx.dataPath, 'tools', 'agents', name);
+        return (Boolean(h) &&
+            [h.hostExecutable, h.npmBin && h.npmBin + '.cmd', h.uvBin && h.uvBin + '.exe'].some((f) => f && fs.existsSync(path.join(dir, f))));
+    }
+    current() {
+        const harnesses = this.harnesses();
+        if (!this.facts)
+            throw new Error('The agents tab was not loaded');
+        const { commands, last } = this.facts;
+        return {
+            folder: this.folder,
+            defaultAgent: this.file.userConfig().defaultHarness,
+            agents: Object.keys(harnesses).map((name) => ({ name, ready: this.installed(name, harnesses) })),
+            last,
+            attach: this.attach,
+            window: this.window,
+            hostAgents: hostAgentsToShow(commands.enabled, commands.found),
+            removable: addedAgents(Object.keys(harnesses)),
+        };
+    }
+    /** The cursor starts on the default agent. */
+    initialFocus() {
+        return 'agent:' + this.file.userConfig().defaultHarness;
+    }
+    async load() {
+        this.facts = {
+            commands: await new AgentCommandsService(this.ctx).statusAsync(),
+            last: readHistory()[0]?.argv,
+        };
+        this.model = this.current();
+    }
+    options() {
+        this.model = this.current();
+        return agentsOptions(this.model);
+    }
+    async act(result) {
+        if (result.kind === 'action')
+            return this.action(result.key, result.value);
+        if (result.kind !== 'pick')
+            return {};
+        const id = result.value;
+        const model = this.current();
+        if (id.startsWith('host:'))
+            return { exit: { kind: 'run', argv: ['host', id.slice(5)] } };
+        if (id.startsWith('agent:'))
+            return { exit: { kind: 'run', argv: startArgv(model, id.slice(6), process.cwd()) } };
+        switch (id) {
+            case 'repeat':
+                return model.last ? { exit: { kind: 'run', argv: model.last } } : {};
+            case 'add':
+                return this.add(model);
+            case 'opt:attach':
+                this.attach = !this.attach;
+                return {};
+            case 'opt:window':
+                this.window = this.window === 'config' ? 'hide' : this.window === 'hide' ? 'show' : 'config';
+                return {};
+            case 'opt:folder': {
+                const picked = await askPath(this.app, {
+                    path: ['Agents', 'Folder'],
+                    title: 'Choose the project folder',
+                    kind: 'dir',
+                    initial: this.folder,
+                    validate: (v) => (fs.existsSync(path.resolve(v)) ? true : 'That folder does not exist.'),
+                });
+                if (picked)
+                    this.folder = path.resolve(picked);
+                return {};
+            }
+            case 'more': {
+                const argv = await new CommandForm(this.app, this.ctx, commandSpec('launch'), startArgv(model, model.defaultAgent, process.cwd()).slice(1)).run();
+                return argv ? { exit: { kind: 'run', argv } } : {};
+            }
+            case 'several': {
+                const argv = await new SeveralAgents(this.app, this.ctx).run();
+                return argv ? { exit: { kind: 'run', argv } } : {};
+            }
+            case 'noagent': {
+                const argv = await new CommandForm(this.app, this.ctx, commandSpec('start')).run();
+                return argv ? { exit: { kind: 'run', argv } } : {};
+            }
+            default:
+                return {};
+        }
+    }
+    /** Make default (d) and Remove (x) on the highlighted agent. */
+    async action(key, id) {
+        const name = id?.startsWith('agent:') ? id.slice(6) : undefined;
+        if (!name)
+            return {};
+        try {
+            if (key === 'd') {
+                makeDefaultAgent(this.file, this.draft, name);
+                return { focus: id, notice: Theme.ok(Theme.glyph.ok + ' ' + name + ' is the default agent.') };
+            }
+            if (key !== 'x')
+                return {};
+            const ok = await this.app.ask('Remove ' + name + '?', ['It is taken out of your settings. Its files in the sandbox stay until you clean them up.'], 'Remove', true);
+            if (!ok)
+                return {};
+            removeAgent(this.file, this.draft, name);
+            return {
+                focus: 'agent:' + this.file.userConfig().defaultHarness,
+                notice: Theme.ok(Theme.glyph.ok + ' Removed ' + name + '.'),
+            };
+        }
+        catch (e) {
+            return { notice: Theme.error(Theme.glyph.cross + ' ' + errMsg(e)) };
+        }
+    }
+    /** "Add an agent…": the new agent shows in the list, with the cursor on it. */
+    async add(model) {
+        try {
+            const added = await new AddAgent(this.app, this.file, this.draft, model.agents.map((a) => a.name)).run();
+            if (!added)
+                return {};
+            return {
+                focus: 'agent:' + added.name,
+                notice: Theme.ok(Theme.glyph.ok + ' Added ' + added.name + '.') +
+                    Theme.muted(added.saved ? ' Enter starts it.' : ' Ctrl+S saves it.'),
+            };
+        }
+        catch (e) {
+            return { notice: Theme.error(Theme.glyph.cross + ' ' + errMsg(e)) };
+        }
+    }
+}

package/dist/cli/menu/pages/apps-page.d.ts

@@ -1,6 +1,6 @@
 import { type App, type ListOptions, type ListResult } from '../../tui/index.js';
 import { AppsModel } from '../apps.js';
-import type { ConfigFile } from '../settings/config-file.js';
+import type { ConfigFile } from '../../../app/features/settings/index.js';
 import type { Draft } from '../settings/draft.js';
 import { type Scope } from './scopes.js';
 import { ListPage, type Outcome } from './list-page.js';
@@ -22,5 +22,7 @@ export declare class AppsPage extends ListPage<string> {
     protected options(): ListOptions<string>;
     /** Every tick is staged as it happens, so leaving or saving always sees it. */
     protected afterKey(): Step<ShellExit>;
+    /** Opens the GitHub request form in the browser and says where it is. */
+    private request;
     protected act(result: ListResult<string>): Promise<Outcome<string>>;
 }

package/dist/cli/menu/pages/apps-page.js

@@ -1,8 +1,9 @@
-// Tab 4: the apps catalogue. Groups on the left, space ticks, and the ticks are staged until Ctrl+S saves them. Two
+// Section 4: the apps catalogue. Groups on the left, space ticks, and the ticks are staged until Ctrl+S saves them. Two
 // scopes like Settings: apps for every project, or for this project only.
 import { errMsg } from '../../../core/util/index.js';
 import { Theme } from '../../tui/index.js';
-import { AppsModel } from '../apps.js';
+import { openIssuePage } from '../../../host/web/index.js';
+import { AppsModel, requestAppUrl } from '../apps.js';
 import { ValueEditor } from '../settings/value-editor.js';
 import { SCOPES, scopeStatus } from './scopes.js';
 import { ListPage } from './list-page.js';
@@ -17,8 +18,10 @@ export function appsOptions(model, file, draft, scope) {
         enterTicks: true,
         categories: model.categories(),
         items: model.items(draft),
-        actions: file.isProject ? [] : [{ key: 'c', label: 'your own programs' }],
-        escapeLabel: 'quit',
+        actions: [
+            ...(file.isProject ? [] : [{ key: 'c', label: 'your own programs' }]),
+            { key: 'r', label: 'request an app' },
+        ],
     };
 }
 export class AppsPage extends ListPage {
@@ -51,12 +54,25 @@ export class AppsPage extends ListPage {
         this.model.stageTicks(this.draft, this.ticked());
         return;
     }
+    /** Opens the GitHub request form in the browser and says where it is. */
+    request() {
+        const url = requestAppUrl();
+        try {
+            openIssuePage(url);
+            return Theme.ok(Theme.glyph.ok + ' Opened the request form in your browser: ') + Theme.muted(url);
+        }
+        catch (e) {
+            return Theme.error(Theme.glyph.cross + ' ' + errMsg(e)) + Theme.muted('  Open it yourself: ' + url);
+        }
+    }
     async act(result) {
         this.model.stageTicks(this.draft, this.ticked());
         if (result.kind === 'tab') {
             this.scope = SCOPES[result.index].scope;
             return {};
         }
+        if (result.kind === 'action' && result.key === 'r')
+            return { notice: this.request() };
         if (result.kind !== 'action' || result.key !== 'c')
             return {};
         const node = this.file.schema.child('apps')?.child('custom');

package/dist/cli/menu/pages/list-page.d.ts

@@ -1,4 +1,4 @@
-import { type App, type FrameParts, type Key, type ListOptions, type ListResult } from '../../tui/index.js';
+import { type App, type Category, type FrameParts, type Key, type ListOptions, type ListResult } from '../../tui/index.js';
 import type { Size, Step } from '../../tui/index.js';
 import type { Page, ShellExit } from '../shell.js';
 /** What an action did: leave the shell, and/or what the rebuilt list shows. */
@@ -16,19 +16,59 @@ export declare abstract class ListPage<T> implements Page {
     readonly stages: boolean;
     private list;
     private notice;
+    /** The list has the keyboard (the menu's navigation does not). */
+    private focused;
+    /** The entry that was last acted on: the cursor returns to it when the section opens again. */
+    private lastFocus;
+    /** A search to start the next list with (restored from the last run); used once. */
+    private pendingQuery;
+    /** The data has arrived at least once (until then the list is "Loading…"). */
+    private loaded;
+    /** Counts loads, so that a slow one that was overtaken does not replace newer data. */
+    private generation;
+    /** A category asked for before the data arrived: it opens when it does. */
+    private wantedCategory;
     constructor(app: App);
     /** Loads the data the list shows (called when the tab opens and after actions that change it). */
     protected abstract load(): Promise<void>;
     /** The list for the data loaded (pure: no I/O). */
     protected abstract options(): ListOptions<T>;
+    /** The entry the cursor starts on the first time the section opens (default: the first). */
+    protected initialFocus(): T | undefined;
     /** Does what the list returned. */
     protected abstract act(result: ListResult<T>): Promise<Outcome<T>>;
+    /** The data has not arrived yet (the tab shows "Loading…"). */
+    get loading(): boolean;
     get capturing(): boolean;
-    /** The id of the open sidebar category, if the list has one. */
-    protected get category(): string | undefined;
+    /** The id of the open category, if the list has any. */
+    get category(): string | undefined;
+    /** The search typed in the list ('' when none). */
+    get search(): string;
+    /** Shows the list with this search typed (the menu opens on the search it was left on). */
+    restoreSearch(text: string): void;
+    categories(): readonly Category[];
+    selectCategory(id: string): Promise<void>;
+    setFocus(list: boolean): void;
+    /** The list on screen, built when there is none yet. */
+    private screen;
+    /** A list from the current data; its categories are shown by the menu's navigation. */
+    private build;
     /** The entries ticked in a multi-select list. */
     protected ticked(): T[];
+    /** Loads the data again; a slow load does not hold up the keys (the tab keeps what it showed, then updates). */
     open(): Promise<void>;
+    /**
+     * Loads the data and waits for it at most QUICK_LOAD_MS. In time, the list is built here (`build`) or by the caller;
+     * later, the list is built when the data arrives, on the entry and search the user has moved to meanwhile.
+     */
+    private reload;
+    private loadData;
+    /** Back on the entry used last, when it is still in the category that is open. */
+    private rebuildOpened;
+    /** Data that came after the keys stopped waiting: the cursor and the search stay where the user moved them. */
+    private rebuildLate;
+    private rebuildOn;
+    private openWantedCategory;
     /** Builds the list again, on `focus` when it is still there. */
     protected rebuild(focus: T | undefined, notice?: string): void;
     /** Shows `text` now, before slow work starts. */

package/dist/cli/menu/pages/list-page.js

@@ -1,33 +1,164 @@
 // The common shape of a tab that is a list: it loads its data, builds a list screen from it, and acts on what the list
-// returns. After every action the list is built again from fresh data, on the same entry.
-import { ListScreen } from '../../tui/index.js';
+// returns. After every action the list is built again from fresh data, on the same entry. Opening a tab never makes
+// the keys wait for a slow load: after a moment the tab shows "Loading…" (or the data it had), and the list is built
+// when the data is there.
+import { ListScreen, } from '../../tui/index.js';
+import { errMsg } from '../../../core/util/index.js';
+import { Theme } from '../../tui/index.js';
+/** A tab whose data is not here after this long shows "Loading…" instead of holding up the keys. */
+const QUICK_LOAD_MS = 120;
+/** What a tab shows before its data has arrived. */
+function loadingOptions() {
+    return { path: [], items: [], empty: 'Loading…' };
+}
 export class ListPage {
     app;
     stages = false;
     list;
     notice;
+    /** The list has the keyboard (the menu's navigation does not). */
+    focused = true;
+    /** The entry that was last acted on: the cursor returns to it when the section opens again. */
+    lastFocus;
+    /** A search to start the next list with (restored from the last run); used once. */
+    pendingQuery;
+    /** The data has arrived at least once (until then the list is "Loading…"). */
+    loaded = false;
+    /** Counts loads, so that a slow one that was overtaken does not replace newer data. */
+    generation = 0;
+    /** A category asked for before the data arrived: it opens when it does. */
+    wantedCategory;
     constructor(app) {
         this.app = app;
     }
+    /** The entry the cursor starts on the first time the section opens (default: the first). */
+    initialFocus() {
+        return undefined;
+    }
+    /** The data has not arrived yet (the tab shows "Loading…"). */
+    get loading() {
+        return !this.loaded;
+    }
     get capturing() {
         return this.list?.isSearching ?? false;
     }
-    /** The id of the open sidebar category, if the list has one. */
+    /** The id of the open category, if the list has any. */
     get category() {
         return this.list?.currentCategory;
     }
+    /** The search typed in the list ('' when none). */
+    get search() {
+        return this.list?.searchText ?? '';
+    }
+    /** Shows the list with this search typed (the menu opens on the search it was left on). */
+    restoreSearch(text) {
+        this.pendingQuery = text;
+        if (this.loaded)
+            this.rebuild(undefined);
+    }
+    categories() {
+        return this.screen().categories;
+    }
+    async selectCategory(id) {
+        if (!this.loaded) {
+            this.wantedCategory = id;
+            return;
+        }
+        this.screen().setCategory(id);
+        await this.afterKey();
+    }
+    setFocus(list) {
+        this.focused = list;
+        this.list?.setActive(list);
+    }
+    /** The list on screen, built when there is none yet. */
+    screen() {
+        return (this.list ??= this.build({}));
+    }
+    /** A list from the current data; its categories are shown by the menu's navigation. */
+    build(extra) {
+        const startQuery = this.pendingQuery;
+        this.pendingQuery = undefined;
+        const list = new ListScreen({
+            ...(this.loaded ? this.options() : loadingOptions()),
+            startQuery,
+            ...extra,
+            categoryNav: 'external',
+            escapeLabel: 'sections',
+        });
+        list.setActive(this.focused);
+        return list;
+    }
     /** The entries ticked in a multi-select list. */
     ticked() {
         return this.list?.ticked() ?? [];
     }
+    /** Loads the data again; a slow load does not hold up the keys (the tab keeps what it showed, then updates). */
     async open() {
-        await this.load();
-        this.rebuild(undefined);
+        await this.reload(true);
+    }
+    /**
+     * Loads the data and waits for it at most QUICK_LOAD_MS. In time, the list is built here (`build`) or by the caller;
+     * later, the list is built when the data arrives, on the entry and search the user has moved to meanwhile.
+     */
+    async reload(build) {
+        const mine = ++this.generation;
+        let late = false;
+        let timer;
+        const quick = new Promise((resolve) => {
+            timer = setTimeout(() => {
+                late = true;
+                resolve();
+            }, QUICK_LOAD_MS);
+        });
+        const arrived = this.loadData().then(() => {
+            if (mine !== this.generation)
+                return;
+            this.loaded = true;
+            if (late)
+                this.rebuildLate();
+            else if (build)
+                this.rebuildOpened();
+        });
+        await Promise.race([arrived, quick]);
+        clearTimeout(timer);
+    }
+    async loadData() {
+        try {
+            await this.load();
+        }
+        catch (e) {
+            this.say(Theme.error(Theme.glyph.cross + ' ' + errMsg(e)));
+        }
+    }
+    /** Back on the entry used last, when it is still in the category that is open. */
+    rebuildOpened() {
+        this.rebuildOn(this.lastFocus ?? this.initialFocus());
+        this.openWantedCategory();
+    }
+    /** Data that came after the keys stopped waiting: the cursor and the search stay where the user moved them. */
+    rebuildLate() {
+        if (this.list)
+            this.pendingQuery ??= this.list.searchText || undefined;
+        this.rebuildOn(this.list?.current);
+        this.openWantedCategory();
+        this.app.requestRedraw();
+    }
+    rebuildOn(wanted) {
+        const open = this.list?.currentCategory;
+        const item = wanted === undefined ? undefined : this.options().items.find((i) => i.value === wanted);
+        this.rebuild(item && (!open || !item.category || item.category === open) ? wanted : undefined);
+    }
+    openWantedCategory() {
+        if (!this.wantedCategory)
+            return;
+        this.list?.setCategory(this.wantedCategory);
+        this.wantedCategory = undefined;
     }
     /** Builds the list again, on `focus` when it is still there. */
     rebuild(focus, notice) {
         const startCategory = this.list?.currentCategory;
-        this.list = new ListScreen({ ...this.options(), startAt: focus, startCategory, notice: notice ?? this.notice });
+        this.list = this.build({ startAt: focus, startCategory, notice: notice ?? this.notice });
         this.notice = undefined;
     }
     /** Shows `text` now, before slow work starts. */
@@ -40,21 +171,24 @@ export class ListPage {
         this.notice = text;
     }
     render(size) {
-        this.list ??= new ListScreen(this.options());
-        return this.list.render(size);
+        return this.screen().render(size);
     }
     async handle(key) {
-        this.list ??= new ListScreen(this.options());
-        const step = this.list.handle(key);
+        const step = this.screen().handle(key);
         if (!step)
             return this.afterKey();
         const result = step.done;
         const outcome = result.kind === 'back' ? { exit: { kind: 'quit' } } : await this.act(result);
         if (outcome.exit)
             return { done: outcome.exit };
-        if (outcome.reload)
-            await this.load();
+        // What the action changed (a stop, a restart) is known to the menu before the page loads again. An action that
+        // loads nothing again changed nothing the menu shows, so the keys do not wait for it.
+        if (outcome.reload) {
+            await this.app.afterAction();
+            await this.reload(false);
+        }
         const here = result.kind === 'pick' || result.kind === 'action' ? result.value : undefined;
+        this.lastFocus = outcome.focus ?? here ?? this.lastFocus;
         this.rebuild(outcome.focus ?? here, outcome.notice);
         return;
     }