@oh-my-pi/pi-coding-agent 1.337.1 → 1.340.0

package/src/modes/interactive/components/settings-selector.ts

@@ -1,7 +1,6 @@
 import type { ThinkingLevel } from "@oh-my-pi/pi-agent-core";
 import {
 	Container,
-	getCapabilities,
 	isArrowLeft,
 	isArrowRight,
 	isEscape,
@@ -17,55 +16,11 @@ import {
 	type TabBarTheme,
 	Text,
 } from "@oh-my-pi/pi-tui";
+import type { SettingsManager } from "../../../core/settings-manager.js";
 import { getSelectListTheme, getSettingsListTheme, theme } from "../theme/theme.js";
 import { DynamicBorder } from "./dynamic-border.js";
 import { PluginSettingsComponent } from "./plugin-settings.js";
-
-const THINKING_DESCRIPTIONS: Record<ThinkingLevel, string> = {
-	off: "No reasoning",
-	minimal: "Very brief reasoning (~1k tokens)",
-	low: "Light reasoning (~2k tokens)",
-	medium: "Moderate reasoning (~8k tokens)",
-	high: "Deep reasoning (~16k tokens)",
-	xhigh: "Maximum reasoning (~32k tokens)",
-};
-
-export interface ExaToolsConfig {
-	enabled: boolean;
-	enableSearch: boolean;
-	enableLinkedin: boolean;
-	enableCompany: boolean;
-	enableResearcher: boolean;
-	enableWebsets: boolean;
-}
-
-export interface SettingsConfig {
-	autoCompact: boolean;
-	showImages: boolean;
-	queueMode: "all" | "one-at-a-time";
-	thinkingLevel: ThinkingLevel;
-	availableThinkingLevels: ThinkingLevel[];
-	currentTheme: string;
-	availableThemes: string[];
-	hideThinkingBlock: boolean;
-	collapseChangelog: boolean;
-	cwd: string;
-	exa: ExaToolsConfig;
-}
-
-export interface SettingsCallbacks {
-	onAutoCompactChange: (enabled: boolean) => void;
-	onShowImagesChange: (enabled: boolean) => void;
-	onQueueModeChange: (mode: "all" | "one-at-a-time") => void;
-	onThinkingLevelChange: (level: ThinkingLevel) => void;
-	onThemeChange: (theme: string) => void;
-	onThemePreview?: (theme: string) => void;
-	onHideThinkingBlockChange: (hidden: boolean) => void;
-	onCollapseChangelogChange: (collapsed: boolean) => void;
-	onPluginsChanged?: () => void;
-	onExaSettingChange: (setting: keyof ExaToolsConfig, enabled: boolean) => void;
-	onCancel: () => void;
-}
+import { getSettingsForTab, type SettingDef } from "./settings-defs.js";
 
 function getTabBarTheme(): TabBarTheme {
 	return {
@@ -146,8 +101,41 @@ const SETTINGS_TABS: Tab[] = [
 	{ id: "plugins", label: "Plugins" },
 ];
 
+/**
+ * Dynamic context for settings that need runtime data.
+ * Some settings (like thinking level) are managed by the session, not SettingsManager.
+ */
+export interface SettingsRuntimeContext {
+	/** Available thinking levels (from session) */
+	availableThinkingLevels: ThinkingLevel[];
+	/** Current thinking level (from session) */
+	thinkingLevel: ThinkingLevel;
+	/** Available themes */
+	availableThemes: string[];
+	/** Working directory for plugins tab */
+	cwd: string;
+}
+
+/**
+ * Callback when any setting changes.
+ * The handler should dispatch based on settingId.
+ */
+export type SettingChangeHandler = (settingId: string, newValue: string | boolean) => void;
+
+export interface SettingsCallbacks {
+	/** Called when any setting value changes */
+	onChange: SettingChangeHandler;
+	/** Called for theme preview while browsing */
+	onThemePreview?: (theme: string) => void;
+	/** Called when plugins change */
+	onPluginsChanged?: () => void;
+	/** Called when settings panel is closed */
+	onCancel: () => void;
+}
+
 /**
  * Main tabbed settings selector component.
+ * Uses declarative settings definitions from settings-defs.ts.
  */
 export class SettingsSelectorComponent extends Container {
 	private tabBar: TabBar;
@@ -155,13 +143,15 @@ export class SettingsSelectorComponent extends Container {
 	private currentSubmenu: Container | null = null;
 	private pluginComponent: PluginSettingsComponent | null = null;
 
-	private config: SettingsConfig;
+	private settingsManager: SettingsManager;
+	private context: SettingsRuntimeContext;
 	private callbacks: SettingsCallbacks;
 
-	constructor(config: SettingsConfig, callbacks: SettingsCallbacks) {
+	constructor(settingsManager: SettingsManager, context: SettingsRuntimeContext, callbacks: SettingsCallbacks) {
 		super();
 
-		this.config = config;
+		this.settingsManager = settingsManager;
+		this.context = context;
 		this.callbacks = callbacks;
 
 		// Add top border
@@ -201,10 +191,8 @@ export class SettingsSelectorComponent extends Container {
 
 		switch (tabId) {
 			case "config":
-				this.showConfigTab();
-				break;
 			case "exa":
-				this.showExaTab();
+				this.showSettingsTab(tabId);
 				break;
 			case "plugins":
 				this.showPluginsTab();
@@ -215,201 +203,135 @@ export class SettingsSelectorComponent extends Container {
 		this.addChild(bottomBorder);
 	}
 
-	private showConfigTab(): void {
-		const supportsImages = getCapabilities().images;
+	/**
+	 * Convert a setting definition to a SettingItem for the UI.
+	 */
+	private defToItem(def: SettingDef): SettingItem | null {
+		// Check condition
+		if (def.type === "boolean" && def.condition && !def.condition()) {
+			return null;
+		}
 
-		const items: SettingItem[] = [
-			{
-				id: "autocompact",
-				label: "Auto-compact",
-				description: "Automatically compact context when it gets too large",
-				currentValue: this.config.autoCompact ? "true" : "false",
-				values: ["true", "false"],
-			},
-			{
-				id: "queue-mode",
-				label: "Queue mode",
-				description: "How to process queued messages while agent is working",
-				currentValue: this.config.queueMode,
-				values: ["one-at-a-time", "all"],
-			},
-			{
-				id: "hide-thinking",
-				label: "Hide thinking",
-				description: "Hide thinking blocks in assistant responses",
-				currentValue: this.config.hideThinkingBlock ? "true" : "false",
-				values: ["true", "false"],
-			},
-			{
-				id: "collapse-changelog",
-				label: "Collapse changelog",
-				description: "Show condensed changelog after updates",
-				currentValue: this.config.collapseChangelog ? "true" : "false",
-				values: ["true", "false"],
-			},
-			{
-				id: "thinking",
-				label: "Thinking level",
-				description: "Reasoning depth for thinking-capable models",
-				currentValue: this.config.thinkingLevel,
-				submenu: (currentValue, done) =>
-					new SelectSubmenu(
-						"Thinking Level",
-						"Select reasoning depth for thinking-capable models",
-						this.config.availableThinkingLevels.map((level) => ({
-							value: level,
-							label: level,
-							description: THINKING_DESCRIPTIONS[level],
-						})),
-						currentValue,
-						(value) => {
-							this.callbacks.onThinkingLevelChange(value as ThinkingLevel);
-							done(value);
-						},
-						() => done(),
-					),
-			},
-			{
-				id: "theme",
-				label: "Theme",
-				description: "Color theme for the interface",
-				currentValue: this.config.currentTheme,
-				submenu: (currentValue, done) =>
-					new SelectSubmenu(
-						"Theme",
-						"Select color theme",
-						this.config.availableThemes.map((t) => ({
-							value: t,
-							label: t,
-						})),
-						currentValue,
-						(value) => {
-							this.callbacks.onThemeChange(value);
-							done(value);
-						},
-						() => {
-							this.callbacks.onThemePreview?.(currentValue);
-							done();
-						},
-						(value) => {
-							this.callbacks.onThemePreview?.(value);
-						},
-					),
-			},
-		];
-
-		// Add image toggle if supported
-		if (supportsImages) {
-			items.splice(1, 0, {
-				id: "show-images",
-				label: "Show images",
-				description: "Render images inline in terminal",
-				currentValue: this.config.showImages ? "true" : "false",
-				values: ["true", "false"],
+		const currentValue = this.getCurrentValue(def);
+
+		switch (def.type) {
+			case "boolean":
+				return {
+					id: def.id,
+					label: def.label,
+					description: def.description,
+					currentValue: currentValue ? "true" : "false",
+					values: ["true", "false"],
+				};
+
+			case "enum":
+				return {
+					id: def.id,
+					label: def.label,
+					description: def.description,
+					currentValue: currentValue as string,
+					values: [...def.values],
+				};
+
+			case "submenu":
+				return {
+					id: def.id,
+					label: def.label,
+					description: def.description,
+					currentValue: currentValue as string,
+					submenu: (cv, done) => this.createSubmenu(def, cv, done),
+				};
+		}
+	}
+
+	/**
+	 * Get the current value for a setting, using runtime context for special cases.
+	 */
+	private getCurrentValue(def: SettingDef): string | boolean {
+		// Special cases that come from runtime context instead of SettingsManager
+		switch (def.id) {
+			case "thinkingLevel":
+				return this.context.thinkingLevel;
+			default:
+				return def.get(this.settingsManager);
+		}
+	}
+
+	/**
+	 * Create a submenu for a submenu-type setting.
+	 */
+	private createSubmenu(
+		def: SettingDef & { type: "submenu" },
+		currentValue: string,
+		done: (value?: string) => void,
+	): Container {
+		let options = def.getOptions(this.settingsManager);
+
+		// Special case: inject runtime options
+		if (def.id === "thinkingLevel") {
+			options = this.context.availableThinkingLevels.map((level) => {
+				const baseOpt = def.getOptions(this.settingsManager).find((o) => o.value === level);
+				return baseOpt || { value: level, label: level };
 			});
+		} else if (def.id === "theme") {
+			options = this.context.availableThemes.map((t) => ({ value: t, label: t }));
 		}
 
-		this.currentList = new SettingsList(
-			items,
-			10,
-			getSettingsListTheme(),
-			(id, newValue) => {
-				switch (id) {
-					case "autocompact":
-						this.callbacks.onAutoCompactChange(newValue === "true");
-						break;
-					case "show-images":
-						this.callbacks.onShowImagesChange(newValue === "true");
-						break;
-					case "queue-mode":
-						this.callbacks.onQueueModeChange(newValue as "all" | "one-at-a-time");
-						break;
-					case "hide-thinking":
-						this.callbacks.onHideThinkingBlockChange(newValue === "true");
-						break;
-					case "collapse-changelog":
-						this.callbacks.onCollapseChangelogChange(newValue === "true");
-						break;
-				}
+		const onPreview = def.id === "theme" ? this.callbacks.onThemePreview : undefined;
+		const onPreviewCancel = def.id === "theme" ? () => this.callbacks.onThemePreview?.(currentValue) : undefined;
+
+		return new SelectSubmenu(
+			def.label,
+			def.description,
+			options,
+			currentValue,
+			(value) => {
+				// Persist to SettingsManager
+				def.set(this.settingsManager, value);
+				// Notify for side effects
+				this.callbacks.onChange(def.id, value);
+				done(value);
 			},
-			() => this.callbacks.onCancel(),
+			() => {
+				onPreviewCancel?.();
+				done();
+			},
+			onPreview,
 		);
-
-		this.addChild(this.currentList);
 	}
 
-	private showExaTab(): void {
-		const items: SettingItem[] = [
-			{
-				id: "exa-enabled",
-				label: "Exa enabled",
-				description: "Master toggle for all Exa search tools",
-				currentValue: this.config.exa.enabled ? "true" : "false",
-				values: ["true", "false"],
-			},
-			{
-				id: "exa-search",
-				label: "Exa search",
-				description: "Basic search, deep search, code search, crawl",
-				currentValue: this.config.exa.enableSearch ? "true" : "false",
-				values: ["true", "false"],
-			},
-			{
-				id: "exa-linkedin",
-				label: "Exa LinkedIn",
-				description: "Search LinkedIn for people and companies",
-				currentValue: this.config.exa.enableLinkedin ? "true" : "false",
-				values: ["true", "false"],
-			},
-			{
-				id: "exa-company",
-				label: "Exa company",
-				description: "Comprehensive company research tool",
-				currentValue: this.config.exa.enableCompany ? "true" : "false",
-				values: ["true", "false"],
-			},
-			{
-				id: "exa-researcher",
-				label: "Exa researcher",
-				description: "AI-powered deep research tasks",
-				currentValue: this.config.exa.enableResearcher ? "true" : "false",
-				values: ["true", "false"],
-			},
-			{
-				id: "exa-websets",
-				label: "Exa websets",
-				description: "Webset management and enrichment tools",
-				currentValue: this.config.exa.enableWebsets ? "true" : "false",
-				values: ["true", "false"],
-			},
-		];
+	/**
+	 * Show a settings tab (config or exa) using definitions.
+	 */
+	private showSettingsTab(tabId: "config" | "exa"): void {
+		const defs = getSettingsForTab(tabId);
+		const items: SettingItem[] = [];
+
+		for (const def of defs) {
+			const item = this.defToItem(def);
+			if (item) {
+				items.push(item);
+			}
+		}
 
 		this.currentList = new SettingsList(
 			items,
 			10,
 			getSettingsListTheme(),
 			(id, newValue) => {
-				const enabled = newValue === "true";
-				switch (id) {
-					case "exa-enabled":
-						this.callbacks.onExaSettingChange("enabled", enabled);
-						break;
-					case "exa-search":
-						this.callbacks.onExaSettingChange("enableSearch", enabled);
-						break;
-					case "exa-linkedin":
-						this.callbacks.onExaSettingChange("enableLinkedin", enabled);
-						break;
-					case "exa-company":
-						this.callbacks.onExaSettingChange("enableCompany", enabled);
-						break;
-					case "exa-researcher":
-						this.callbacks.onExaSettingChange("enableResearcher", enabled);
-						break;
-					case "exa-websets":
-						this.callbacks.onExaSettingChange("enableWebsets", enabled);
-						break;
+				const def = defs.find((d) => d.id === id);
+				if (!def) return;
+
+				// Persist to SettingsManager based on type
+				if (def.type === "boolean") {
+					const boolValue = newValue === "true";
+					def.set(this.settingsManager, boolValue);
+					this.callbacks.onChange(id, boolValue);
+				} else if (def.type === "enum") {
+					def.set(this.settingsManager, newValue);
+					this.callbacks.onChange(id, newValue);
 				}
+				// Submenu types are handled in createSubmenu
 			},
 			() => this.callbacks.onCancel(),
 		);
@@ -418,7 +340,7 @@ export class SettingsSelectorComponent extends Container {
 	}
 
 	private showPluginsTab(): void {
-		this.pluginComponent = new PluginSettingsComponent(this.config.cwd, {
+		this.pluginComponent = new PluginSettingsComponent(this.context.cwd, {
 			onClose: () => this.callbacks.onCancel(),
 			onPluginChanged: () => this.callbacks.onPluginsChanged?.(),
 		});

package/src/modes/interactive/interactive-mode.ts

@@ -6,7 +6,7 @@
 import * as fs from "node:fs";
 import * as os from "node:os";
 import * as path from "node:path";
-import type { AgentMessage } from "@oh-my-pi/pi-agent-core";
+import type { AgentMessage, ThinkingLevel } from "@oh-my-pi/pi-agent-core";
 import type { AssistantMessage, ImageContent, Message, OAuthProvider } from "@oh-my-pi/pi-ai";
 import type { SlashCommand } from "@oh-my-pi/pi-tui";
 import {
@@ -1597,48 +1597,15 @@ export class InteractiveMode {
 	private showSettingsSelector(): void {
 		this.showSelector((done) => {
 			const selector = new SettingsSelectorComponent(
+				this.settingsManager,
 				{
-					autoCompact: this.session.autoCompactionEnabled,
-					showImages: this.settingsManager.getShowImages(),
-					queueMode: this.session.queueMode,
-					thinkingLevel: this.session.thinkingLevel,
 					availableThinkingLevels: this.session.getAvailableThinkingLevels(),
-					currentTheme: this.settingsManager.getTheme() || "dark",
+					thinkingLevel: this.session.thinkingLevel,
 					availableThemes: getAvailableThemes(),
-					hideThinkingBlock: this.hideThinkingBlock,
-					collapseChangelog: this.settingsManager.getCollapseChangelog(),
 					cwd: process.cwd(),
-					exa: this.settingsManager.getExaSettings(),
 				},
 				{
-					onAutoCompactChange: (enabled) => {
-						this.session.setAutoCompactionEnabled(enabled);
-						this.footer.setAutoCompactEnabled(enabled);
-					},
-					onShowImagesChange: (enabled) => {
-						this.settingsManager.setShowImages(enabled);
-						for (const child of this.chatContainer.children) {
-							if (child instanceof ToolExecutionComponent) {
-								child.setShowImages(enabled);
-							}
-						}
-					},
-					onQueueModeChange: (mode) => {
-						this.session.setQueueMode(mode);
-					},
-					onThinkingLevelChange: (level) => {
-						this.session.setThinkingLevel(level);
-						this.footer.invalidate();
-						this.updateEditorBorderColor();
-					},
-					onThemeChange: (themeName) => {
-						const result = setTheme(themeName, true);
-						this.settingsManager.setTheme(themeName);
-						this.ui.invalidate();
-						if (!result.success) {
-							this.showError(`Failed to load theme "${themeName}": ${result.error}\nFell back to dark theme.`);
-						}
-					},
+					onChange: (id, value) => this.handleSettingChange(id, value),
 					onThemePreview: (themeName) => {
 						const result = setTheme(themeName, true);
 						if (result.success) {
@@ -1646,46 +1613,9 @@ export class InteractiveMode {
 							this.ui.requestRender();
 						}
 					},
-					onHideThinkingBlockChange: (hidden) => {
-						this.hideThinkingBlock = hidden;
-						this.settingsManager.setHideThinkingBlock(hidden);
-						for (const child of this.chatContainer.children) {
-							if (child instanceof AssistantMessageComponent) {
-								child.setHideThinkingBlock(hidden);
-							}
-						}
-						this.chatContainer.clear();
-						this.rebuildChatFromMessages();
-					},
-					onCollapseChangelogChange: (collapsed) => {
-						this.settingsManager.setCollapseChangelog(collapsed);
-					},
 					onPluginsChanged: () => {
-						// Plugin config changed - could trigger reload if needed
 						this.ui.requestRender();
 					},
-					onExaSettingChange: (setting, enabled) => {
-						switch (setting) {
-							case "enabled":
-								this.settingsManager.setExaEnabled(enabled);
-								break;
-							case "enableSearch":
-								this.settingsManager.setExaSearchEnabled(enabled);
-								break;
-							case "enableLinkedin":
-								this.settingsManager.setExaLinkedinEnabled(enabled);
-								break;
-							case "enableCompany":
-								this.settingsManager.setExaCompanyEnabled(enabled);
-								break;
-							case "enableResearcher":
-								this.settingsManager.setExaResearcherEnabled(enabled);
-								break;
-							case "enableWebsets":
-								this.settingsManager.setExaWebsetsEnabled(enabled);
-								break;
-						}
-					},
 					onCancel: () => {
 						done();
 						this.ui.requestRender();
@@ -1696,6 +1626,59 @@ export class InteractiveMode {
 		});
 	}
 
+	/**
+	 * Handle setting changes from the settings selector.
+	 * Most settings are saved directly via SettingsManager in the definitions.
+	 * This handles side effects and session-specific settings.
+	 */
+	private handleSettingChange(id: string, value: string | boolean): void {
+		switch (id) {
+			// Session-managed settings (not in SettingsManager)
+			case "autoCompact":
+				this.session.setAutoCompactionEnabled(value as boolean);
+				this.footer.setAutoCompactEnabled(value as boolean);
+				break;
+			case "queueMode":
+				this.session.setQueueMode(value as "all" | "one-at-a-time");
+				break;
+			case "thinkingLevel":
+				this.session.setThinkingLevel(value as ThinkingLevel);
+				this.footer.invalidate();
+				this.updateEditorBorderColor();
+				break;
+
+			// Settings with UI side effects
+			case "showImages":
+				for (const child of this.chatContainer.children) {
+					if (child instanceof ToolExecutionComponent) {
+						child.setShowImages(value as boolean);
+					}
+				}
+				break;
+			case "hideThinking":
+				this.hideThinkingBlock = value as boolean;
+				for (const child of this.chatContainer.children) {
+					if (child instanceof AssistantMessageComponent) {
+						child.setHideThinkingBlock(value as boolean);
+					}
+				}
+				this.chatContainer.clear();
+				this.rebuildChatFromMessages();
+				break;
+			case "theme": {
+				const result = setTheme(value as string, true);
+				this.ui.invalidate();
+				if (!result.success) {
+					this.showError(`Failed to load theme "${value}": ${result.error}\nFell back to dark theme.`);
+				}
+				break;
+			}
+
+			// All other settings are handled by the definitions (get/set on SettingsManager)
+			// No additional side effects needed
+		}
+	}
+
 	private showModelSelector(): void {
 		this.showSelector((done) => {
 			const selector = new ModelSelectorComponent(
@@ -2139,7 +2122,7 @@ export class InteractiveMode {
 			}
 
 			// Create the preview URL
-			const previewUrl = `https://shittycodingagent.ai/session?${gistId}`;
+			const previewUrl = `https://gistpreview.github.io/?${gistId}`;
 			this.showStatus(`Share URL: ${previewUrl}\nGist: ${gistUrl}`);
 		} catch (error: unknown) {
 			if (!loader.signal.aborted) {

package/src/utils/shell.ts

@@ -83,13 +83,21 @@ export function getShellConfig(): { shell: string; args: string[] } {
 		);
 	}
 
-	// Unix: prefer bash over sh
-	if (existsSync("/bin/bash")) {
-		cachedShellConfig = { shell: "/bin/bash", args: ["-c"] };
+	// Unix: prefer user's shell from $SHELL, fallback to bash, then sh
+	const userShell = process.env.SHELL;
+	if (userShell && existsSync(userShell)) {
+		cachedShellConfig = { shell: userShell, args: ["-c"] };
 		return cachedShellConfig;
 	}
 
-	cachedShellConfig = { shell: "sh", args: ["-c"] };
+	const bashPath = Bun.which("bash");
+	if (bashPath) {
+		cachedShellConfig = { shell: bashPath, args: ["-c"] };
+		return cachedShellConfig;
+	}
+
+	const shPath = Bun.which("sh");
+	cachedShellConfig = { shell: shPath || "sh", args: ["-c"] };
 	return cachedShellConfig;
 }