claudeup 4.10.1 → 4.11.0

package/src/ui/screens/PluginsScreen.tsx

@@ -38,11 +38,15 @@ import {
 	checkMissingDeps,
 	installPluginDeps,
 } from "../../services/plugin-setup.js";
+import { checkSinglePluginMismatch } from "../../services/plugin-version-check.js";
 import {
 	buildPluginBrowserItems,
 	type PluginBrowserItem,
 } from "../adapters/pluginsAdapter.js";
-import { renderPluginRow, renderPluginDetail } from "../renderers/pluginRenderers.js";
+import {
+	renderPluginRow,
+	renderPluginDetail,
+} from "../renderers/pluginRenderers.js";
 
 export function PluginsScreen() {
 	const { state, dispatch } = useApp();
@@ -180,15 +184,23 @@ export function PluginsScreen() {
 		}
 
 		if (event.name === "up" || event.name === "k") {
-			if (isSearchActive) dispatch({ type: "SET_SEARCHING", isSearching: false });
-			dispatch({ type: "PLUGINS_SELECT", index: Math.max(0, pluginsState.selectedIndex - 1) });
+			if (isSearchActive)
+				dispatch({ type: "SET_SEARCHING", isSearching: false });
+			dispatch({
+				type: "PLUGINS_SELECT",
+				index: Math.max(0, pluginsState.selectedIndex - 1),
+			});
 			return;
 		}
 		if (event.name === "down" || event.name === "j") {
-			if (isSearchActive) dispatch({ type: "SET_SEARCHING", isSearching: false });
+			if (isSearchActive)
+				dispatch({ type: "SET_SEARCHING", isSearching: false });
 			dispatch({
 				type: "PLUGINS_SELECT",
-				index: Math.min(selectableItems.length - 1, pluginsState.selectedIndex + 1),
+				index: Math.min(
+					selectableItems.length - 1,
+					pluginsState.selectedIndex + 1,
+				),
 			});
 			return;
 		}
@@ -211,13 +223,21 @@ export function PluginsScreen() {
 		) {
 			const item = selectableItems[pluginsState.selectedIndex];
 			if (item?.kind === "category") {
-				dispatch({ type: "PLUGINS_TOGGLE_MARKETPLACE", name: item.marketplace.name });
+				dispatch({
+					type: "PLUGINS_TOGGLE_MARKETPLACE",
+					name: item.marketplace.name,
+				});
 			}
 			return;
 		}
 
 		if (isSearchActive) {
-			if (event.name.length === 1 && !event.ctrl && !event.meta && !/[0-9]/.test(event.name)) {
+			if (
+				event.name.length === 1 &&
+				!event.ctrl &&
+				!event.meta &&
+				!/[0-9]/.test(event.name)
+			) {
 				dispatch({
 					type: "PLUGINS_SET_SEARCH",
 					query: pluginsState.searchQuery + event.name,
@@ -259,12 +279,43 @@ export function PluginsScreen() {
 		if (scope === "user") {
 			await saveGlobalInstalledPluginVersion(pluginId, version);
 		} else if (scope === "local") {
-			await saveLocalInstalledPluginVersion(pluginId, version, state.projectPath);
+			await saveLocalInstalledPluginVersion(
+				pluginId,
+				version,
+				state.projectPath,
+			);
 		} else {
 			await saveInstalledPluginVersion(pluginId, version, state.projectPath);
 		}
 	};
 
+	/**
+	 * Check for version mismatch after a plugin update and warn the user.
+	 * The [0] index bug in Claude Code means the update may not actually
+	 * take effect if another project's entry is at index 0.
+	 */
+	const warnIfVersionMismatch = async (pluginId: string): Promise<void> => {
+		try {
+			const projectPath = state.projectPath || process.cwd();
+			const mismatch = await checkSinglePluginMismatch(pluginId, projectPath);
+			if (mismatch) {
+				await modal.message(
+					"Version Mismatch Warning",
+					`${pluginId} was updated to v${mismatch.currentProjectVersion} for this project, ` +
+						`but Claude Code will load v${mismatch.firstEntryVersion} due to a known bug.\n\n` +
+						`The plugin loader always uses the first entry in installed_plugins.json, ` +
+						`which belongs to another project.\n\n` +
+						`Bug: https://github.com/anthropics/claude-code/issues/45997\n\n` +
+						`To fix: open claudeup and use the version alignment tool, ` +
+						`or update the plugin in all projects to the same version.`,
+					"error",
+				);
+			}
+		} catch {
+			// Non-fatal: mismatch check is best-effort
+		}
+	};
+
 	// ── Action handlers ────────────────────────────────────────────────────────
 
 	const handleRefresh = async () => {
@@ -351,7 +402,10 @@ export function PluginsScreen() {
 			const pluginSource = await getPluginSourcePath(marketplace, pluginName);
 			if (!pluginSource) return true;
 
-			const requirements = await getPluginEnvRequirements(marketplace, pluginSource);
+			const requirements = await getPluginEnvRequirements(
+				marketplace,
+				pluginSource,
+			);
 			if (requirements.length === 0) return true;
 
 			const existingEnvVars = await getMcpEnvVars(state.projectPath);
@@ -441,7 +495,8 @@ export function PluginsScreen() {
 			if (missing.pip?.length) parts.push(`pip: ${missing.pip.join(", ")}`);
 			if (missing.brew?.length) parts.push(`brew: ${missing.brew.join(", ")}`);
 			if (missing.npm?.length) parts.push(`npm: ${missing.npm.join(", ")}`);
-			if (missing.cargo?.length) parts.push(`cargo: ${missing.cargo.join(", ")}`);
+			if (missing.cargo?.length)
+				parts.push(`cargo: ${missing.cargo.join(", ")}`);
 
 			const wantInstall = await modal.confirm(
 				"Install Dependencies?",
@@ -455,7 +510,9 @@ export function PluginsScreen() {
 			modal.hideModal();
 
 			if (result.failed.length > 0) {
-				const failMsg = result.failed.map((f) => `${f.pkg}: ${f.error}`).join("\n");
+				const failMsg = result.failed
+					.map((f) => `${f.pkg}: ${f.error}`)
+					.join("\n");
 				await modal.message(
 					"Partial Install",
 					`Installed: ${result.installed.length}\nFailed:\n${failMsg}`,
@@ -516,7 +573,11 @@ export function PluginsScreen() {
 			) => {
 				const installed = scope?.enabled;
 				const ver = scope?.version;
-				const hasUpdate = ver && latestVersion && ver !== latestVersion && latestVersion !== "0.0.0";
+				const hasUpdate =
+					ver &&
+					latestVersion &&
+					ver !== latestVersion &&
+					latestVersion !== "0.0.0";
 				let label = installed ? `● ${name}` : `○ ${name}`;
 				label += ` (${desc})`;
 				if (ver) label += ` v${ver}`;
@@ -525,12 +586,25 @@ export function PluginsScreen() {
 			};
 
 			const scopeOptions = [
-				{ label: buildScopeLabel("User", plugin.userScope, "global"), value: "user" },
-				{ label: buildScopeLabel("Project", plugin.projectScope, "team"), value: "project" },
-				{ label: buildScopeLabel("Local", plugin.localScope, "private"), value: "local" },
+				{
+					label: buildScopeLabel("User", plugin.userScope, "global"),
+					value: "user",
+				},
+				{
+					label: buildScopeLabel("Project", plugin.projectScope, "team"),
+					value: "project",
+				},
+				{
+					label: buildScopeLabel("Local", plugin.localScope, "private"),
+					value: "local",
+				},
 			];
 
-			const scopeValue = await modal.select(plugin.name, `Select scope to toggle:`, scopeOptions);
+			const scopeValue = await modal.select(
+				plugin.name,
+				`Select scope to toggle:`,
+				scopeOptions,
+			);
 			if (scopeValue === null) return;
 
 			const selectedScope =
@@ -542,7 +616,11 @@ export function PluginsScreen() {
 			const isInstalledInScope = selectedScope?.enabled;
 			const installedVersion = selectedScope?.version;
 			const scopeLabel =
-				scopeValue === "user" ? "User" : scopeValue === "project" ? "Project" : "Local";
+				scopeValue === "user"
+					? "User"
+					: scopeValue === "project"
+						? "Project"
+						: "Local";
 
 			const hasUpdateInScope =
 				isInstalledInScope &&
@@ -585,6 +663,9 @@ export function PluginsScreen() {
 				if (action !== "install") {
 					modal.hideModal();
 				}
+				if (action === "update") {
+					await warnIfVersionMismatch(plugin.id);
+				}
 				fetchData();
 			} catch (error) {
 				modal.hideModal();
@@ -598,7 +679,8 @@ export function PluginsScreen() {
 		if (!item || item.kind !== "plugin" || !item.plugin.hasUpdate) return;
 
 		const plugin = item.plugin;
-		const scope: PluginScope = pluginsState.scope === "global" ? "user" : "project";
+		const scope: PluginScope =
+			pluginsState.scope === "global" ? "user" : "project";
 
 		modal.loading(
 			`Updating ${plugin.name}…\nclaude plugin install ${plugin.id} --scope ${scope}`,
@@ -609,6 +691,7 @@ export function PluginsScreen() {
 				await saveVersionForScope(plugin.id, plugin.version, scope);
 			}
 			modal.hideModal();
+			await warnIfVersionMismatch(plugin.id);
 			fetchData();
 		} catch (error) {
 			modal.hideModal();
@@ -622,7 +705,9 @@ export function PluginsScreen() {
 		const updatable = pluginsState.plugins.data.filter((p) => p.hasUpdate);
 		if (updatable.length === 0) return;
 
-		const scope: PluginScope = pluginsState.scope === "global" ? "user" : "project";
+		const scope: PluginScope =
+			pluginsState.scope === "global" ? "user" : "project";
+		const updatedPluginIds: string[] = [];
 
 		try {
 			for (let i = 0; i < updatable.length; i++) {
@@ -634,8 +719,13 @@ export function PluginsScreen() {
 				if (plugin.version) {
 					await saveVersionForScope(plugin.id, plugin.version, scope);
 				}
+				updatedPluginIds.push(plugin.id);
 			}
 			modal.hideModal();
+			// Check for mismatches on all updated plugins
+			for (const pluginId of updatedPluginIds) {
+				await warnIfVersionMismatch(pluginId);
+			}
 			fetchData();
 		} catch (error) {
 			modal.hideModal();
@@ -701,6 +791,9 @@ export function PluginsScreen() {
 			if (action !== "install") {
 				modal.hideModal();
 			}
+			if (action === "update") {
+				await warnIfVersionMismatch(plugin.id);
+			}
 			fetchData();
 		} catch (error) {
 			modal.hideModal();
@@ -745,8 +838,14 @@ export function PluginsScreen() {
 			"Save to scope",
 			"Where should this profile be saved?",
 			[
-				{ label: "User — ~/.claude/profiles.json (available everywhere)", value: "user" },
-				{ label: "Project — .claude/profiles.json (shared with team via git)", value: "project" },
+				{
+					label: "User — ~/.claude/profiles.json (available everywhere)",
+					value: "user",
+				},
+				{
+					label: "Project — .claude/profiles.json (shared with team via git)",
+					value: "project",
+				},
 			],
 		);
 		if (scopeChoice === null) return;
@@ -808,7 +907,13 @@ export function PluginsScreen() {
 	const plugins: PluginInfo[] =
 		pluginsState.plugins.status === "success" ? pluginsState.plugins.data : [];
 	const installedCount = plugins.filter((p) => p.enabled).length;
-	const updateCount = plugins.filter((p) => p.hasUpdate && (p.userScope?.enabled || p.projectScope?.enabled || p.localScope?.enabled)).length;
+	const updateCount = plugins.filter(
+		(p) =>
+			p.hasUpdate &&
+			(p.userScope?.enabled ||
+				p.projectScope?.enabled ||
+				p.localScope?.enabled),
+	).length;
 	const subtitle = `${scopeLabel} │ ${installedCount} installed${updateCount > 0 ? ` │ ${updateCount} updates` : ""}`;
 	const searchPlaceholder = `${scopeLabel} │ ${installedCount} installed${updateCount > 0 ? ` │ ${updateCount} ⬆` : ""} │ / to search`;
 
@@ -833,11 +938,17 @@ export function PluginsScreen() {
 						getKey={(item) => item.id}
 					/>
 					{pluginsState.searchQuery && selectableItems.length === 0 && (
-						<EmptyFilterState query={pluginsState.searchQuery} entityName="plugins" />
+						<EmptyFilterState
+							query={pluginsState.searchQuery}
+							entityName="plugins"
+						/>
 					)}
 				</box>
 			}
-			detailPanel={renderPluginDetail(selectedItem, pluginsState.collapsedMarketplaces)}
+			detailPanel={renderPluginDetail(
+				selectedItem,
+				pluginsState.collapsedMarketplaces,
+			)}
 		/>
 	);
 }

package/src/ui/state/DimensionsContext.js

@@ -7,7 +7,7 @@ const SCREEN_HEADER_HEIGHT = 4; // ScreenLayout: border + title row + status/sea
 const SCREEN_FOOTER_HEIGHT = 2; // ScreenLayout: border-top + footer content
 const APP_MARGINS = 1; // buffer for margins/padding
 const PROGRESS_HEIGHT = 1; // when visible
-function calculateDimensions(columns, rows, showProgress, showDebug, showUpdateBanner) {
+function calculateDimensions(columns, rows, showProgress, showDebug, showUpdateBanner, transientBannerCount) {
     const terminalWidth = columns;
     const terminalHeight = rows;
     // Calculate total available height for ScreenLayout (includes its header, panels, footer)
@@ -18,6 +18,7 @@ function calculateDimensions(columns, rows, showProgress, showDebug, showUpdateB
         contentHeight -= 1;
     if (showUpdateBanner)
         contentHeight -= 1;
+    contentHeight -= transientBannerCount;
     contentHeight = Math.max(10, contentHeight); // Minimum 10 lines for full layout
     // Calculate available content width (accounting for padding)
     const contentWidth = Math.max(40, terminalWidth - 4);
@@ -33,22 +34,23 @@ function calculateDimensions(columns, rows, showProgress, showDebug, showUpdateB
         listPanelHeight,
     };
 }
-export function DimensionsProvider({ children, showProgress = false, showDebug = false, showUpdateBanner = false, }) {
+export function DimensionsProvider({ children, showProgress = false, showDebug = false, showUpdateBanner = false, transientBannerCount = 0, }) {
     const renderer = useRenderer();
-    const [dimensions, setDimensions] = useState(() => calculateDimensions(renderer.width, renderer.height, showProgress, showDebug, showUpdateBanner));
+    const [dimensions, setDimensions] = useState(() => calculateDimensions(renderer.width, renderer.height, showProgress, showDebug, showUpdateBanner, transientBannerCount));
     // Handle terminal resize
     useOnResize((width, height) => {
-        setDimensions(calculateDimensions(width, height, showProgress, showDebug, showUpdateBanner));
+        setDimensions(calculateDimensions(width, height, showProgress, showDebug, showUpdateBanner, transientBannerCount));
     });
-    // Update when showProgress/showDebug/showUpdateBanner changes
+    // Update when showProgress/showDebug/showUpdateBanner/transientBannerCount changes
     useEffect(() => {
-        setDimensions(calculateDimensions(renderer.width, renderer.height, showProgress, showDebug, showUpdateBanner));
+        setDimensions(calculateDimensions(renderer.width, renderer.height, showProgress, showDebug, showUpdateBanner, transientBannerCount));
     }, [
         renderer.width,
         renderer.height,
         showProgress,
         showDebug,
         showUpdateBanner,
+        transientBannerCount,
     ]);
     return (_jsx(DimensionsContext.Provider, { value: dimensions, children: children }));
 }

package/src/ui/state/DimensionsContext.tsx

@@ -30,6 +30,8 @@ interface DimensionsProviderProps {
 	showDebug?: boolean;
 	/** Whether update banner is visible */
 	showUpdateBanner?: boolean;
+	/** Number of transient banners (recovery, mismatch) currently visible */
+	transientBannerCount?: number;
 }
 
 function calculateDimensions(
@@ -38,6 +40,7 @@ function calculateDimensions(
 	showProgress: boolean,
 	showDebug: boolean,
 	showUpdateBanner: boolean,
+	transientBannerCount: number,
 ): Dimensions {
 	const terminalWidth = columns;
 	const terminalHeight = rows;
@@ -47,6 +50,7 @@ function calculateDimensions(
 	if (showProgress) contentHeight -= PROGRESS_HEIGHT;
 	if (showDebug) contentHeight -= 1;
 	if (showUpdateBanner) contentHeight -= 1;
+	contentHeight -= transientBannerCount;
 	contentHeight = Math.max(10, contentHeight); // Minimum 10 lines for full layout
 
 	// Calculate available content width (accounting for padding)
@@ -74,6 +78,7 @@ export function DimensionsProvider({
 	showProgress = false,
 	showDebug = false,
 	showUpdateBanner = false,
+	transientBannerCount = 0,
 }: DimensionsProviderProps) {
 	const renderer = useRenderer();
 
@@ -84,6 +89,7 @@ export function DimensionsProvider({
 			showProgress,
 			showDebug,
 			showUpdateBanner,
+			transientBannerCount,
 		),
 	);
 
@@ -96,11 +102,12 @@ export function DimensionsProvider({
 				showProgress,
 				showDebug,
 				showUpdateBanner,
+				transientBannerCount,
 			),
 		);
 	});
 
-	// Update when showProgress/showDebug/showUpdateBanner changes
+	// Update when showProgress/showDebug/showUpdateBanner/transientBannerCount changes
 	useEffect(() => {
 		setDimensions(
 			calculateDimensions(
@@ -109,6 +116,7 @@ export function DimensionsProvider({
 				showProgress,
 				showDebug,
 				showUpdateBanner,
+				transientBannerCount,
 			),
 		);
 	}, [
@@ -117,6 +125,7 @@ export function DimensionsProvider({
 		showProgress,
 		showDebug,
 		showUpdateBanner,
+		transientBannerCount,
 	]);
 
 	return (