@aliou/pi-ts-aperture 0.3.2 → 0.4.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@aliou/pi-ts-aperture",
   "description": "Route Pi LLM providers through Tailscale Aperture",
-  "version": "0.3.2",
+  "version": "0.4.0",
   "type": "module",
   "license": "MIT",
   "private": false,
@@ -29,12 +29,12 @@
     "video": "https://assets.aliou.me/pi-extensions/demos/pi-ts-aperture.mp4"
   },
   "dependencies": {
-    "@aliou/pi-utils-settings": "^0.10.0"
+    "@aliou/pi-utils-settings": "^0.12.0"
   },
   "peerDependencies": {
-    "@mariozechner/pi-ai": "0.61.0",
-    "@mariozechner/pi-coding-agent": "0.61.0",
-    "@mariozechner/pi-tui": "0.61.0"
+    "@mariozechner/pi-ai": "0.64.0",
+    "@mariozechner/pi-coding-agent": "0.64.0",
+    "@mariozechner/pi-tui": "0.64.0"
   },
   "peerDependenciesMeta": {
     "@mariozechner/pi-coding-agent": {
@@ -51,7 +51,7 @@
     "@aliou/biome-plugins": "^0.3.2",
     "@biomejs/biome": "^2.3.13",
     "@changesets/cli": "^2.27.11",
-    "@mariozechner/pi-coding-agent": "0.61.0",
+    "@mariozechner/pi-coding-agent": "0.64.0",
     "@sinclair/typebox": "^0.34.48",
     "@types/node": "^25.0.10",
     "@vitest/coverage-v8": "^4.0.18",
@@ -67,7 +67,8 @@
     "changeset": "changeset",
     "version": "changeset version",
     "release": "pnpm changeset publish",
-    "test": "vitest run tests/e2e.test.ts",
-    "test:watch": "vitest watch tests/"
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:e2e": "vitest run tests/e2e.test.ts"
   }
 }

package/src/commands/settings.ts

@@ -37,6 +37,9 @@ export function registerApertureSettings(
 
       const providers = tabConfig?.providers ?? resolved.providers;
 
+      const checkGatewayModels: string[] =
+        tabConfig?.checkGatewayModels ?? resolved.checkGatewayModels;
+
       return [
         {
           label: "Connection",
@@ -51,6 +54,39 @@ export function registerApertureSettings(
               values: undefined,
               submenu: undefined,
             },
+            {
+              id: "checkGatewayModels",
+              label: "Gateway model checking",
+              description:
+                "Providers for which gateway model availability is checked",
+              currentValue:
+                checkGatewayModels.length > 0
+                  ? `${checkGatewayModels.length} provider(s)`
+                  : "disabled",
+              values: undefined,
+              submenu: (_val, submenuDone) => {
+                let latest = [...checkGatewayModels];
+                return new ArrayEditor({
+                  label: "Gateway-checked providers",
+                  items: [...checkGatewayModels],
+                  theme: settingsTheme,
+                  onSave: (items) => {
+                    latest = items;
+                    const updated = structuredClone(
+                      tabConfig ?? {},
+                    ) as ApertureConfig;
+                    setNestedValue(updated, "checkGatewayModels", items);
+                    setDraft(updated);
+                  },
+                  onDone: () =>
+                    submenuDone(
+                      latest.length > 0
+                        ? `${latest.length} provider(s)`
+                        : "disabled",
+                    ),
+                });
+              },
+            },
           ],
         },
         {

package/src/commands/setup.ts

@@ -2,253 +2,135 @@
  * aperture:setup -- interactive wizard for configuring Aperture.
  *
  * Steps:
- * 1. Ask for Aperture base URL (Input)
- * 2. Select providers to route through Aperture (FuzzySelector, multi-select loop)
- * 3. Save config and register providers
+ * 1. URL input (health check runs inline on Enter, auto-advances on success)
+ * 2. Provider selection with per-provider "verify models" sub-option
  */
 
-import { FuzzySelector } from "@aliou/pi-utils-settings";
+import {
+  FuzzyMultiSelector,
+  type FuzzyMultiSelectorItem,
+  getSettingsTheme,
+  type SettingsTheme,
+  Wizard,
+  type WizardStepContext,
+} from "@aliou/pi-utils-settings";
 import type {
   ExtensionAPI,
   ExtensionContext,
 } from "@mariozechner/pi-coding-agent";
-import { getSettingsListTheme } from "@mariozechner/pi-coding-agent";
 import type { Component, TUI } from "@mariozechner/pi-tui";
-import { Input, Key, matchesKey } from "@mariozechner/pi-tui";
+import { Input } from "@mariozechner/pi-tui";
 import { configLoader } from "../config";
+import { normalizeInputUrl } from "../core";
 import { checkApertureHealth } from "../lib/health";
 
-function normalizeUrl(url: string): string {
-  let result = url.trim();
-  if (!result) return result;
-  if (!result.startsWith("http://") && !result.startsWith("https://")) {
-    result = `http://${result}`;
-  }
-  return result.replace(/\/v1\/?$/, "").replace(/\/+$/, "");
-}
-
 const SPINNER_FRAMES = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
 
-/**
- * Shows a spinner while verifying the Aperture URL is reachable.
- * Kicks off the health check on construction and resolves done(boolean)
- * when the check completes.
- */
-class HealthCheckSpinner implements Component {
-  private theme: ReturnType<typeof getSettingsListTheme>;
-  private url: string;
+// ---------------------------------------------------------------------------
+// Step 1: URL input with inline health check
+// ---------------------------------------------------------------------------
+
+class UrlStep implements Component {
+  private input: Input;
+  private theme: SettingsTheme;
   private tui: TUI;
-  // true = healthy, false = failed (retry), undefined = cancelled
-  private done: (result: boolean | undefined) => void;
+  private wizCtx: WizardStepContext;
+  private onUrl: (url: string) => void;
+  private readonly placeholder = "ai.pango-lin.ts.net";
+
+  private state: "idle" | "checking" | "ok" | "error" = "idle";
+  private errorMessage = "";
   private frame = 0;
-  private timer: ReturnType<typeof setInterval>;
-  private result: { ok: boolean; error?: string } | null = null;
+  private timer: ReturnType<typeof setInterval> | null = null;
 
   constructor(
-    theme: ReturnType<typeof getSettingsListTheme>,
-    url: string,
+    theme: SettingsTheme,
     tui: TUI,
-    done: (result: boolean | undefined) => void,
+    currentValue: string,
+    wizCtx: WizardStepContext,
+    onUrl: (url: string) => void,
   ) {
     this.theme = theme;
-    this.url = url;
     this.tui = tui;
-    this.done = done;
+    this.wizCtx = wizCtx;
+    this.onUrl = onUrl;
+    this.input = new Input();
+    if (currentValue) {
+      this.input.setValue(currentValue);
+    }
+    this.input.onSubmit = () => this.submit();
+  }
+
+  private submit(): void {
+    const value = this.input.getValue().trim();
+    if (!value || this.state === "checking") return;
+
+    const url = normalizeInputUrl(value);
+    this.state = "checking";
+    this.frame = 0;
 
-    // Animate spinner at ~80ms per frame.
     this.timer = setInterval(() => {
       this.frame = (this.frame + 1) % SPINNER_FRAMES.length;
       this.tui.requestRender();
     }, 80);
 
-    // Fire the check.
     checkApertureHealth(url).then((res) => {
-      clearInterval(this.timer);
-      this.result = res;
-      this.tui.requestRender();
+      if (this.timer) clearInterval(this.timer);
+      this.timer = null;
 
-      // On success, auto-advance after a brief pause.
-      // On failure, wait for user input (see handleInput).
       if (res.ok) {
-        setTimeout(() => this.done(true), 600);
+        this.state = "ok";
+        this.onUrl(url);
+        this.wizCtx.markComplete();
+        this.tui.requestRender();
+        setTimeout(() => this.wizCtx.goNext(), 400);
+      } else {
+        this.state = "error";
+        this.errorMessage = res.error ?? "unknown error";
+        this.tui.requestRender();
       }
     });
   }
 
-  render(_width: number): string[] {
-    const lines: string[] = [];
-    lines.push(this.theme.label(" Aperture Setup", true));
-    lines.push("");
-
-    if (!this.result) {
-      const spinner = SPINNER_FRAMES[this.frame];
-      lines.push(
-        this.theme.hint(`  ${spinner} Checking connection to ${this.url}...`),
-      );
-    } else if (this.result.ok) {
-      lines.push(this.theme.hint(`  Connected to ${this.url}`));
-    } else {
-      lines.push(
-        this.theme.hint(`  Could not reach ${this.url}: ${this.result.error}`),
-      );
-      lines.push("");
-      lines.push(
-        this.theme.hint(
-          "  Make sure the URL is correct and you are connected to the tailnet.",
-        ),
-      );
-      lines.push("");
-      lines.push(this.theme.hint("  Enter: try another URL · Esc: cancel"));
-    }
-
-    lines.push("");
-    return lines;
-  }
-
-  invalidate() {}
-
-  handleInput(data: string) {
-    // Only handle input after a failed check.
-    if (!this.result || this.result.ok) return;
-
-    if (matchesKey(data, Key.enter)) {
-      this.done(false); // retry
-    } else if (matchesKey(data, Key.escape)) {
-      this.done(undefined); // cancel wizard
-    }
-  }
-
-  dispose() {
-    clearInterval(this.timer);
-  }
-}
-
-/**
- * Simple input prompt component for the base URL step.
- */
-class UrlPrompt implements Component {
-  private input: Input;
-  private done: (value: string | undefined) => void;
-  private theme: ReturnType<typeof getSettingsListTheme>;
-  private placeholder = "ai.pango-lin.ts.net";
-
-  constructor(
-    theme: ReturnType<typeof getSettingsListTheme>,
-    currentValue: string,
-    done: (value: string | undefined) => void,
-  ) {
-    this.theme = theme;
-    this.done = done;
-    this.input = new Input();
-    if (currentValue) {
-      this.input.setValue(currentValue);
-    }
-
-    this.input.onSubmit = () => {
-      const value = this.input.getValue().trim();
-      if (!value) return;
-      this.done(normalizeUrl(value));
-    };
-    this.input.onEscape = () => {
-      this.done(undefined);
-    };
-  }
-
   render(width: number): string[] {
     const lines: string[] = [];
-    lines.push(this.theme.label(" Aperture Setup", true));
-    lines.push("");
+
     lines.push(
       this.theme.hint(`  Aperture base URL (e.g. ${this.placeholder}):`),
     );
     lines.push(`  ${this.input.render(width - 4).join("")}`);
     lines.push("");
-    lines.push(this.theme.hint("  Enter: confirm · Esc: cancel"));
-    return lines;
-  }
-
-  invalidate() {}
-
-  handleInput(data: string) {
-    this.input.handleInput(data);
-  }
-}
-
-/**
- * Provider multi-select component. Uses FuzzySelector for search,
- * tracks selected providers, and lets the user confirm with Ctrl+S.
- */
-class ProviderMultiSelect implements Component {
-  private allProviders: string[];
-  private selected: Set<string>;
-  private theme: ReturnType<typeof getSettingsListTheme>;
-  private done: (value: string[] | undefined) => void;
-  private fuzzy: FuzzySelector;
 
-  constructor(
-    theme: ReturnType<typeof getSettingsListTheme>,
-    providers: string[],
-    preselected: string[],
-    done: (value: string[] | undefined) => void,
-  ) {
-    this.allProviders = providers;
-    this.selected = new Set(preselected);
-    this.theme = theme;
-    this.done = done;
-
-    this.fuzzy = new FuzzySelector({
-      label: "Select providers (Enter to toggle, Ctrl+S to confirm)",
-      items: this.allProviders,
-      theme,
-      onSelect: (value) => {
-        if (this.selected.has(value)) {
-          this.selected.delete(value);
-        } else {
-          this.selected.add(value);
-        }
-      },
-      onDone: () => {
-        this.done(undefined);
-      },
-    });
-  }
-
-  render(width: number): string[] {
-    const lines = this.fuzzy.render(width);
-
-    // Append selected providers summary
-    if (this.selected.size > 0) {
-      lines.push("");
-      lines.push(this.theme.hint(`  Selected (${this.selected.size}):`));
-      for (const p of this.selected) {
-        lines.push(`    ${this.theme.value(p, false)}`);
-      }
-    }
-
-    // Replace the hint line from FuzzySelector
-    const hintIndex = lines.findIndex((l) => l.includes("Type to search"));
-    if (hintIndex !== -1) {
-      lines[hintIndex] = this.theme.hint(
-        "  Type to search · Enter: toggle · Ctrl+S: confirm · Esc: cancel",
-      );
+    if (this.state === "checking") {
+      const spinner = SPINNER_FRAMES[this.frame];
+      lines.push(this.theme.hint(`  ${spinner} Checking connection...`));
+    } else if (this.state === "ok") {
+      lines.push(this.theme.hint("  Connected."));
+    } else if (this.state === "error") {
+      lines.push(this.theme.hint(`  Could not connect: ${this.errorMessage}`));
+      lines.push(this.theme.hint("  Fix the URL and press Enter to retry."));
     }
 
     return lines;
   }
 
-  invalidate() {
-    this.fuzzy.invalidate();
+  invalidate(): void {}
+
+  handleInput(data: string): void {
+    if (this.state === "checking") return;
+    this.state = "idle";
+    this.input.handleInput(data);
   }
 
-  handleInput(data: string) {
-    if (matchesKey(data, Key.ctrl("s"))) {
-      this.done([...this.selected]);
-      return;
-    }
-    this.fuzzy.handleInput(data);
+  dispose(): void {
+    if (this.timer) clearInterval(this.timer);
   }
 }
 
+// ---------------------------------------------------------------------------
+// Command registration
+// ---------------------------------------------------------------------------
+
 export function registerSetupCommand(
   pi: ExtensionAPI,
   onConfigChange: (ctx: ExtensionContext) => void,
@@ -265,56 +147,81 @@ export function registerSetupCommand(
       }
 
       const config = configLoader.getConfig();
-      const settingsTheme = getSettingsListTheme();
+      const checkGatewayProviders = config.checkGatewayModels ?? [];
 
-      // Step 1: base URL + health check loop.
-      // On failure, loop back to the URL prompt so the user can retry.
-      let baseUrl: string | undefined;
-      while (true) {
-        baseUrl = await ctx.ui.custom<string | undefined>(
-          (_tui, _theme, _kb, done) => {
-            return new UrlPrompt(
-              settingsTheme,
-              baseUrl ?? config.baseUrl,
-              done,
-            );
-          },
-        );
-
-        if (!baseUrl) return;
-        const urlToCheck = baseUrl;
-
-        const result = await ctx.ui.custom<boolean | undefined>(
-          (tui, _theme, _kb, done) => {
-            return new HealthCheckSpinner(settingsTheme, urlToCheck, tui, done);
-          },
-        );
-
-        if (result === true) break; // healthy, proceed
-        if (result === undefined) return; // cancelled
-      }
-
-      // Step 2: select providers
-      // Use model registry so custom/extension providers are included.
       const knownProviders = Array.from(
         new Set(ctx.modelRegistry.getAll().map((model) => model.provider)),
       ).sort((a, b) => a.localeCompare(b));
 
-      const providers = await ctx.ui.custom<string[] | undefined>(
-        (_tui, _theme, _kb, done) => {
-          return new ProviderMultiSelect(
-            settingsTheme,
-            knownProviders,
-            config.providers,
-            done,
-          );
+      let baseUrl = config.baseUrl;
+
+      const providerItems: FuzzyMultiSelectorItem[] = knownProviders.map(
+        (p) => ({
+          label: p,
+          checked: config.providers.includes(p),
+          subOptions: [
+            {
+              label: "verify models on gateway",
+              description:
+                "Warn at startup if this provider's models are missing from the Aperture gateway",
+              checked: checkGatewayProviders.includes(p),
+            },
+          ],
+        }),
+      );
+
+      const confirmed = await ctx.ui.custom<boolean | undefined>(
+        (tui, theme, _kb, done) => {
+          const settingsTheme = getSettingsTheme(theme);
+
+          return new Wizard({
+            title: "Aperture Setup",
+            theme: settingsTheme,
+            minContentHeight: 16,
+            steps: [
+              {
+                label: "URL",
+                build: (wCtx: WizardStepContext) =>
+                  new UrlStep(settingsTheme, tui, baseUrl, wCtx, (url) => {
+                    baseUrl = url;
+                  }),
+              },
+              {
+                label: "Providers",
+                build: (wCtx: WizardStepContext) => {
+                  wCtx.markComplete();
+                  return new FuzzyMultiSelector({
+                    label: "Providers to route through Aperture",
+                    items: providerItems,
+                    theme: settingsTheme,
+                    showHints: false,
+                    showCount: false,
+                    maxVisible: 7,
+                  });
+                },
+              },
+            ],
+            onComplete: () => done(true),
+            onCancel: () => done(undefined),
+          });
         },
       );
 
-      if (!providers) return;
+      if (!confirmed) return;
+
+      const providers = providerItems
+        .filter((i) => i.checked)
+        .map((i) => i.label);
+
+      const checkGatewayModels = providerItems
+        .filter((i) => i.checked && i.subOptions?.[0]?.checked)
+        .map((i) => i.label);
 
-      // Step 3: save and register
-      await configLoader.save("global", { baseUrl, providers });
+      await configLoader.save("global", {
+        baseUrl,
+        providers,
+        checkGatewayModels,
+      });
       onConfigChange(ctx);
       ctx.ui.notify(
         `Aperture configured: ${providers.length} provider(s) via ${baseUrl}`,

package/src/config.ts

@@ -10,16 +10,19 @@ import { ConfigLoader } from "@aliou/pi-utils-settings";
 export interface ApertureConfig {
   baseUrl?: string;
   providers?: string[];
+  checkGatewayModels?: string[];
 }
 
 export interface ResolvedConfig {
   baseUrl: string;
   providers: string[];
+  checkGatewayModels: string[];
 }
 
 const DEFAULT_CONFIG: ResolvedConfig = {
   baseUrl: "",
   providers: [],
+  checkGatewayModels: [],
 };
 
 export const configLoader = new ConfigLoader<ApertureConfig, ResolvedConfig>(

package/src/core/index.ts

@@ -0,0 +1,7 @@
+/**
+ * Core module exports -- pure functions and data types.
+ */
+
+export * from "./plan";
+export * from "./types";
+export * from "./url";