claudeup 4.35.1 → 4.37.0

package/src/ui/screens/McpRegistryScreen.tsx

@@ -8,6 +8,7 @@ import { searchMcpServers, formatDate } from "../../services/mcp-registry.js";
 import { addMcpServer, setAllowMcp } from "../../services/claude-settings.js";
 import type { McpRegistryServer, McpServerConfig } from "../../types/index.js";
 import { ScrollableList } from "../components/ScrollableList.js";
+import { theme } from "../theme.js";
 
 /**
  * Deduplicate servers by name, keeping only the latest version.
@@ -182,7 +183,9 @@ export function McpRegistryScreen() {
 			dispatch({ type: "MCPREGISTRY_SELECT", index: newIndex });
 		} else if (event.name === "l") {
 			navigateToScreen("mcp");
-		} else if (event.name === "R") {
+		} else if (event.name === "r" && event.shift) {
+			// `name` is always the unshifted key, so `=== "R"` never matched and
+			// refresh silently did nothing.
 			loadServers(searchQuery);
 		} else if (event.name === "enter") {
 			handleInstall();
@@ -219,15 +222,17 @@ export function McpRegistryScreen() {
 
 	const renderDetail = () => {
 		if (isLoading) {
-			return <text fg="gray">Loading...</text>;
+			return <text fg={theme.colors.muted}>Loading...</text>;
 		}
 
 		if (error) {
-			return <text fg="red">Error: {error}</text>;
+			return <text fg={theme.colors.danger}>Error: {error}</text>;
 		}
 
 		if (!selectedServer) {
-			return <text fg="gray">Select a server to see details</text>;
+			return (
+				<text fg={theme.colors.muted}>Select a server to see details</text>
+			);
 		}
 
 		const dateDisplay = selectedServer.published_at
@@ -240,40 +245,42 @@ export function McpRegistryScreen() {
 
 		return (
 			<box flexDirection="column">
-				<text fg="magenta">
+				<text fg={theme.colors.accent}>
 					<strong>{selectedServer.name}</strong>
 				</text>
 				<box marginTop={1}>
-					<text>{selectedServer.short_description}</text>
+					<text fg={theme.colors.text}>{selectedServer.short_description}</text>
 				</box>
 				<box marginTop={1}>
-					<text>
+					<text fg={theme.colors.text}>
 						<strong>Version: </strong>
 					</text>
-					<text fg="green">{versionDisplay}</text>
+					<text fg={theme.colors.success}>{versionDisplay}</text>
 				</box>
 				<box>
-					<text>
+					<text fg={theme.colors.text}>
 						<strong>Published: </strong>
 					</text>
-					<text fg="cyan">{dateDisplay}</text>
+					<text fg={theme.colors.info}>{dateDisplay}</text>
 				</box>
 				<box marginTop={1} flexDirection="column">
-					<text>
+					<text fg={theme.colors.text}>
 						<strong>URL:</strong>
 					</text>
-					<text fg="cyan">{selectedServer.url}</text>
+					<text fg={theme.colors.info}>{selectedServer.url}</text>
 				</box>
 				{selectedServer.source_code_url && (
 					<box marginTop={1} flexDirection="column">
-						<text>
+						<text fg={theme.colors.text}>
 							<strong>Source:</strong>
 						</text>
-						<text fg="gray">{selectedServer.source_code_url}</text>
+						<text fg={theme.colors.muted}>
+							{selectedServer.source_code_url}
+						</text>
 					</box>
 				)}
 				<box marginTop={1}>
-					<text fg="green">Press Enter to install</text>
+					<text fg={theme.colors.success}>Press Enter to install</text>
 				</box>
 			</box>
 		);
@@ -286,17 +293,17 @@ export function McpRegistryScreen() {
 	) => {
 		const version = server.version ? ` v${server.version}` : "";
 		return isSelected ? (
-			<text bg="magenta" fg="white">
+			<text bg={theme.colors.accent} fg={theme.hints.fg}>
 				{" "}
 				{server.name}
 				{version}{" "}
 			</text>
 		) : (
-			<text>
+			<text fg={theme.colors.text}>
 				<span>
 					<strong>{server.name}</strong>
 				</span>
-				<span fg="green">{version}</span>
+				<span fg={theme.colors.success}>{version}</span>
 			</text>
 		);
 	};
@@ -333,11 +340,11 @@ export function McpRegistryScreen() {
 			footerHints={footerHints}
 			listPanel={
 				isLoading ? (
-					<text fg="gray">Loading...</text>
+					<text fg={theme.colors.muted}>Loading...</text>
 				) : error ? (
-					<text fg="red">Error: {error}</text>
+					<text fg={theme.colors.danger}>Error: {error}</text>
 				) : servers.length === 0 ? (
-					<text fg="gray">No servers found</text>
+					<text fg={theme.colors.muted}>No servers found</text>
 				) : (
 					<ScrollableList
 						items={servers}

package/src/ui/screens/McpScreen.tsx

@@ -130,7 +130,11 @@ export function McpScreen() {
 				try {
 					await removeMcpServer(server.name, state.projectPath);
 					modal.hideModal();
-					await modal.message("Removed", `${server.name} has been removed.`, "success");
+					await modal.message(
+						"Removed",
+						`${server.name} has been removed.`,
+						"success",
+					);
 					fetchData();
 				} catch (error) {
 					modal.hideModal();
@@ -146,7 +150,8 @@ export function McpScreen() {
 		let config: McpServerConfig;
 
 		if (server.type === "http") {
-			if (!server.url) throw new Error(`${server.name} is missing its HTTP URL`);
+			if (!server.url)
+				throw new Error(`${server.name} is missing its HTTP URL`);
 			config = { type: "http", url: server.url };
 		} else {
 			if (!server.command) {
@@ -184,7 +189,11 @@ export function McpScreen() {
 				if (value === null) return;
 
 				if (field.required && !value) {
-					await modal.message("Required Field", `${field.label} is required.`, "error");
+					await modal.message(
+						"Required Field",
+						`${field.label} is required.`,
+						"error",
+					);
 					return;
 				}
 

package/src/ui/screens/PluginsScreen.tsx

@@ -1,12 +1,16 @@
-import React, { useEffect, useCallback, useMemo } from "react";
+import React, { useEffect, useCallback, useMemo, useState } from "react";
 import { useApp, useModal, useProgress } from "../state/AppContext.js";
+import { asyncValue } from "../state/types.js";
 import { useDimensions } from "../state/DimensionsContext.js";
 import { useKeyboard } from "../hooks/useKeyboard.js";
 import { ScreenLayout } from "../components/layout/index.js";
 import { ScrollableList } from "../components/ScrollableList.js";
 import { EmptyFilterState } from "../components/EmptyFilterState.js";
 import { fuzzyFilter } from "../../utils/fuzzy-search.js";
-import { defaultMarketplaces, getAllMarketplaces } from "../../data/marketplaces.js";
+import {
+	defaultMarketplaces,
+	getAllMarketplaces,
+} from "../../data/marketplaces.js";
 import { clearContentDriftCache } from "../../services/content-drift.js";
 import {
 	diffVersions,
@@ -15,12 +19,14 @@ import {
 } from "../../services/version-snapshot.js";
 import {
 	getAvailablePlugins,
+	getMarketplaceFetchFailures,
 	refreshAllMarketplaces,
 	clearMarketplaceCache,
 	getLocalMarketplacesInfo,
 	isInstalledInScope,
 	resolveScopeAction,
 	saveInstalledPluginVersion,
+	type MarketplaceFetchFailure,
 	type PluginInfo,
 	type ScopeStatus,
 } from "../../services/plugin-manager.js";
@@ -63,6 +69,17 @@ import {
 	renderPluginRow,
 	renderPluginDetail,
 } from "../renderers/pluginRenderers.js";
+import { buildCatalogNoticeText } from "../adapters/catalogNotice.js";
+import { theme } from "../theme.js";
+
+/** Wraps the notice text in the warning-coloured row ScreenLayout renders. */
+function buildCatalogNotice(
+	input: Parameters<typeof buildCatalogNoticeText>[0],
+): React.ReactNode {
+	const text = buildCatalogNoticeText(input);
+	if (!text) return null;
+	return <text fg={theme.colors.warning}>{text}</text>;
+}
 
 export function PluginsScreen() {
 	const { state, dispatch } = useApp();
@@ -77,6 +94,20 @@ export function PluginsScreen() {
 		state.currentRoute.screen === "plugins" &&
 		!state.modal;
 
+	/**
+	 * Catalogs that could not be read from any authoritative source.
+	 *
+	 * Held in state rather than derived at render time because it is an answer
+	 * from the last fetch and must survive until the next one — a failure the user
+	 * cannot see is the bug this screen shipped with.
+	 */
+	const [catalogFailures, setCatalogFailures] = useState<
+		MarketplaceFetchFailure[]
+	>([]);
+
+	/** Re-render tick so the retry countdown in the notice actually counts down. */
+	const [nowTick, setNowTick] = useState(() => Date.now());
+
 	// Fetch data (always fetches all scopes)
 	const fetchData = useCallback(async () => {
 		dispatch({ type: "PLUGINS_DATA_LOADING" });
@@ -85,6 +116,24 @@ export function PluginsScreen() {
 			const allMarketplaces = getAllMarketplaces(localMarketplaces);
 			const pluginData = await getAvailablePlugins(state.projectPath);
 
+			// Which catalogs answered, and which only appeared to. Read straight
+			// after the fetch, while the record still describes this attempt.
+			//
+			// Only failures that survived every authoritative source are worth
+			// reporting: a rate-limited HTTP fetch that the git remote ref then
+			// answered is a non-event for the user, and reporting it would fire a
+			// warning about intended, working behaviour.
+			const unresolved = new Set(
+				pluginData
+					.filter((p) => p.updateCheckFailed)
+					.map((p) => p.marketplace),
+			);
+			setCatalogFailures(
+				getMarketplaceFetchFailures().filter((f) =>
+					unresolved.has(f.marketplace),
+				),
+			);
+
 			// Surface version changes made outside claudeup (Claude Code's own
 			// plugin update, the prerunner, a manual CLI call). Diffing against
 			// what we last rendered catches all of them; logging only what
@@ -127,24 +176,60 @@ export function PluginsScreen() {
 		fetchData();
 	}, [fetchData, state.dataRefreshVersion]);
 
+	/**
+	 * Tick the countdown, and refetch by itself once the rate-limit window reopens.
+	 *
+	 * The user asked "when can I try again" — so the screen answers it and then
+	 * acts on it. Leaving them to press `r` and guess is what makes a rate limit
+	 * feel like a dead end, and a mistimed guess spends another request against the
+	 * limit for nothing.
+	 *
+	 * Only armed while a retry is actually pending, so an untroubled screen runs no
+	 * timer at all.
+	 */
+	const nextRetryAt = useMemo(() => {
+		const times = catalogFailures
+			.map((f) => f.retryAt)
+			.filter((t): t is number => typeof t === "number");
+		return times.length > 0 ? Math.min(...times) : undefined;
+	}, [catalogFailures]);
+
+	useEffect(() => {
+		if (nextRetryAt === undefined) return;
+
+		const tick = setInterval(() => {
+			const now = Date.now();
+			setNowTick(now);
+			if (now >= nextRetryAt) {
+				clearInterval(tick);
+				// The cooldown has expired, so the fetcher will really try again
+				// rather than short-circuit on its own negative cache.
+				clearMarketplaceCache();
+				fetchData();
+			}
+		}, 1000);
+
+		return () => clearInterval(tick);
+	}, [nextRetryAt, fetchData]);
+
+	// The data to render: fresh when loaded, else the previous list while a
+	// reload is in flight. Reading `status === "success"` alone is what made a
+	// tab switch blank the screen — the router remounts this component, which
+	// refetches, and every intermediate frame had nothing to show.
+	const shownMarketplaces = asyncValue(pluginsState.marketplaces);
+	const shownPlugins = asyncValue(pluginsState.plugins);
+	const isReloading =
+		pluginsState.plugins.status === "loading" && shownPlugins !== undefined;
+
 	// Build list items (categories + plugins)
 	const allItems = useMemo((): PluginBrowserItem[] => {
-		if (
-			pluginsState.marketplaces.status !== "success" ||
-			pluginsState.plugins.status !== "success"
-		) {
-			return [];
-		}
+		if (!shownMarketplaces || !shownPlugins) return [];
 		return buildPluginBrowserItems({
-			marketplaces: pluginsState.marketplaces.data,
-			plugins: pluginsState.plugins.data,
+			marketplaces: shownMarketplaces,
+			plugins: shownPlugins,
 			collapsedMarketplaces: pluginsState.collapsedMarketplaces,
 		});
-	}, [
-		pluginsState.marketplaces,
-		pluginsState.plugins,
-		pluginsState.collapsedMarketplaces,
-	]);
+	}, [shownMarketplaces, shownPlugins, pluginsState.collapsedMarketplaces]);
 
 	// Filter items by search query
 	const filteredItems = useMemo(() => {
@@ -297,11 +382,15 @@ export function PluginsScreen() {
 		if (event.name === "r") handleRefresh();
 		else if (event.name === "n") handleShowAddMarketplaceInstructions();
 		else if (event.name === "t") handleShowTeamConfigHelp();
+		// `name` is ALWAYS the unshifted key — Shift+U parses as
+		// {name:"u", shift:true, sequence:"U"}, so `name === "U"` can never be
+		// true. It sat below the plain "u" branch, so pressing Shift+U silently
+		// installed at user scope instead of updating.
+		else if (event.name === "u" && event.shift) handleUpdate();
 		else if (event.name === "u") handleScopeToggle("user");
 		else if (event.name === "p") handleScopeToggle("project");
 		else if (event.name === "l") handleScopeToggle("local");
 		else if (event.name === "d") handleRemoveDeprecated();
-		else if (event.name === "U") handleUpdate();
 		else if (event.name === "a") handleUpdateAll();
 		else if (event.name === "m") handleCheckMismatches();
 		else if (event.name === "s") handleSaveAsProfile();
@@ -993,7 +1082,9 @@ export function PluginsScreen() {
 				// Reinstall under the new namespace in every scope it occupied, so
 				// the migration does not quietly change where the plugin is enabled.
 				const newId = `${plugin.name}@${migrateTo}`;
-				for (const scope of removedFrom.length > 0 ? removedFrom : ["project" as PluginScope]) {
+				for (const scope of removedFrom.length > 0
+					? removedFrom
+					: ["project" as PluginScope]) {
 					modal.loading(
 						`Installing ${newId} (${scope})…\nclaude plugin install ${newId} --scope ${scope}`,
 					);
@@ -1051,30 +1142,47 @@ export function PluginsScreen() {
 
 	// ── Render ─────────────────────────────────────────────────────────────────
 
-	if (
-		pluginsState.marketplaces.status === "loading" ||
-		pluginsState.plugins.status === "loading"
-	) {
-		return (
-			<box flexDirection="column" paddingLeft={1} paddingRight={1}>
-				<text fg="#7e57c2">
-					<strong>claudeup Plugins</strong>
-				</text>
-				<text fg="gray">Loading...</text>
-			</box>
-		);
+	// Only a genuine first load takes over the screen. A reload keeps the list on
+	// screen and says so in the notice line instead.
+	if (!shownMarketplaces || !shownPlugins) {
+		if (
+			pluginsState.marketplaces.status === "loading" ||
+			pluginsState.plugins.status === "loading"
+		) {
+			return (
+				<box flexDirection="column" paddingLeft={1} paddingRight={1}>
+					<text fg={theme.colors.accent}>
+						<strong>claudeup Plugins</strong>
+					</text>
+					<text fg={theme.colors.muted}>
+						Loading plugin catalogs from GitHub…
+					</text>
+				</box>
+			);
+		}
 	}
 
 	if (
 		pluginsState.marketplaces.status === "error" ||
 		pluginsState.plugins.status === "error"
 	) {
+		// Name the error. "Error loading data" told the user nothing and sent them
+		// to the debug pane to find out what claudeup already knew.
+		const failure =
+			pluginsState.plugins.status === "error"
+				? pluginsState.plugins.error
+				: pluginsState.marketplaces.status === "error"
+					? pluginsState.marketplaces.error
+					: undefined;
 		return (
 			<box flexDirection="column" paddingLeft={1} paddingRight={1}>
-				<text fg="#7e57c2">
+				<text fg={theme.colors.accent}>
 					<strong>claudeup Plugins</strong>
 				</text>
-				<text fg="red">Error loading data</text>
+				<text fg={theme.colors.danger}>
+					Could not load plugins: {failure?.message ?? "unknown error"}
+				</text>
+				<text fg={theme.colors.muted}>Press r to retry.</text>
 			</box>
 		);
 	}
@@ -1097,8 +1205,7 @@ export function PluginsScreen() {
 			];
 
 	const scopeLabel = pluginsState.scope === "global" ? "Global" : "Project";
-	const plugins: PluginInfo[] =
-		pluginsState.plugins.status === "success" ? pluginsState.plugins.data : [];
+	const plugins: PluginInfo[] = shownPlugins ?? [];
 	const installedCount = plugins.filter((p) => p.enabled).length;
 	const updateCount = plugins.filter(
 		(p) =>
@@ -1110,10 +1217,22 @@ export function PluginsScreen() {
 	const subtitle = `${scopeLabel} │ ${installedCount} installed${updateCount > 0 ? ` │ ${updateCount} updates` : ""}`;
 	const searchPlaceholder = `${scopeLabel} │ ${installedCount} installed${updateCount > 0 ? ` │ ${updateCount} ⬆` : ""} │ / to search`;
 
+	const notice = isReloading ? (
+		<text fg={theme.colors.muted}>⟳ Refreshing catalogs from GitHub…</text>
+	) : (
+		buildCatalogNotice({
+			failures: catalogFailures,
+			unverifiedPlugins: plugins.filter((p) => p.updateCheckFailed).length,
+			width: dimensions.terminalWidth,
+			now: nowTick,
+		})
+	);
+
 	return (
 		<ScreenLayout
 			title="claudeup Plugins"
 			subtitle={subtitle}
+			notice={notice}
 			currentScreen="plugins"
 			search={{
 				isActive: isSearchActive,

package/src/ui/screens/ProfilesScreen.tsx

@@ -12,10 +12,7 @@ import {
 	exportProfileToJson,
 	importProfileFromJson,
 } from "../../services/profiles.js";
-import {
-	readSettings,
-	writeSettings,
-} from "../../services/claude-settings.js";
+import { readSettings, writeSettings } from "../../services/claude-settings.js";
 import {
 	writeClipboard,
 	readClipboard,
@@ -32,6 +29,7 @@ import {
 	type ProfileListItem,
 } from "../renderers/profileRenderers.js";
 import { ScrollableList } from "../components/ScrollableList.js";
+import { theme } from "../theme.js";
 
 export function ProfilesScreen() {
 	const { state, dispatch } = useApp();
@@ -111,9 +109,7 @@ export function ProfilesScreen() {
 	const handleApplyPredefined = async (profile: PredefinedProfile) => {
 		const allPlugins = [
 			...profile.magusPlugins.map((p) => `${p}@magus`),
-			...profile.anthropicPlugins.map(
-				(p) => `${p}@claude-plugins-official`,
-			),
+			...profile.anthropicPlugins.map((p) => `${p}@claude-plugins-official`),
 		];
 		const settingsCount = Object.keys(profile.settings).length;
 
@@ -161,7 +157,11 @@ export function ProfilesScreen() {
 			);
 		} catch (error) {
 			modal.hideModal();
-			await modal.message("Error", `Failed to apply profile: ${error}`, "error");
+			await modal.message(
+				"Error",
+				`Failed to apply profile: ${error}`,
+				"error",
+			);
 		}
 	};
 
@@ -217,7 +217,11 @@ export function ProfilesScreen() {
 			);
 		} catch (error) {
 			modal.hideModal();
-			await modal.message("Error", `Failed to apply profile: ${error}`, "error");
+			await modal.message(
+				"Error",
+				`Failed to apply profile: ${error}`,
+				"error",
+			);
 		}
 	};
 
@@ -242,7 +246,11 @@ export function ProfilesScreen() {
 			);
 			modal.hideModal();
 			await fetchData();
-			await modal.message("Renamed", `Profile renamed to "${newName.trim()}".`, "success");
+			await modal.message(
+				"Renamed",
+				`Profile renamed to "${newName.trim()}".`,
+				"success",
+			);
 		} catch (error) {
 			modal.hideModal();
 			await modal.message("Error", `Failed to rename: ${error}`, "error");
@@ -345,10 +353,18 @@ export function ProfilesScreen() {
 
 		modal.loading("Importing...");
 		try {
-			const id = await importProfileFromJson(json, targetScope, state.projectPath);
+			const id = await importProfileFromJson(
+				json,
+				targetScope,
+				state.projectPath,
+			);
 			modal.hideModal();
 			await fetchData();
-			await modal.message("Imported", `Profile imported successfully (id: ${id}).`, "success");
+			await modal.message(
+				"Imported",
+				`Profile imported successfully (id: ${id}).`,
+				"success",
+			);
 		} catch (error) {
 			modal.hideModal();
 			await modal.message("Error", `Failed to import: ${error}`, "error");
@@ -362,14 +378,16 @@ export function ProfilesScreen() {
 	const projCount = profileList.filter((p) => p.scope === "project").length;
 
 	const statusContent = (
-		<text>
-			<span fg="blue">{PREDEFINED_PROFILES.length} presets</span>
-			<span fg="gray"> + </span>
-			<span fg="cyan">{userCount} user</span>
-			<span fg="gray"> + </span>
-			<span fg="green">{projCount} project</span>
-			<span fg="gray"> = </span>
-			<span fg="white">{PREDEFINED_PROFILES.length + profileCount} total</span>
+		<text fg={theme.colors.text}>
+			<span fg={theme.colors.link}>{PREDEFINED_PROFILES.length} presets</span>
+			<span fg={theme.colors.muted}> + </span>
+			<span fg={theme.colors.info}>{userCount} user</span>
+			<span fg={theme.colors.muted}> + </span>
+			<span fg={theme.colors.success}>{projCount} project</span>
+			<span fg={theme.colors.muted}> = </span>
+			<span fg={theme.colors.text}>
+				{PREDEFINED_PROFILES.length + profileCount} total
+			</span>
 		</text>
 	);
 
@@ -380,9 +398,7 @@ export function ProfilesScreen() {
 			: profilesState.selectedIndex;
 
 	const loadingStatus =
-		profilesState.profiles.status === "loading"
-			? true
-			: false;
+		profilesState.profiles.status === "loading" ? true : false;
 	const errorMessage =
 		profilesState.profiles.status === "error"
 			? profilesState.profiles.error.message