@d3ara1n/pi-command-palette 0.6.0 → 0.7.0

package/README.md

@@ -34,17 +34,16 @@ Or add to `~/.pi/agent/settings.json`:
 |----------|--------|
 | `Ctrl+Shift+P` _(default, configurable)_ | Open command palette |
 
-The palette opens as a single macOS-launcher-style overlay with nested pages. Selecting a category with **Enter** replaces the current list in the same overlay instead of opening a second overlay. Press **Backspace** with an empty search field to return to the parent page; press **Esc** to close the palette immediately.
+The palette opens as a single macOS-launcher-style overlay with nested pages. The root page mixes leaves and sub-pages: built-in actions and the model selector sit directly on the root, while the remaining categories open as sub-pages — selecting one with **Enter** replaces the current list in the same overlay instead of opening a second overlay. Press **Backspace** with an empty search field to return to the parent page; press **Esc** to close the palette immediately.
 
-The palette lists:
+The root page lists:
 
-- **Built-in Actions** — curated shortcuts for common operations (detailed below)
-- **Extension Actions** — entries registered by other extensions that run a callback directly (see below)
-- **Commands** — all registered `/command` entries
-- **Skills** — installed skill commands
-- **Templates** — prompt templates
+- **Built-in actions** — curated shortcuts for common operations, shown directly on the root page so urgent entries like Restore never hide behind a sub-page (detailed below)
+- **Models** — a sub-page listing every model with a configured API key (see below)
+- **Extension Actions** — a sub-page of entries registered by other extensions that run a callback directly (see below)
+- **Commands** / **Skills** / **Templates** — sub-pages for all registered `/command` entries, installed skills, and prompt templates; entries are labeled with their bare `/name` since the breadcrumb already names the category
 
-Use **↑/↓** to move through entries and **←/→** to edit the search cursor. Search is fuzzy within the current page and updates as you type; Backspace uses the normal text-editing behavior while the query is non-empty.
+Use **↑/↓** to move through entries and **←/→** to edit the search cursor. Search is fuzzy within the current page and updates as you type; searching the root page also matches entries from every sub-page, with each match's category shown next to its description. Backspace uses the normal text-editing behavior while the query is non-empty.
 
 ### Built-in actions
 
@@ -54,7 +53,6 @@ Built-in actions are grouped by how they run:
 
 | Action | What it does |
 |--------|--------------|
-| Model: Switch Model | Open a model selector overlay; switch instantly |
 | Session: Compact | Compact the conversation right away |
 | Editor: Copy Content | Copy current editor text to the clipboard |
 | Editor: Clear Content | Clear the editor, saving the current text to the restore buffer |
@@ -95,7 +93,7 @@ When a command replaces your editor text, or you run **Editor: Clear Content**,
 
 ### Model selector
 
-The "Model: Switch Model" entry opens a model page inside the same overlay. Models are loaded when the page is first entered, then can be searched and selected without stacking another overlay.
+The "Models" entry opens a model page inside the same overlay. Models are loaded when the page is first entered, then can be searched and selected without stacking another overlay.
 
 **Scoped models float to the top**, marked with a ★ (favorite) prefix. "Scoped" here means the same set pi uses for its built-in selector's scoped tab and `Ctrl+P` cycling — the `enabledModels` patterns in your `settings.json` (project `.pi/settings.json` overrides global `~/.pi/agent/settings.json`). Everything else follows alphabetically. Filtering preserves that boundary too — scoped matches stay above the rest while you type, rather than collapsing into one score-ordered list. If no scope is configured, the list is a plain alphabetical roster — nothing breaks.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@d3ara1n/pi-command-palette",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "type": "module",
   "description": "Global command palette for pi — press Ctrl+Shift+P to search and run commands from anywhere",
   "main": "src/index.ts",

package/src/index.test.ts

@@ -1,37 +1,22 @@
 /**
- * Regression tests for model reference parsing, the partitioned fuzzy
- * filter that keeps scoped models on top while searching, and the palette
- * item ordering that keeps built-ins → native commands → editor-fill entries.
+ * Regression tests for the partitioned fuzzy filter that keeps scoped
+ * models on top while searching, and the palette item ordering that keeps
+ * built-ins → native commands → editor-fill entries.
  */
 
 import assert from "node:assert/strict";
 import { after, test } from "node:test";
 import type { ExtensionAPI } from "@earendil-works/pi-coding-agent";
 import { paletteCommandRegistry } from "@d3ara1n/pi-command-palette-core";
-import { buildPaletteItems, parseModelRef, partitionedFuzzyFilter } from "./index.ts";
+import { buildPaletteItems, partitionedFuzzyFilter } from "./index.ts";
 
 /** Minimal fake of the pi API surface buildPaletteItems uses. */
-function fakePi(commands: { name: string; description?: string }[]): ExtensionAPI {
+function fakePi(
+  commands: { name: string; description?: string; source?: "extension" | "skill" | "template" }[],
+): ExtensionAPI {
   return { getCommands: () => commands } as unknown as ExtensionAPI;
 }
 
-test("parseModelRef splits provider and model at the first slash", () => {
-  assert.deepEqual(parseModelRef("anthropic/claude-sonnet"), {
-    provider: "anthropic",
-    modelId: "claude-sonnet",
-  });
-  assert.deepEqual(parseModelRef("openrouter/vendor/model/with/slashes"), {
-    provider: "openrouter",
-    modelId: "vendor/model/with/slashes",
-  });
-});
-
-test("parseModelRef preserves empty provider or model segments", () => {
-  assert.equal(parseModelRef("model-without-provider"), undefined);
-  assert.deepEqual(parseModelRef("/model"), { provider: "", modelId: "model" });
-  assert.deepEqual(parseModelRef("provider/"), { provider: "provider", modelId: "" });
-});
-
 // ── partitionedFuzzyFilter ─────────────────────────────────────────
 
 test("partitionedFuzzyFilter concatenates partitions unchanged for empty query", () => {
@@ -108,7 +93,7 @@ test("buildPaletteItems orders built-ins above native commands above editor fill
   });
 
   const items = buildPaletteItems(
-    fakePi([{ name: "some-command", description: "extension command" }]),
+    fakePi([{ name: "some-command", description: "extension command", source: "extension" }]),
   );
 
   const ranks = items.map((item) =>
@@ -122,6 +107,14 @@ test("buildPaletteItems orders built-ins above native commands above editor fill
   assert.ok(native);
   assert.equal(native.label, "Peek: Ask This Session");
   assert.equal(native.action.type, "native");
+
+  // Command/skill/template labels carry no category prefix — the page
+  // breadcrumb already names the category, and root search shows it via
+  // the description decoration.
+  const cmd = items.find((item) => item.value === "cmd:some-command");
+  assert.ok(cmd);
+  assert.equal(cmd.label, "/some-command");
+  assert.equal(cmd.category, "Command");
 });
 
 test("buildPaletteItems picks up native commands registered after load", () => {

package/src/index.ts

@@ -5,9 +5,11 @@
  * regardless of whether the editor has content.
  *
  * Features:
- * - Lists extension commands, skills, and prompt templates (from pi.getCommands())
- * - Built-in actions: model selector, new session, compact, reload
- * - Fuzzy search via SelectList
+ * - Single overlay with nested pages: built-in actions on the root page,
+ *   extension actions / commands / skills / templates as sub-pages, models
+ *   loaded on first visit
+ * - Fuzzy search within the current page; searching the root page matches
+ *   every leaf across sub-pages
  * - Floating overlay on top of existing content
  * - Saves editor text before overwriting; offers "Restore" in palette
  * - Clear editor into the restore buffer
@@ -25,6 +27,7 @@ import {
   matchesKey,
   SelectList,
   Text,
+  type TUI,
 } from "@earendil-works/pi-tui";
 import { resolveShortcutKey } from "./config.ts";
 
@@ -33,7 +36,6 @@ import { resolveShortcutKey } from "./config.ts";
 type CommandAction =
   | { type: "editor"; text: string }
   | { type: "native"; id: string }
-  | { type: "model-select" }
   | { type: "model"; provider: string; modelId: string }
   | { type: "compact" }
   | { type: "reload" }
@@ -60,10 +62,9 @@ let savedEditorText: string | null = null;
  * non-built-in entries always sort after built-ins.
  */
 const BUILTIN_ORDER: Record<string, number> = {
-  __model_select: 0,
-  __restore: 1,
-  __copy_editor: 2,
-  __clear_editor: 3,
+  __restore: 0,
+  __copy_editor: 1,
+  __clear_editor: 2,
 };
 
 // ── Helpers ────────────────────────────────────────────────────────
@@ -100,14 +101,6 @@ export function buildPaletteItems(pi: ExtensionAPI): PaletteItem[] {
   }
 
   // ── Built-in actions ──────────────────────────────────────────
-  items.push({
-    value: "__model_select",
-    label: "Model: Switch Model",
-    description: "Select a model from the registry",
-    category: "Built-in",
-    action: { type: "model-select" },
-  });
-
   items.push({
     value: "__new_session",
     label: "Session: New",
@@ -195,7 +188,7 @@ export function buildPaletteItems(pi: ExtensionAPI): PaletteItem[] {
 
     items.push({
       value: `cmd:${cmd.name}`,
-      label: `${sourceLabel}: /${cmd.name}`,
+      label: `/${cmd.name}`,
       description: cmd.description ?? "",
       category: sourceLabel,
       action: { type: "editor", text: editorText },
@@ -219,22 +212,6 @@ export function buildPaletteItems(pi: ExtensionAPI): PaletteItem[] {
   return items;
 }
 
-// ── Model selector ─────────────────────────────────────────────────
-
-const STAR = "★ ";
-
-/**
- * @internal — exported for testing; parses the selector's `provider/model-id` values.
- */
-export function parseModelRef(modelRef: string): { provider: string; modelId: string } | undefined {
-  const slash = modelRef.indexOf("/");
-  if (slash === -1) return undefined;
-  return {
-    provider: modelRef.slice(0, slash),
-    modelId: modelRef.slice(slash + 1),
-  };
-}
-
 // ── Partitioned fuzzy filter ───────────────────────────────────────
 
 /**
@@ -261,17 +238,20 @@ export function partitionedFuzzyFilter<T>(
 
 // ── Command palette overlay ────────────────────────────────────────
 
+interface PageEntry {
+  type: "page";
+  value: string;
+  label: string;
+  description: string;
+  page: PalettePage;
+}
+
 interface PalettePage {
   title: string;
-  items: Array<PaletteItem | { type: "page"; value: string; label: string; description: string; page: PalettePage }>;
+  items: Array<PaletteItem | PageEntry>;
 }
 
-function pageItem(
-  value: string,
-  label: string,
-  description: string,
-  page: PalettePage,
-): PalettePage["items"][number] {
+function pageItem(value: string, label: string, description: string, page: PalettePage): PageEntry {
   return { type: "page", value, label, description, page };
 }
 
@@ -283,15 +263,20 @@ async function showCommandPalette(pi: ExtensionAPI, ctx: ExtensionContext): Prom
     paletteItems.filter((item) => item.category === category);
   const leafPage = (title: string, items: PaletteItem[]): PalettePage => ({ title, items });
 
-  const builtins = leaves("Built-in").filter((item) => item.action.type !== "model-select");
+  const builtins = leaves("Built-in");
   const native = leaves("Native");
   const commands = leaves("Command");
   const skills = leaves("Skill");
   const templates = leaves("Template");
+  // Leaves reachable only through sub-pages — merged into the root list
+  // while searching there. Built-in leaves live on the root page itself.
+  const subLeaves = paletteItems.filter((item) => item.category !== "Built-in");
   const modelPage: PalettePage = { title: "Models", items: [] };
   const rootItems: PalettePage["items"] = [
-    pageItem("models", "Model: Switch Model", "Choose a model", modelPage),
-    ...(builtins.length ? [pageItem("builtins", "Built-in Actions", "Session and editor actions", leafPage("Built-in Actions", builtins))] : []),
+    pageItem("models", "Models", "Switch the active model", modelPage),
+    // Built-in actions sit directly on the root page so urgent entries like
+    // Restore are visible without descending into a sub-page.
+    ...builtins,
     ...(native.length ? [pageItem("native", "Extension Actions", "Actions provided by extensions", leafPage("Extension Actions", native))] : []),
     ...(commands.length ? [pageItem("commands", "Commands", "Extension slash commands", leafPage("Commands", commands))] : []),
     ...(skills.length ? [pageItem("skills", "Skills", "Installed skills", leafPage("Skills", skills))] : []),
@@ -299,8 +284,43 @@ async function showCommandPalette(pi: ExtensionAPI, ctx: ExtensionContext): Prom
   ];
   const root: PalettePage = { title: "Command Palette", items: rootItems };
 
+  // Captured from the overlay factory so palette actions can request a
+  // render after mutating editor state (see the action switch below).
+  let tuiRef: TUI | undefined;
+
+  /** Scoped-model marker prefix (★). */
+  const STAR = "★ ";
+
+  /**
+   * Build the model list for the Models page: scoped models (★) first, then
+   * the rest — alphabetical within each group. Reads the registry
+   * synchronously; throws if enumeration fails.
+   */
+  function buildModelItems(): PaletteItem[] {
+    const scopedIds = new Set(ctx.scopedModels.map((s) => `${s.model.provider}/${s.model.id}`));
+    return ctx.modelRegistry
+      .getAvailable()
+      .map((m): PaletteItem => {
+        const scoped = scopedIds.has(`${m.provider}/${m.id}`);
+        return {
+          value: `${m.provider}/${m.id}`,
+          label: scoped ? `${STAR}${m.name}` : m.name,
+          description: m.provider,
+          category: "Models",
+          action: { type: "model", provider: m.provider, modelId: m.id },
+        };
+      })
+      .sort((a, b) => {
+        const aScoped = scopedIds.has(a.value);
+        const bScoped = scopedIds.has(b.value);
+        if (aScoped !== bScoped) return aScoped ? -1 : 1;
+        return a.label.localeCompare(b.label);
+      });
+  }
+
   const result = await ctx.ui.custom<PaletteItem | null>(
     (tui, theme, _kb, done) => {
+      tuiRef = tui;
       const container = new Container();
       const listHost = new Container();
       const queryInput = new Input();
@@ -309,8 +329,7 @@ async function showCommandPalette(pi: ExtensionAPI, ctx: ExtensionContext): Prom
         { page: root, input: "" },
       ];
       let selectList!: SelectList;
-      let visibleItems: PalettePage["items"] = [];
-      let modelLoading = false;
+      let visibleItems: Array<PaletteItem | PageEntry> = [];
 
       const listTheme = {
         selectedPrefix: (t: string) => theme.fg("accent", t),
@@ -328,12 +347,7 @@ async function showCommandPalette(pi: ExtensionAPI, ctx: ExtensionContext): Prom
         const { page } = current();
         const query = queryInput.getValue();
         visibleItems =
-          page === root && query.trim()
-            ? [
-                ...root.items,
-                ...paletteItems.filter((item) => item.action.type !== "model-select"),
-              ]
-            : page.items;
+          page === root && query.trim() ? [...root.items, ...subLeaves] : page.items;
         const items = visibleItems.map((item) => ({
           value: item.value,
           label: item.label,
@@ -364,68 +378,45 @@ async function showCommandPalette(pi: ExtensionAPI, ctx: ExtensionContext): Prom
           current().selectedValue = selected.value;
           const item = visibleItems.find((candidate) => candidate.value === selected.value);
           if (!item) return;
-          if ("page" in item) {
-            if (item.value === "models" && !modelLoading && item.page.items.length === 0) {
-              modelLoading = true;
-              try {
-                const models = ctx.modelRegistry.getAvailable();
-                const scopedIds = new Set(
-                  ctx.scopedModels.map((s) => `${s.model.provider}/${s.model.id}`),
-                );
-                const decorated = models
-                  .map((m) => {
-                    const value = `${m.provider}/${m.id}`;
-                    const scoped = scopedIds.has(value);
-                    return {
-                      scoped,
-                      item: {
-                        value,
-                        label: scoped ? `${STAR}${m.name}` : m.name,
-                        description: m.provider,
-                        category: "Built-in",
-                        action: { type: "model", provider: m.provider, modelId: m.id } as CommandAction,
-                      },
-                    };
-                  })
-                  .sort((a, b) =>
-                    a.scoped === b.scoped
-                      ? a.item.label.localeCompare(b.item.label)
-                      : a.scoped
-                        ? -1
-                        : 1,
-                  );
-                item.page.items = decorated.map((d) => d.item);
-                modelLoading = false;
-                if (item.page.items.length === 0) {
-                  ctx.ui.notify("No models available.", "warning");
-                  return;
-                }
-                pushPage(item.page);
-              } catch {
-                modelLoading = false;
-                ctx.ui.notify("Cannot enumerate models.", "warning");
-              }
+          if (!("page" in item)) {
+            done(item);
+            return;
+          }
+          // Entering the Models page loads the registry once per palette
+          // session; later visits reuse the cached list.
+          if (item.page === modelPage && item.page.items.length === 0) {
+            try {
+              item.page.items = buildModelItems();
+            } catch {
+              ctx.ui.notify("Cannot enumerate models. Use Ctrl+L instead.", "warning");
+              return;
+            }
+            if (item.page.items.length === 0) {
+              ctx.ui.notify("No models available.", "warning");
               return;
             }
-            pushPage(item.page);
-          } else {
-            done(item);
           }
+          pushPage(item.page);
         };
         selectList.onSelectionChange = (selected) => {
           current().selectedValue = selected.value;
         };
-        selectList.onCancel = () => done(null);
-        if (modelLoading && page.title === "Models") {
-          listHost.clear();
-          listHost.addChild(new Text(theme.fg("muted", "Loading models…"), 1, 0));
-        }
+      }
+
+      // Breadcrumb title: updated in place whenever the page stack changes.
+      const titleText = new Text(theme.fg("accent", theme.bold(root.title)), 1, 0);
+
+      function updateTitle() {
+        titleText.setText(
+          theme.fg("accent", theme.bold(stack.map((frame) => frame.page.title).join(" › "))),
+        );
       }
 
       function pushPage(page: PalettePage) {
         current().input = queryInput.getValue();
         stack.push({ page, input: "" });
         queryInput.setValue("");
+        updateTitle();
         rebuild();
         tui.requestRender();
       }
@@ -434,16 +425,19 @@ async function showCommandPalette(pi: ExtensionAPI, ctx: ExtensionContext): Prom
         if (stack.length <= 1) return;
         stack.pop();
         queryInput.setValue(current().input);
+        updateTitle();
         rebuild();
         tui.requestRender();
       }
 
       rebuild();
       container.addChild(new DynamicBorder((s: string) => theme.fg("accent", s)));
-      container.addChild(new Text(theme.fg("accent", theme.bold(root.title)), 1, 0));
+      container.addChild(titleText);
       container.addChild(queryInput);
       container.addChild(listHost);
-      container.addChild(new Text(theme.fg("dim", "↑↓ navigate • enter open/select • backspace on empty returns • esc closes"), 1, 0));
+      container.addChild(
+        new Text(theme.fg("dim", "↑↓ navigate • enter open/select • backspace go back • esc close"), 1, 0),
+      );
       container.addChild(new DynamicBorder((s: string) => theme.fg("accent", s)));
 
       return {
@@ -455,10 +449,7 @@ async function showCommandPalette(pi: ExtensionAPI, ctx: ExtensionContext): Prom
           queryInput.focused = value;
         },
         render(w: number) {
-          const lines = container.render(w);
-          const title = stack.map((frame) => frame.page.title).join(" › ");
-          lines[1] = theme.fg("accent", theme.bold(title));
-          return lines;
+          return container.render(w);
         },
         invalidate() {
           container.invalidate();
@@ -514,10 +505,6 @@ async function showCommandPalette(pi: ExtensionAPI, ctx: ExtensionContext): Prom
       }
       break;
     }
-    case "model-select": {
-      // Kept for compatibility with callers that may construct this action.
-      break;
-    }
     case "restore": {
       if (savedEditorText !== null) {
         ctx.ui.setEditorText(savedEditorText);
@@ -584,6 +571,11 @@ async function showCommandPalette(pi: ExtensionAPI, ctx: ExtensionContext): Prom
       break;
     }
   }
+
+  // The overlay close renders the underlying UI before this promise
+  // resolves, and setEditorText mutates state without requesting a render —
+  // without this, the editor shows stale text until the next keypress.
+  tuiRef?.requestRender();
 }
 
 // ── Extension entry point ──────────────────────────────────────────