@gajae-code/coding-agent 0.16.1 → 0.16.4

package/src/modes/components/model-selector.ts

@@ -410,6 +410,10 @@ export class ModelSelectorComponent extends Container {
 	#unsubscribeProviderOrderChanged: () => void = () => {};
 	#unsubscribeAuthGeneration: () => void = () => {};
 	#disposed = false;
+	#catalogLoaded = false;
+	#catalogLoadPromise?: Promise<void>;
+	#presetCatalogRefreshPending = false;
+	#openSmartRoutingAfterPresetRefresh = false;
 	/** Standalone smart-routing entry: cancel closes the selector instead of falling back to the preset landing. */
 	#smartRoutingOnly = false;
 
@@ -422,6 +426,8 @@ export class ModelSelectorComponent extends Container {
 	#presetScopeIndex: number = 0;
 	#providerAuthById = new Map<string, boolean>();
 	#bareProfileAuthByName = new Map<string, boolean>();
+	// Rebuilt with the provider and bare-selector snapshots on every catalog or credential refresh.
+	#profileAuthByName = new Map<string, boolean>();
 	#providerAuthPending: boolean = false;
 	#providerAuthRefreshGeneration = 0;
 	#presetLoginHint?: string;
@@ -545,21 +551,39 @@ export class ModelSelectorComponent extends Container {
 			this.#unsubscribeCatalogChanged = this.#modelRegistry.onCatalogChanged(() => {
 				if (this.#disposed) return;
 				if (this.#viewMode === "presets") {
-					this.#refreshCatalogView();
+					if (this.#presetCatalogRefreshPending) return;
+					this.#rebuildRoleModels();
 					this.#clampPresetCursor();
 					void this.#refreshProviderAuth();
 					this.#renderPresetLanding();
 					this.#tui.requestRender();
 					return;
 				}
+				if (this.#viewMode === "smart-routing" && this.#smartRoutingPanel) return;
+				// The in-flight load already consumes the latest registry snapshot. Avoid
+				// materializing the same catalog again from its own change notification.
+				if (this.#catalogLoadPromise) return;
+				if (!this.#catalogLoaded) {
+					void this.#initializeCatalogView();
+					return;
+				}
 				if (this.#refreshCatalogView()) this.#tui.requestRender();
 			});
 		}
 
-		// Advisory drift only, and only while the smart-routing panel is mounted. This
-		// must not call refreshState: that would discard the user's unsaved draft.
+		// Proxy and provider-policy changes invalidate preset availability. Provider-order changes are
+		// advisory only while smart routing is mounted and must not discard its draft.
 		this.#unsubscribeProviderOrderChanged = this.#settings.onChanged?.(path => {
-			if (this.#disposed || path !== "modelProviderOrder") return;
+			if (this.#disposed) return;
+			if (
+				path === "modelProfile.proxyProvider" ||
+				path === "modelProfile.proxyMode" ||
+				path === "disabledProviders"
+			) {
+				if (this.#viewMode === "presets") void this.#refreshProviderAuth();
+				return;
+			}
+			if (path !== "modelProviderOrder") return;
 			if (this.#viewMode !== "smart-routing") return;
 			const panel = this.#smartRoutingPanel;
 			if (!panel) return;
@@ -572,34 +596,21 @@ export class ModelSelectorComponent extends Container {
 				void this.#refreshProviderAuth();
 			}) ?? (() => {});
 
-		// Load models and do initial render
-		this.#loadModels().then(() => {
-			this.#buildProviderTabs();
-			if (this.#smartRoutingOnly) {
-				this.#enterSmartRoutingMode();
-				this.#tui.requestRender();
-				return;
-			}
-			if (this.#viewMode === "presets" && (this.#modelRegistry.getModelProfiles?.().size ?? 0) === 0) {
-				this.#viewMode = "models";
-			}
-			if (this.#viewMode === "presets") {
-				void this.#refreshProviderAuth();
+		if (this.#viewMode === "presets") {
+			// The landing only needs profile definitions and provider authentication.
+			// Refresh static configuration without enumerating and canonicalizing the
+			// full browser catalog, then resolve preset authentication once.
+			this.#presetCatalogRefreshPending = true;
+			if ((this.#modelRegistry.getModelProfiles?.().size ?? 0) > 0) {
 				this.#renderPresetLanding();
 			} else {
-				this.#updateTabBar();
-				// Always apply the current search query — the user may have typed
-				// while models were loading asynchronously.
-				const currentQuery = this.#searchInput.getValue();
-				if (currentQuery) {
-					this.#filterModels(currentQuery);
-				} else {
-					this.#updateList();
-				}
+				this.#listContainer.addChild(new Text(theme.fg("muted", "Loading model presets..."), 0, 0));
 			}
-			// Request re-render after models are loaded
 			this.#tui.requestRender();
-		});
+			void this.#initializePresetLanding();
+		} else {
+			void this.#initializeCatalogView();
+		}
 	}
 
 	override dispose(): void {
@@ -1332,6 +1343,10 @@ export class ModelSelectorComponent extends Container {
 		return this.#modelRegistry.getModelProfile?.(name) ?? this.#modelRegistry.getModelProfiles?.().get(name);
 	}
 
+	#isPresetAvailabilityPending(): boolean {
+		return this.#presetCatalogRefreshPending || this.#providerAuthPending;
+	}
+
 	#isProviderAuthenticated(providerId: string): boolean | undefined {
 		return this.#providerAuthById.get(providerId);
 	}
@@ -1405,9 +1420,13 @@ export class ModelSelectorComponent extends Container {
 		return [...missing].sort((a, b) => a.localeCompare(b));
 	}
 
-	#isPresetAuthenticated(profileOrProfiles: ModelProfileDefinition | ModelProfileDefinition[]): boolean {
+	#isPresetAuthenticated(
+		profileOrProfiles: ModelProfileDefinition | ModelProfileDefinition[],
+		computeCurrent = false,
+	): boolean {
 		const profiles = Array.isArray(profileOrProfiles) ? profileOrProfiles : [profileOrProfiles];
 		return profiles.every(profile => {
+			if (!computeCurrent) return this.#profileAuthByName.get(profile.name) === true;
 			if (profile.source !== "user") {
 				if (inspectProxyProviderId(this.#settings).status === "invalid") return false;
 				const proxyProvider = tryResolveProxyProviderId(this.#settings);
@@ -1503,6 +1522,7 @@ export class ModelSelectorComponent extends Container {
 		const refreshGeneration = ++this.#providerAuthRefreshGeneration;
 		this.#providerAuthById = new Map();
 		this.#bareProfileAuthByName = new Map();
+		this.#profileAuthByName = new Map();
 		const availableModels = this.#getProfileAvailableModels();
 		const resolutionRegistry = this.#createProfileResolutionRegistry(availableModels);
 		const providers = new Set<string>();
@@ -1612,6 +1632,11 @@ export class ModelSelectorComponent extends Container {
 			)
 				return;
 			this.#bareProfileAuthByName = new Map(profileAuthEntries);
+			this.#profileAuthByName = new Map(
+				[...this.#getPresetGroups().values()]
+					.flat()
+					.map(profile => [profile.name, this.#isPresetAuthenticated(profile, true)]),
+			);
 		} finally {
 			if (
 				!this.#disposed &&
@@ -1684,6 +1709,39 @@ export class ModelSelectorComponent extends Container {
 		this.#searchInput.setValue(value);
 	}
 
+	async #initializePresetLanding(): Promise<void> {
+		this.#presetCatalogRefreshPending = true;
+		let refreshFailed = false;
+		try {
+			const refreshStatic = this.#modelRegistry.refreshStatic;
+			if (typeof refreshStatic === "function") await refreshStatic.call(this.#modelRegistry);
+			this.#errorMessage = this.#modelRegistry.getError();
+		} catch (error) {
+			refreshFailed = true;
+			this.#errorMessage = error instanceof Error ? error.message : String(error);
+		} finally {
+			this.#presetCatalogRefreshPending = false;
+		}
+		if (this.#disposed || this.#viewMode !== "presets") return;
+		if ((this.#modelRegistry.getModelProfiles?.().size ?? 0) === 0) {
+			this.#viewMode = "models";
+			void this.#initializeCatalogView();
+			return;
+		}
+		this.#rebuildRoleModels();
+		this.#clampPresetCursor();
+		if (this.#openSmartRoutingAfterPresetRefresh) {
+			this.#openSmartRoutingAfterPresetRefresh = false;
+			if (!refreshFailed) {
+				this.#enterSmartRoutingMode();
+				return;
+			}
+		}
+		void this.#refreshProviderAuth();
+		this.#renderPresetLanding();
+		this.#tui.requestRender();
+	}
+
 	#switchToModelMode(seed?: string, options?: { imageRoleFilter?: boolean }): void {
 		this.#viewMode = "models";
 		this.#expandedPresetProviderId = undefined;
@@ -1695,8 +1753,52 @@ export class ModelSelectorComponent extends Container {
 		this.#selectedIndex = 0;
 		this.#imageRoleFilter = options?.imageRoleFilter ?? false;
 		this.#setSearchInputValue(seed ?? this.#searchInput.getValue());
+		void this.#initializeCatalogView();
+	}
+
+	async #initializeCatalogView(): Promise<void> {
+		if (this.#catalogLoaded) {
+			this.#presentCatalogView();
+			return;
+		}
+		if (this.#catalogLoadPromise) return this.#catalogLoadPromise;
+
+		this.#headerContainer.clear();
+		this.#listContainer.clear();
+		this.#listContainer.addChild(new Text(theme.fg("muted", "Loading models..."), 0, 0));
+		this.#tui.requestRender();
+
+		const load = this.#loadModels().then(() => {
+			this.#catalogLoaded = true;
+			if (this.#disposed) return;
+			if (this.#smartRoutingOnly) {
+				this.#enterSmartRoutingMode();
+				return;
+			}
+			if (this.#viewMode === "models") this.#presentCatalogView();
+		});
+		this.#catalogLoadPromise = load;
+		try {
+			await load;
+		} catch (error) {
+			if (!this.#disposed && (this.#viewMode === "models" || this.#viewMode === "smart-routing")) {
+				this.#errorMessage = error instanceof Error ? error.message : String(error);
+				this.#buildProviderTabs();
+				this.#updateTabBar();
+				this.#updateList();
+				this.#tui.requestRender();
+			}
+		} finally {
+			if (this.#catalogLoadPromise === load) this.#catalogLoadPromise = undefined;
+		}
+	}
+
+	#presentCatalogView(): void {
+		this.#buildProviderTabs();
 		this.#updateTabBar();
+		// Apply the latest query: input remains responsive while the catalog loads.
 		this.#filterModels(this.#searchInput.getValue());
+		this.#tui.requestRender();
 	}
 
 	/**
@@ -1880,6 +1982,12 @@ export class ModelSelectorComponent extends Container {
 		for (const line of this.#formatCurrentSessionLines()) {
 			this.#headerContainer.addChild(new Text(line, 0, 0));
 		}
+		if (this.#errorMessage) {
+			for (const line of String(this.#errorMessage).split("\n")) {
+				this.#listContainer.addChild(new Text(theme.fg("error", line), 0, 0));
+			}
+			this.#listContainer.addChild(new Spacer(1));
+		}
 		const rows = this.#getPresetRows();
 		for (let i = 0; i < rows.length; i++) {
 			const row = rows[i];
@@ -1926,7 +2034,7 @@ export class ModelSelectorComponent extends Container {
 			}
 			if (row.kind === "group") {
 				const authenticated = this.#isPresetGroupUsable(row.profiles);
-				const mark = this.#providerAuthPending ? "…" : authenticated ? "✓" : "✗";
+				const mark = this.#isPresetAvailabilityPending() ? "…" : authenticated ? "✓" : "✗";
 				const containsActive =
 					this.#activeModelProfile !== undefined &&
 					row.profiles.some(profile => profile.name === this.#activeModelProfile);
@@ -1938,7 +2046,7 @@ export class ModelSelectorComponent extends Container {
 			}
 			const presentation = getModelProfilePresentation(row.profile);
 			const authenticated = this.#isPresetAuthenticated(row.profile);
-			const mark = this.#providerAuthPending ? "…" : authenticated ? "✓" : "✗";
+			const mark = this.#isPresetAvailabilityPending() ? "…" : authenticated ? "✓" : "✗";
 			const isActive = row.profile.name === this.#activeModelProfile;
 			const label = `  ${mark} ${presentation.displayName}`;
 			const renderedLabel = selected ? theme.fg("accent", label) : authenticated ? label : theme.fg("dim", label);
@@ -2305,7 +2413,11 @@ export class ModelSelectorComponent extends Container {
 
 	handleInput(keyData: string): void {
 		if (this.#viewMode === "smart-routing") {
-			this.#smartRoutingPanel?.handleInput(keyData);
+			if (this.#smartRoutingPanel) {
+				this.#smartRoutingPanel.handleInput(keyData);
+			} else if (getKeybindings().matches(keyData, "tui.select.cancel")) {
+				this.#onCancelCallback();
+			}
 			return;
 		}
 		if (this.#assignmentState === "assigning") {
@@ -2477,6 +2589,11 @@ export class ModelSelectorComponent extends Container {
 				this.#onSelectCallback({ kind: "deleteProfile", profileName: this.#previewProfileName });
 				return;
 			}
+			if (this.#isPresetAvailabilityPending()) {
+				this.#presetLoginHint = "Refreshing preset availability...";
+				this.#renderPresetLanding();
+				return;
+			}
 			const missing = this.#getMissingProviders(profile);
 			if (missing.length > 0) {
 				this.#presetLoginHint = `Run ${missing.map(provider => `/login ${provider}`).join(", ")}`;
@@ -2504,6 +2621,12 @@ export class ModelSelectorComponent extends Container {
 		const row = this.#getSelectedPresetRow();
 		if (!row) return;
 		if (row.kind === "smartRouting") {
+			if (this.#presetCatalogRefreshPending) {
+				this.#openSmartRoutingAfterPresetRefresh = true;
+				this.#presetLoginHint = "Refreshing model configuration...";
+				this.#renderPresetLanding();
+				return;
+			}
 			this.#enterSmartRoutingMode();
 			return;
 		}
@@ -2523,6 +2646,11 @@ export class ModelSelectorComponent extends Container {
 			return;
 		}
 		if (row.kind === "group") {
+			if (this.#isPresetAvailabilityPending()) {
+				this.#presetLoginHint = "Refreshing preset availability...";
+				this.#renderPresetLanding();
+				return;
+			}
 			// A group is a list of alternative presets; only surface a login hint
 			// when none of its members are usable. A partially-usable group stays
 			// navigable so the user can drill in and pick a usable member.
@@ -2546,6 +2674,11 @@ export class ModelSelectorComponent extends Container {
 			this.#renderPresetLanding();
 			return;
 		}
+		if (this.#isPresetAvailabilityPending() && !isCustomUserProfile(row.profile)) {
+			this.#presetLoginHint = "Refreshing preset availability...";
+			this.#renderPresetLanding();
+			return;
+		}
 		const missing = this.#getMissingProviders(row.profile);
 		if (missing.length > 0 && !isCustomUserProfile(row.profile)) {
 			this.#presetLoginHint = `Run ${missing.map(provider => `/login ${provider}`).join(", ")}`;
@@ -2583,7 +2716,7 @@ export class ModelSelectorComponent extends Container {
 			this.#presetLoginHint = undefined;
 			this.#clampPresetCursor();
 		}
-		this.#renderPresetLanding();
+		void this.#refreshProviderAuth();
 		this.#tui.requestRender();
 	}