claudeup 4.10.2 → 4.11.1

package/src/ui/App.tsx

@@ -28,6 +28,12 @@ import {
 	migrateMarketplaceRename,
 	recoverMarketplaceSettings,
 } from "../services/claude-settings.js";
+import {
+	checkPluginVersionMismatches,
+	fixAllPluginVersionMismatches,
+	formatMismatchModal,
+	type VersionMismatchInfo,
+} from "../services/plugin-version-check.js";
 import {
 	checkForUpdates,
 	getCurrentVersion,
@@ -250,6 +256,7 @@ interface AppContentInnerProps {
 	onDebugToggle: () => void;
 	updateInfo: VersionCheckResult | null;
 	onExit: () => void;
+	recoveryReport: string | null;
 }
 
 function AppContentInner({
@@ -257,11 +264,66 @@ function AppContentInner({
 	onDebugToggle,
 	updateInfo,
 	onExit,
+	recoveryReport,
 }: AppContentInnerProps) {
-	const { state, dispatch } = useApp();
+	const { state } = useApp();
 	const { progress } = state;
 	const dimensions = useDimensions();
+
+	return (
+		<box flexDirection="column" height={dimensions.terminalHeight}>
+			{updateInfo?.updateAvailable && <UpdateBanner result={updateInfo} />}
+			{recoveryReport && (
+				<box paddingLeft={1} paddingRight={1}>
+					<text fg="green">✓ Fixed: {recoveryReport}</text>
+				</box>
+			)}
+			{showDebug && (
+				<box paddingLeft={1} paddingRight={1}>
+					<text fg="#888888">
+						DEBUG: {dimensions.terminalWidth}x{dimensions.terminalHeight} |
+						content={dimensions.contentHeight} | screen=
+						{state.currentRoute.screen}
+					</text>
+				</box>
+			)}
+			{progress && <ProgressIndicator {...progress} />}
+			<box
+				flexDirection="column"
+				height={dimensions.contentHeight}
+				paddingLeft={1}
+				paddingRight={1}
+			>
+				<Router />
+			</box>
+			<GlobalKeyHandler onDebugToggle={onDebugToggle} onExit={onExit} />
+			<ModalContainer />
+		</box>
+	);
+}
+
+/**
+ * AppContent Component
+ * Wraps app with DimensionsProvider and manages state for debug/updates
+ */
+interface AppContentProps {
+	onExit: () => void;
+}
+
+function AppContent({ onExit }: AppContentProps) {
+	const { state, dispatch } = useApp();
+	const { progress } = state;
+	const [showDebug, setShowDebug] = useState(false);
+	const [updateInfo, setUpdateInfo] = useState<VersionCheckResult | null>(null);
 	const [recoveryReport, setRecoveryReport] = useState<string | null>(null);
+	const [mismatchData, setMismatchData] = useState<VersionMismatchInfo[] | null>(null);
+
+	// Check for updates on startup (non-blocking)
+	useEffect(() => {
+		checkForUpdates()
+			.then(setUpdateInfo)
+			.catch(() => {});
+	}, []);
 
 	// Auto-dismiss recovery banner after 5 seconds
 	useEffect(() => {
@@ -270,6 +332,72 @@ function AppContentInner({
 		return () => clearTimeout(timer);
 	}, [recoveryReport]);
 
+	// Show mismatch modal when data arrives
+	useEffect(() => {
+		if (!mismatchData || mismatchData.length === 0) return;
+		dispatch({
+			type: "SHOW_MODAL",
+			modal: {
+				type: "select",
+				title: "⚠ Plugin Version Mismatch",
+				message: formatMismatchModal(mismatchData),
+				options: [
+					{
+						label: "Fix all projects",
+						value: "fix",
+						description: "Align all projects to this project's versions",
+					},
+					{
+						label: "Dismiss",
+						value: "dismiss",
+						description: "Ignore for now",
+					},
+				],
+				onSelect: async (value: string) => {
+					dispatch({ type: "HIDE_MODAL" });
+					if (value === "fix") {
+						dispatch({
+							type: "SHOW_PROGRESS",
+							state: { message: "Fixing plugin versions..." },
+						});
+						try {
+							await fixAllPluginVersionMismatches(mismatchData);
+							dispatch({ type: "HIDE_PROGRESS" });
+							dispatch({
+								type: "SHOW_MODAL",
+								modal: {
+									type: "message",
+									title: "Fixed",
+									message:
+										"All plugin versions aligned. Restart Claude Code for changes to take effect.",
+									variant: "success",
+									onDismiss: () => dispatch({ type: "HIDE_MODAL" }),
+								},
+							});
+						} catch {
+							dispatch({ type: "HIDE_PROGRESS" });
+							dispatch({
+								type: "SHOW_MODAL",
+								modal: {
+									type: "message",
+									title: "Error",
+									message: "Failed to fix plugin versions. Try running claudeup again.",
+									variant: "error",
+									onDismiss: () => dispatch({ type: "HIDE_MODAL" }),
+								},
+							});
+						}
+					}
+					setMismatchData(null);
+				},
+				onCancel: () => {
+					dispatch({ type: "HIDE_MODAL" });
+					setMismatchData(null);
+				},
+			},
+		});
+	}, [mismatchData, dispatch]);
+
 	// Auto-refresh marketplaces on startup
 	useEffect(() => {
 		const noRefresh = process.argv.includes("--no-refresh");
@@ -280,10 +408,10 @@ function AppContentInner({
 			state: { message: "Scanning marketplaces..." },
 		});
 
-		// Migrate old marketplace names → magus (idempotent), then repair plugin.json files
+		// Migrate old marketplace names -> magus (idempotent), then repair plugin.json files
 		migrateMarketplaceRename().catch(() => {}); // non-blocking, best-effort
 
-		// Recover stale marketplace registry entries (e.g. "directory" → "github")
+		// Recover stale marketplace registry entries (e.g. "directory" -> "github")
 		recoverMarketplaceSettings()
 			.then(async (recovery) => {
 				const parts: string[] = [];
@@ -302,14 +430,10 @@ function AppContentInner({
 					}
 				}
 				if (recovery.enabledAutoUpdate.length > 0) {
-					parts.push(
-						`auto-update: ${recovery.enabledAutoUpdate.join(", ")}`,
-					);
+					parts.push(`auto-update: ${recovery.enabledAutoUpdate.join(", ")}`);
 				}
 				if (recovery.removed.length > 0) {
-					parts.push(
-						`removed: ${recovery.removed.join(", ")}`,
-					);
+					parts.push(`removed: ${recovery.removed.join(", ")}`);
 				}
 				if (parts.length > 0) {
 					setRecoveryReport(parts.join(" | "));
@@ -317,6 +441,15 @@ function AppContentInner({
 			})
 			.catch(() => {}); // non-fatal
 
+		// Check for plugin version mismatches (the [0] index bug)
+		checkPluginVersionMismatches(process.cwd())
+			.then((mismatches) => {
+				if (mismatches.length > 0) {
+					setMismatchData(mismatches);
+				}
+			})
+			.catch(() => {}); // non-fatal
+
 		repairAllMarketplaces()
 			.then(async () => {
 				dispatch({ type: "HIDE_PROGRESS" });
@@ -327,71 +460,24 @@ function AppContentInner({
 			});
 	}, [dispatch]);
 
-	return (
-		<box flexDirection="column" height={dimensions.terminalHeight}>
-			{updateInfo?.updateAvailable && <UpdateBanner result={updateInfo} />}
-			{recoveryReport && (
-				<box paddingLeft={1} paddingRight={1}>
-					<text fg="green">✓ Fixed: {recoveryReport}</text>
-				</box>
-			)}
-			{showDebug && (
-				<box paddingLeft={1} paddingRight={1}>
-					<text fg="#888888">
-						DEBUG: {dimensions.terminalWidth}x{dimensions.terminalHeight} |
-						content={dimensions.contentHeight} | screen=
-						{state.currentRoute.screen}
-					</text>
-				</box>
-			)}
-			{progress && <ProgressIndicator {...progress} />}
-			<box
-				flexDirection="column"
-				height={dimensions.contentHeight}
-				paddingLeft={1}
-				paddingRight={1}
-			>
-				<Router />
-			</box>
-			<GlobalKeyHandler onDebugToggle={onDebugToggle} onExit={onExit} />
-			<ModalContainer />
-		</box>
-	);
-}
-
-/**
- * AppContent Component
- * Wraps app with DimensionsProvider and manages state for debug/updates
- */
-interface AppContentProps {
-	onExit: () => void;
-}
-
-function AppContent({ onExit }: AppContentProps) {
-	const { state } = useApp();
-	const { progress } = state;
-	const [showDebug, setShowDebug] = useState(false);
-	const [updateInfo, setUpdateInfo] = useState<VersionCheckResult | null>(null);
-
-	// Check for updates on startup (non-blocking)
-	useEffect(() => {
-		checkForUpdates()
-			.then(setUpdateInfo)
-			.catch(() => {});
-	}, []);
+	// Count transient banners for dimension calculation
+	const transientBannerCount =
+		recoveryReport ? 1 : 0;
 
 	return (
 		<DimensionsProvider
 			showProgress={!!progress}
 			showDebug={showDebug}
 			showUpdateBanner={!!updateInfo?.updateAvailable}
+			transientBannerCount={transientBannerCount}
 		>
 			<AppContentInner
 				showDebug={showDebug}
 				onDebugToggle={() => setShowDebug((s) => !s)}
 				updateInfo={updateInfo}
 				onExit={onExit}
-			/>
+				recoveryReport={recoveryReport}
+				/>
 		</DimensionsProvider>
 	);
 }

package/src/ui/screens/PluginsScreen.js

@@ -14,8 +14,9 @@ import { saveProfile } from "../../services/profiles.js";
 import { installPlugin as cliInstallPlugin, uninstallPlugin as cliUninstallPlugin, updatePlugin as cliUpdatePlugin, } from "../../services/claude-cli.js";
 import { getPluginEnvRequirements, getPluginSourcePath, } from "../../services/plugin-mcp-config.js";
 import { getPluginSetupFromSource, checkMissingDeps, installPluginDeps, } from "../../services/plugin-setup.js";
+import { checkSinglePluginMismatch } from "../../services/plugin-version-check.js";
 import { buildPluginBrowserItems, } 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();
     const { plugins: pluginsState } = state;
@@ -140,7 +141,10 @@ 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) });
+            dispatch({
+                type: "PLUGINS_SELECT",
+                index: Math.max(0, pluginsState.selectedIndex - 1),
+            });
             return;
         }
         if (event.name === "down" || event.name === "j") {
@@ -167,12 +171,18 @@ export function PluginsScreen() {
             selectableItems[pluginsState.selectedIndex]?.kind === "category") {
             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,
@@ -223,6 +233,29 @@ export function PluginsScreen() {
             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) => {
+        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 () => {
         progress.show("Refreshing cache...");
@@ -360,7 +393,9 @@ export function PluginsScreen() {
             const result = await installPluginDeps(missing);
             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}`, "error");
             }
             else if (result.installed.length > 0) {
@@ -404,7 +439,10 @@ export function PluginsScreen() {
             const buildScopeLabel = (name, scope, desc) => {
                 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)
@@ -414,9 +452,18 @@ export function PluginsScreen() {
                 return label;
             };
             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);
             if (scopeValue === null)
@@ -428,7 +475,11 @@ export function PluginsScreen() {
                     : plugin.localScope;
             const isInstalledInScope = selectedScope?.enabled;
             const installedVersion = selectedScope?.version;
-            const scopeLabel = scopeValue === "user" ? "User" : scopeValue === "project" ? "Project" : "Local";
+            const scopeLabel = scopeValue === "user"
+                ? "User"
+                : scopeValue === "project"
+                    ? "Project"
+                    : "Local";
             const hasUpdateInScope = isInstalledInScope &&
                 installedVersion &&
                 latestVersion !== "0.0.0" &&
@@ -465,6 +516,9 @@ export function PluginsScreen() {
                 if (action !== "install") {
                     modal.hideModal();
                 }
+                if (action === "update") {
+                    await warnIfVersionMismatch(plugin.id);
+                }
                 fetchData();
             }
             catch (error) {
@@ -486,6 +540,7 @@ export function PluginsScreen() {
                 await saveVersionForScope(plugin.id, plugin.version, scope);
             }
             modal.hideModal();
+            await warnIfVersionMismatch(plugin.id);
             fetchData();
         }
         catch (error) {
@@ -500,6 +555,7 @@ export function PluginsScreen() {
         if (updatable.length === 0)
             return;
         const scope = pluginsState.scope === "global" ? "user" : "project";
+        const updatedPluginIds = [];
         try {
             for (let i = 0; i < updatable.length; i++) {
                 const plugin = updatable[i];
@@ -508,8 +564,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) {
@@ -566,6 +627,9 @@ export function PluginsScreen() {
             if (action !== "install") {
                 modal.hideModal();
             }
+            if (action === "update") {
+                await warnIfVersionMismatch(plugin.id);
+            }
             fetchData();
         }
         catch (error) {
@@ -605,8 +669,14 @@ export function PluginsScreen() {
         if (name === null || !name.trim())
             return;
         const scopeChoice = await modal.select("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;
@@ -638,7 +708,10 @@ export function PluginsScreen() {
     const scopeLabel = pluginsState.scope === "global" ? "Global" : "Project";
     const plugins = 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`;
     return (_jsx(ScreenLayout, { title: "claudeup Plugins", subtitle: subtitle, currentScreen: "plugins", search: {