pi-extmgr 0.1.22 → 0.1.24

package/src/ui/package-config.ts

@@ -13,19 +13,20 @@ import {
   type SettingItem,
 } from "@mariozechner/pi-tui";
 import type { InstalledPackage, PackageExtensionEntry, State } from "../types/index.js";
-import { discoverPackageExtensions, setPackageExtensionState } from "../packages/extensions.js";
+import {
+  applyPackageExtensionStateChanges,
+  discoverPackageExtensions,
+  validatePackageExtensionSettings,
+} from "../packages/extensions.js";
 import { notify } from "../utils/notify.js";
 import { logExtensionToggle } from "../utils/history.js";
+import { requireCustomUI, runCustomUI } from "../utils/mode.js";
 import { getPackageSourceKind } from "../utils/package-source.js";
+import { getSettingsListSelectedIndex } from "../utils/settings-list.js";
 import { fileExists } from "../utils/fs.js";
 import { UI } from "../constants.js";
 import { getChangeMarker, getPackageIcon, getScopeIcon, getStatusIcon } from "./theme.js";
 
-interface SelectableList {
-  selectedIndex?: number;
-  handleInput?(data: string): void;
-}
-
 export interface PackageConfigRow {
   id: string;
   extensionPath: string;
@@ -36,16 +37,6 @@ export interface PackageConfigRow {
 
 type ConfigurePanelAction = { type: "cancel" } | { type: "save" };
 
-function getSelectedIndex(settingsList: unknown): number | undefined {
-  if (settingsList && typeof settingsList === "object") {
-    const selectable = settingsList as SelectableList;
-    if (typeof selectable.selectedIndex === "number") {
-      return selectable.selectedIndex;
-    }
-  }
-  return undefined;
-}
-
 export async function buildPackageConfigRows(
   entries: PackageExtensionEntry[]
 ): Promise<PackageConfigRow[]> {
@@ -130,99 +121,116 @@ async function showConfigurePanel(
   rows: PackageConfigRow[],
   staged: Map<string, State>,
   ctx: ExtensionCommandContext
-): Promise<ConfigurePanelAction> {
-  return ctx.ui.custom<ConfigurePanelAction>((tui, theme, _keybindings, done) => {
-    const container = new Container();
-
-    container.addChild(new DynamicBorder((s: string) => theme.fg("accent", s)));
-    container.addChild(
-      new Text(theme.fg("accent", theme.bold(`Configure extensions: ${pkg.name}`)), 2, 0)
-    );
-    container.addChild(
-      new Text(
-        theme.fg(
-          "muted",
-          `${rows.length} extension path${rows.length === 1 ? "" : "s"} • Space/Enter toggle • S save • Esc cancel`
-        ),
-        2,
-        0
-      )
-    );
-    container.addChild(new Spacer(1));
-
-    const settingsItems = buildSettingItems(rows, staged, pkg, theme);
-    const rowById = new Map(rows.map((row) => [row.id, row]));
-
-    const settingsList = new SettingsList(
-      settingsItems,
-      Math.min(rows.length + 2, UI.maxListHeight),
-      getSettingsListTheme(),
-      (id: string, newValue: string) => {
-        const row = rowById.get(id);
-        if (!row || !row.available) return;
-
-        const state = newValue as State;
-        staged.set(id, state);
-
-        const settingsItem = settingsItems.find((item) => item.id === id);
-        if (settingsItem) {
+): Promise<ConfigurePanelAction | undefined> {
+  return runCustomUI(ctx, "Package extension configuration", () =>
+    ctx.ui.custom<ConfigurePanelAction>((tui, theme, _keybindings, done) => {
+      const container = new Container();
+      const titleText = new Text("", 2, 0);
+      const subtitleText = new Text("", 2, 0);
+      const footerText = new Text("", 2, 0);
+
+      container.addChild(new DynamicBorder((s: string) => theme.fg("accent", s)));
+      container.addChild(titleText);
+      container.addChild(subtitleText);
+      container.addChild(new Spacer(1));
+
+      const settingsItems = buildSettingItems(rows, staged, pkg, theme);
+      const rowById = new Map(rows.map((row) => [row.id, row]));
+      const syncThemedContent = (): void => {
+        titleText.setText(theme.fg("accent", theme.bold(`Configure extensions: ${pkg.name}`)));
+        subtitleText.setText(
+          theme.fg(
+            "muted",
+            `${rows.length} extension path${rows.length === 1 ? "" : "s"} • Space/Enter toggle • S save • Esc cancel`
+          )
+        );
+        footerText.setText(theme.fg("dim", "↑↓ Navigate | Space/Enter Toggle | S Save | Esc Back"));
+
+        for (const settingsItem of settingsItems) {
+          const row = rowById.get(settingsItem.id);
+          if (!row) continue;
+          const currentState = staged.get(row.id) ?? row.originalState;
           settingsItem.label = formatConfigRowLabel(
             row,
-            state,
+            currentState,
             pkg,
             theme,
-            state !== row.originalState
-          );
-        }
-
-        tui.requestRender();
-      },
-      () => done({ type: "cancel" }),
-      { enableSearch: rows.length > UI.searchThreshold }
-    );
-
-    container.addChild(settingsList);
-    container.addChild(new Spacer(1));
-    container.addChild(
-      new Text(theme.fg("dim", "↑↓ Navigate | Space/Enter Toggle | S Save | Esc Back"), 2, 0)
-    );
-    container.addChild(new DynamicBorder((s: string) => theme.fg("accent", s)));
-
-    return {
-      render(width: number) {
-        return container.render(width);
-      },
-      invalidate() {
-        container.invalidate();
-      },
-      handleInput(data: string) {
-        if (matchesKey(data, Key.ctrl("s")) || data === "s" || data === "S") {
-          done({ type: "save" });
-          return;
-        }
-
-        const selectedIndex = getSelectedIndex(settingsList) ?? 0;
-        const selectedId = settingsItems[selectedIndex]?.id ?? settingsItems[0]?.id;
-        const selectedRow = selectedId ? rowById.get(selectedId) : undefined;
-
-        if (
-          selectedRow &&
-          !selectedRow.available &&
-          (data === " " || data === "\r" || data === "\n")
-        ) {
-          notify(
-            ctx,
-            `${selectedRow.extensionPath} is missing on disk and cannot be toggled.`,
-            "warning"
+            currentState !== row.originalState
           );
-          return;
         }
+      };
+      syncThemedContent();
+
+      const settingsList = new SettingsList(
+        settingsItems,
+        Math.min(rows.length + 2, UI.maxListHeight),
+        getSettingsListTheme(),
+        (id: string, newValue: string) => {
+          const row = rowById.get(id);
+          if (!row || !row.available) return;
+
+          const state = newValue as State;
+          staged.set(id, state);
+
+          const settingsItem = settingsItems.find((item) => item.id === id);
+          if (settingsItem) {
+            settingsItem.label = formatConfigRowLabel(
+              row,
+              state,
+              pkg,
+              theme,
+              state !== row.originalState
+            );
+          }
+
+          tui.requestRender();
+        },
+        () => done({ type: "cancel" }),
+        { enableSearch: rows.length > UI.searchThreshold }
+      );
 
-        settingsList.handleInput?.(data);
-        tui.requestRender();
-      },
-    };
-  });
+      container.addChild(settingsList);
+      container.addChild(new Spacer(1));
+      container.addChild(footerText);
+      container.addChild(new DynamicBorder((s: string) => theme.fg("accent", s)));
+
+      return {
+        render(width: number) {
+          return container.render(width);
+        },
+        invalidate() {
+          container.invalidate();
+          syncThemedContent();
+        },
+        handleInput(data: string) {
+          if (matchesKey(data, Key.ctrl("s")) || data === "s" || data === "S") {
+            done({ type: "save" });
+            return;
+          }
+
+          const selectedIndex = getSettingsListSelectedIndex(settingsList) ?? 0;
+          const selectedId = settingsItems[selectedIndex]?.id ?? settingsItems[0]?.id;
+          const selectedRow = selectedId ? rowById.get(selectedId) : undefined;
+
+          if (
+            selectedRow &&
+            !selectedRow.available &&
+            (data === " " || data === "\r" || data === "\n")
+          ) {
+            notify(
+              ctx,
+              `${selectedRow.extensionPath} is missing on disk and cannot be toggled.`,
+              "warning"
+            );
+            return;
+          }
+
+          settingsList.handleInput?.(data);
+          tui.requestRender();
+        },
+      };
+    })
+  );
 }
 
 export async function applyPackageExtensionChanges(
@@ -232,40 +240,50 @@ export async function applyPackageExtensionChanges(
   cwd: string,
   pi: ExtensionAPI
 ): Promise<{ changed: number; errors: string[] }> {
-  let changed = 0;
   const errors: string[] = [];
+  const changedRows = [...rows]
+    .sort((a, b) => a.extensionPath.localeCompare(b.extensionPath))
+    .flatMap((row) => {
+      const target = staged.get(row.id) ?? row.originalState;
+      if (target === row.originalState) {
+        return [];
+      }
 
-  const sortedRows = [...rows].sort((a, b) => a.extensionPath.localeCompare(b.extensionPath));
+      if (!row.available) {
+        const error = `${row.extensionPath}: extension entrypoint is missing on disk`;
+        errors.push(error);
+        logExtensionToggle(pi, row.id, row.originalState, target, false, error);
+        return [];
+      }
 
-  for (const row of sortedRows) {
-    const target = staged.get(row.id) ?? row.originalState;
-    if (target === row.originalState) continue;
+      return [{ row, target }];
+    });
 
-    if (!row.available) {
-      const error = `${row.extensionPath}: extension entrypoint is missing on disk`;
-      errors.push(error);
-      logExtensionToggle(pi, row.id, row.originalState, target, false, error);
-      continue;
-    }
+  if (changedRows.length === 0) {
+    return { changed: 0, errors };
+  }
 
-    const result = await setPackageExtensionState(
-      pkg.source,
-      row.extensionPath,
-      pkg.scope,
-      target,
-      cwd
-    );
+  const result = await applyPackageExtensionStateChanges(
+    pkg.source,
+    pkg.scope,
+    changedRows.map(({ row, target }) => ({ extensionPath: row.extensionPath, target })),
+    cwd
+  );
 
-    if (result.ok) {
-      changed += 1;
-      logExtensionToggle(pi, row.id, row.originalState, target, true);
-    } else {
-      errors.push(`${row.extensionPath}: ${result.error}`);
+  if (!result.ok) {
+    for (const { row, target } of changedRows) {
+      const error = `${row.extensionPath}: ${result.error}`;
+      errors.push(error);
       logExtensionToggle(pi, row.id, row.originalState, target, false, result.error);
     }
+    return { changed: 0, errors };
+  }
+
+  for (const { row, target } of changedRows) {
+    logExtensionToggle(pi, row.id, row.originalState, target, true);
   }
 
-  return { changed, errors };
+  return { changed: changedRows.length, errors };
 }
 
 async function promptRestartForPackageConfig(ctx: ExtensionCommandContext): Promise<boolean> {
@@ -302,6 +320,16 @@ export async function configurePackageExtensions(
   ctx: ExtensionCommandContext,
   pi: ExtensionAPI
 ): Promise<{ changed: number; reloaded: boolean }> {
+  if (!requireCustomUI(ctx, "Package extension configuration")) {
+    return { changed: 0, reloaded: false };
+  }
+
+  const validation = await validatePackageExtensionSettings(pkg.scope, ctx.cwd);
+  if (!validation.ok) {
+    notify(ctx, validation.error, "error");
+    return { changed: 0, reloaded: false };
+  }
+
   const discovered = await discoverPackageExtensions([pkg], ctx.cwd);
   const rows = await buildPackageConfigRows(discovered);
 
@@ -314,6 +342,9 @@ export async function configurePackageExtensions(
 
   while (true) {
     const action = await showConfigurePanel(pkg, rows, staged, ctx);
+    if (!action) {
+      return { changed: 0, reloaded: false };
+    }
 
     if (action.type === "cancel") {
       const pending = getPendingChangeCount(rows, staged);

package/src/ui/remote.ts

@@ -15,7 +15,9 @@ import {
   isCacheValid,
 } from "../packages/discovery.js";
 import { installPackage, installPackageLocally } from "../packages/install.js";
+import { execNpm } from "../utils/npm-exec.js";
 import { notify } from "../utils/notify.js";
+import { requireCustomUI, runCustomUI } from "../utils/mode.js";
 
 interface PackageInfoCacheEntry {
   timestamp: number;
@@ -64,8 +66,9 @@ class PackageInfoCache {
   }
 
   set(name: string, entry: Omit<PackageInfoCacheEntry, "timestamp">): void {
-    // Evict oldest if at capacity
-    if (this.cache.size >= this.maxSize) {
+    if (this.cache.has(name)) {
+      this.cache.delete(name);
+    } else if (this.cache.size >= this.maxSize) {
       const firstKey = this.cache.keys().next().value;
       if (firstKey) {
         this.cache.delete(firstKey);
@@ -81,10 +84,6 @@ class PackageInfoCache {
   clear(): void {
     this.cache.clear();
   }
-
-  get size(): number {
-    return this.cache.size;
-  }
 }
 
 // Global LRU cache instance
@@ -93,6 +92,10 @@ const packageInfoCache = new PackageInfoCache(
   CACHE_LIMITS.packageInfoTTL
 );
 
+export function clearRemotePackageInfoCache(): void {
+  packageInfoCache.clear();
+}
+
 const REMOTE_MENU_CHOICES = {
   browse: "🔍 Browse pi packages",
   search: "🔎 Search packages",
@@ -143,9 +146,8 @@ async function buildPackageInfoText(
   }
 
   const [infoRes, weeklyDownloads] = await Promise.all([
-    pi.exec("npm", ["view", packageName, "--json"], {
+    execNpm(pi, ["view", packageName, "--json"], ctx, {
       timeout: TIMEOUTS.npmView,
-      cwd: ctx.cwd,
     }),
     fetchWeeklyDownloads(packageName),
   ]);
@@ -269,50 +271,63 @@ async function selectBrowseAction(
   items.push({ value: "nav:refresh", label: "🔄 Refresh search" });
   items.push({ value: "nav:menu", label: "← Back to menu" });
 
-  return ctx.ui.custom<BrowseAction | undefined>((tui, theme, _keybindings, done) => {
-    const container = new Container();
-    container.addChild(new DynamicBorder((s: string) => theme.fg("accent", s)));
-    container.addChild(new Text(theme.fg("accent", theme.bold(titleText)), 1, 0));
-
-    const selectList = new SelectList(items, Math.min(items.length, 12), {
-      selectedPrefix: (t) => theme.fg("accent", t),
-      selectedText: (t) => theme.fg("accent", t),
-      description: (t) => theme.fg("muted", t),
-      scrollInfo: (t) => theme.fg("dim", t),
-      noMatch: (t) => theme.fg("warning", t),
-    });
-
-    selectList.onSelect = (item) => {
-      if (item.value === "nav:prev") {
-        done({ type: "prev" });
-      } else if (item.value === "nav:next") {
-        done({ type: "next" });
-      } else if (item.value === "nav:refresh") {
-        done({ type: "refresh" });
-      } else if (item.value === "nav:menu") {
-        done({ type: "menu" });
-      } else if (item.value.startsWith("pkg:")) {
-        done({ type: "package", name: item.value.slice(4) });
-      } else {
-        done(undefined);
-      }
-    };
-
-    selectList.onCancel = () => done(undefined);
-
-    container.addChild(selectList);
-    container.addChild(new Text(theme.fg("dim", "↑↓ wraps • enter select • esc cancel"), 1, 0));
-    container.addChild(new DynamicBorder((s: string) => theme.fg("accent", s)));
-
-    return {
-      render: (w: number) => container.render(w),
-      invalidate: () => container.invalidate(),
-      handleInput: (data: string) => {
-        selectList.handleInput(data);
-        tui.requestRender();
-      },
-    };
-  });
+  return runCustomUI(ctx, "Remote package browsing", () =>
+    ctx.ui.custom<BrowseAction>((tui, theme, _keybindings, done) => {
+      const container = new Container();
+      const title = new Text("", 1, 0);
+      const footer = new Text("", 1, 0);
+      const syncThemedContent = (): void => {
+        title.setText(theme.fg("accent", theme.bold(titleText)));
+        footer.setText(theme.fg("dim", "↑↓ wraps • enter select • esc cancel"));
+      };
+
+      container.addChild(new DynamicBorder((s: string) => theme.fg("accent", s)));
+      container.addChild(title);
+
+      const selectList = new SelectList(items, Math.min(items.length, 12), {
+        selectedPrefix: (t) => theme.fg("accent", t),
+        selectedText: (t) => theme.fg("accent", t),
+        description: (t) => theme.fg("muted", t),
+        scrollInfo: (t) => theme.fg("dim", t),
+        noMatch: (t) => theme.fg("warning", t),
+      });
+
+      selectList.onSelect = (item) => {
+        if (item.value === "nav:prev") {
+          done({ type: "prev" });
+        } else if (item.value === "nav:next") {
+          done({ type: "next" });
+        } else if (item.value === "nav:refresh") {
+          done({ type: "refresh" });
+        } else if (item.value === "nav:menu") {
+          done({ type: "menu" });
+        } else if (item.value.startsWith("pkg:")) {
+          done({ type: "package", name: item.value.slice(4) });
+        } else {
+          done({ type: "cancel" });
+        }
+      };
+
+      selectList.onCancel = () => done({ type: "cancel" });
+
+      syncThemedContent();
+      container.addChild(selectList);
+      container.addChild(footer);
+      container.addChild(new DynamicBorder((s: string) => theme.fg("accent", s)));
+
+      return {
+        render: (w: number) => container.render(w),
+        invalidate: () => {
+          container.invalidate();
+          syncThemedContent();
+        },
+        handleInput: (data: string) => {
+          selectList.handleInput(data);
+          tui.requestRender();
+        },
+      };
+    })
+  );
 }
 
 export async function browseRemotePackages(
@@ -321,6 +336,16 @@ export async function browseRemotePackages(
   pi: ExtensionAPI,
   offset = 0
 ): Promise<void> {
+  if (
+    !requireCustomUI(
+      ctx,
+      "Remote package browsing",
+      "Use `/extensions install <source>` to install directly outside the full interactive TUI."
+    )
+  ) {
+    return;
+  }
+
   // Check cache first
   let allPackages: NpmPackage[] = [];
 
@@ -375,8 +400,8 @@ export async function browseRemotePackages(
     showLoadMore
   );
 
-  if (!result) {
-    return; // User cancelled
+  if (!result || result.type === "cancel") {
+    return;
   }
 
   // Handle result