magus-cli 7.5.4 → 7.7.0

package/src/ui/input/KeyRouter.tsx

@@ -25,6 +25,10 @@
  * The paste event is deliberately NOT stopped: OpenTUI hands it to the focused
  * renderable afterwards, which is how the input modal's `<input>` still takes a
  * paste of its own — exactly the arrangement the modal layer relies on for keys.
+ *
+ * With ONE exception, for keys and pastes alike: an event never reaches a
+ * renderable that took focus while this router was dispatching it. See
+ * {@link dispatchThenGuardFocus}.
  */
 
 import { appendFileSync } from "node:fs";
@@ -133,6 +137,41 @@ function describeKey(key: KeyPress): string {
 	return `name=${JSON.stringify(key.name)} seq=${JSON.stringify(key.sequence)} ctrl=${key.ctrl} meta=${key.meta} shift=${key.shift}`;
 }
 
+/**
+ * Run `dispatch` for one key or paste event, committed synchronously, and then
+ * keep that event away from any renderable that took focus DURING it.
+ *
+ * OpenTUI delivers an event in two phases: every global listener first (this
+ * router is one), then every focused renderable. The renderable set is read
+ * AFTER the global phase returns (`InternalKeyHandler.emitWithPriority` in
+ * @opentui/core 0.1.107), not when the event arrived. And `flushSync` commits
+ * inside the global phase, so a modal this key opened is mounted, and its
+ * `<input focused>` has registered its handler, before that read happens.
+ * Left alone, the one keypress acts twice. MEASURED: Enter on "Save what you
+ * have" in the startup select opened the "Save as a new profile" input AND
+ * submitted its prefilled name, so the profile was created with no chance to
+ * type. By the same path, a screen key that opens an input before its first
+ * `await` (`n` on Styles, `r` on Profiles) reaches the new box as a typed
+ * letter, and Enter on such a row submits it.
+ *
+ * So the rule: an event goes to the renderable that held focus when it was
+ * pressed, or to nobody. When focus moved during dispatch, `preventDefault()`
+ * makes OpenTUI skip the renderable phase. Keys meant for an input modal that
+ * was already open are untouched: the router's modal layer does not move focus
+ * for them, and they reach the `<input>` as before.
+ */
+function dispatchThenGuardFocus(
+	renderer: { readonly currentFocusedRenderable: unknown },
+	event: { preventDefault(): void },
+	dispatch: () => void,
+): void {
+	const focusedBefore = renderer.currentFocusedRenderable;
+	flushSync(dispatch);
+	if (renderer.currentFocusedRenderable !== focusedBefore) {
+		event.preventDefault();
+	}
+}
+
 export function KeyRouter({ children }: { children: ReactNode }) {
 	const [layers] = useState<LayerRegistry>(() => ({
 		keys: new Set<KeyLayer>(),
@@ -143,7 +182,7 @@ export function KeyRouter({ children }: { children: ReactNode }) {
 	useKeyboard((event) => {
 		const key = toKeyPress(event);
 		let consumer: KeyLayerId | null = null;
-		flushSync(() => {
+		dispatchThenGuardFocus(renderer, event, () => {
 			consumer = dispatchKey([...layers.keys], key);
 		});
 		logKey(describeKey(key), consumer);
@@ -156,7 +195,9 @@ export function KeyRouter({ children }: { children: ReactNode }) {
 		const onPaste = (event: PasteEvent): void => {
 			const text = pastedText(event);
 			let consumer: KeyLayerId | null = null;
-			flushSync(() => {
+			// Same guard as keys: no paste handler moves focus today, but a paste
+			// that did must not land in the box it just opened.
+			dispatchThenGuardFocus(renderer, event, () => {
 				consumer = dispatchPaste([...layers.pastes], text);
 			});
 			logKey(`paste=${JSON.stringify(text)}`, consumer);

package/src/ui/screens/AliasScreen.tsx

@@ -39,7 +39,7 @@ import {
 import { ScreenLayout } from "../components/layout/index.js";
 import { useScreenKeys } from "../input/KeyRouter.js";
 import { moveDirection } from "../keymap.js";
-import { useApp, useModal } from "../state/AppContext.js";
+import { useApp, useModal, useNotify } from "../state/AppContext.js";
 import { displayWidth, truncate } from "../text-width.js";
 import { theme } from "../theme.js";
 
@@ -114,6 +114,7 @@ type ViewMode = { kind: "main" } | { kind: "flag-detail"; flagId: string };
 export function AliasScreen() {
 	const { state } = useApp();
 	const modal = useModal();
+	const notify = useNotify();
 
 	const [config, setConfig] = useState<AliasConfig | null>(null);
 	const [shells, setShells] = useState<ShellTarget[]>([]);
@@ -565,10 +566,10 @@ export function AliasScreen() {
 			shells.find((s) => s.exists);
 
 		if (!target) {
-			await modal.message(
-				"No shells detected",
-				"No supported rc files found. Create ~/.zshrc, ~/.bashrc, or ~/.config/fish/config.fish first.",
-				"info",
+			// Nothing was written. Named files, because creating one is the fix.
+			notify(
+				"No shell config to write to — create ~/.zshrc, ~/.bashrc or ~/.config/fish/config.fish first",
+				"warning",
 			);
 			return;
 		}
@@ -602,7 +603,7 @@ export function AliasScreen() {
 				"error",
 			);
 		}
-	}, [config, shells, modal, pendingAdoptRange]);
+	}, [config, shells, modal, notify, pendingAdoptRange]);
 
 	// ── Keyboard ──────────────────────────────────────────────────────────
 	// j/k navigate the selectable subset, jumping over headers/legend lines.

package/src/ui/screens/CliToolsScreen.tsx

@@ -4,7 +4,7 @@ import React, { useEffect, useCallback, useState, useRef } from "react";
 import { ScreenLayout } from "../components/layout/index.js";
 import { useScreenKeys } from "../input/KeyRouter.js";
 import { moveDirection } from "../keymap.js";
-import { useApp, useModal } from "../state/AppContext.js";
+import { useApp, useModal, useNotify } from "../state/AppContext.js";
 import { useDimensions } from "../state/DimensionsContext.js";
 
 import { cliTools } from "../../data/cli-tools.js";
@@ -91,6 +91,7 @@ export function CliToolsScreen() {
 	const { state, dispatch } = useApp();
 	const { cliTools: cliToolsState } = state;
 	const modal = useModal();
+	const notify = useNotify();
 	const dimensions = useDimensions();
 
 	const [rows, setRows] = useState<CliToolRow[]>(
@@ -333,21 +334,27 @@ export function CliToolsScreen() {
 
 		modal.hideModal();
 
-		const report = [
-			errors.length > 0
-				? `These removals failed. Run them by hand:\n${errors.join("\n")}`
-				: "",
+		const stays =
 			leftBehind.length > 0
 				? `${stuckList(leftBehind)}\nRemove it by hand if you want it gone.`
-				: "",
-		].filter((part) => part !== "");
+				: "";
 
-		if (report.length > 0) {
+		// A failed removal is an error, and stays a dialog with the commands to
+		// run. An install magus could never remove is only a warning: nothing
+		// failed, and the row still shows the conflict until it is dealt with.
+		if (errors.length > 0) {
 			await modal.message(
-				errors.length > 0 ? "Partly removed" : "One install stays",
-				report.join("\n\n"),
-				errors.length > 0 ? "error" : "info",
+				"Partly removed",
+				[
+					`These removals failed. Run them by hand:\n${errors.join("\n")}`,
+					stays,
+				]
+					.filter((part) => part !== "")
+					.join("\n\n"),
+				"error",
 			);
+		} else if (stays !== "") {
+			notify(stays.replace(/\n/g, " "), "warning");
 		}
 
 		handleRefresh();
@@ -359,11 +366,7 @@ export function CliToolsScreen() {
 		// it anyway" the CLI no longer does either.
 		const updatable = rows.filter((r) => r.status?.state === "upgrade");
 		if (updatable.length === 0) {
-			await modal.message(
-				"Up to Date",
-				"No tool is known to be behind.",
-				"info",
-			);
+			notify("No tool is known to be behind");
 			return;
 		}
 

package/src/ui/screens/EnvVarsScreen.tsx

@@ -54,9 +54,12 @@ export function SettingsScreen() {
 		}
 	}, [dispatch, state.projectPath]);
 
+	// Load data on mount or when dataRefreshVersion changes — a profile
+	// activating changes what this screen shows.
+	// biome-ignore lint/correctness/useExhaustiveDependencies: dataRefreshVersion is the external refresh trigger; bumping it must re-run the fetch even though the body never reads it
 	useEffect(() => {
 		fetchData();
-	}, [fetchData]);
+	}, [fetchData, state.dataRefreshVersion]);
 
 	const listItems = useMemo((): SettingsBrowserItem[] => {
 		if (settings.values.status !== "success") return [];

package/src/ui/screens/GitignoreScreen.tsx

@@ -19,7 +19,7 @@ import {
 	type RuleRow,
 	renderRuleRow,
 } from "../renderers/gitignoreRenderers.js";
-import { useApp, useModal } from "../state/AppContext.js";
+import { useApp, useModal, useNotify } from "../state/AppContext.js";
 import { theme } from "../theme.js";
 
 // Clean rows are grouped by the manifest that defined them. Order = display
@@ -36,6 +36,7 @@ const SOURCE_LABELS: Record<Tier, string> = {
 export function GitignoreScreen() {
 	const { state } = useApp();
 	const modal = useModal();
+	const notify = useNotify();
 	const renderer = useRenderer();
 	const cwd = state.projectPath;
 
@@ -57,9 +58,12 @@ export function GitignoreScreen() {
 		}
 	}, [cwd]);
 
+	// Load on mount or when dataRefreshVersion changes — a profile activating
+	// can turn committed files into generated ones this screen lists.
+	// biome-ignore lint/correctness/useExhaustiveDependencies: dataRefreshVersion is the external refresh trigger; bumping it must re-run the load even though the body never reads it
 	useEffect(() => {
 		void reload();
-	}, [reload]);
+	}, [reload, state.dataRefreshVersion]);
 
 	// Build the managed list: every desired gitignore rule, with all matching
 	// violations grouped under the rule that owns them.
@@ -163,19 +167,11 @@ export function GitignoreScreen() {
 	// Fix just the highlighted row.
 	const handleFixOne = useCallback(async () => {
 		if (!selectedRow) {
-			await modal.message(
-				"No row selected",
-				"Use ↑↓ to highlight a row that needs fixing, then press f.",
-				"info",
-			);
+			notify("Highlight a row that needs fixing, then press f", "warning");
 			return;
 		}
 		if (selectedRow.violations.length === 0) {
-			await modal.message(
-				"Nothing to fix",
-				`${selectedRow.rule.pattern} already matches. f only applies to rows that need fixing.`,
-				"info",
-			);
+			notify(`${selectedRow.rule.pattern} already matches — nothing to fix`);
 			return;
 		}
 
@@ -204,16 +200,12 @@ export function GitignoreScreen() {
 				"error",
 			);
 		}
-	}, [selectedRow, modal, cwd, reload]);
+	}, [selectedRow, modal, notify, cwd, reload]);
 
 	const handleApplyTemplate = useCallback(async () => {
 		const names = Object.keys(BUILTIN_TEMPLATES);
 		if (names.length === 0) {
-			await modal.message(
-				"No templates",
-				"No built-in templates available.",
-				"info",
-			);
+			notify("No built-in templates available", "warning");
 			return;
 		}
 		const selected = await modal.select(
@@ -224,15 +216,16 @@ export function GitignoreScreen() {
 		if (!selected) return;
 		try {
 			const r = await applyTemplate(cwd, selected);
-			const conflictNote =
-				r.conflicts.length > 0
-					? `\n\nSkipped due to conflicts: ${r.conflicts.join(", ")}`
-					: "";
-			await modal.message(
-				"Template applied",
-				`Wrote ${r.appliedTo}\n\nAdded ${r.added.ignore.length} ignore + ${r.added.track.length} track entries.${conflictNote}`,
-				"success",
+			notify(
+				`Applied "${selected}": ${r.added.ignore.length} ignore + ${r.added.track.length} track entries`,
 			);
+			// Skipped entries are not visible in the list, so they get their own line.
+			if (r.conflicts.length > 0) {
+				notify(
+					`Skipped, conflicting with existing rules: ${r.conflicts.join(", ")}`,
+					"warning",
+				);
+			}
 		} catch (err) {
 			await modal.message(
 				"Template failed",
@@ -241,7 +234,7 @@ export function GitignoreScreen() {
 			);
 		}
 		await reload();
-	}, [cwd, modal, reload]);
+	}, [cwd, modal, notify, reload]);
 
 	/**
 	 * Open the project manifest in $EDITOR, creating it first if needed.

package/src/ui/screens/McpRegistryScreen.tsx

@@ -2,7 +2,12 @@ import React, { useEffect, useCallback, useState, useRef } from "react";
 import { ScreenLayout } from "../components/layout/index.js";
 import { useScreenKeys, useSearchInput } from "../input/KeyRouter.js";
 import { moveDirection } from "../keymap.js";
-import { useApp, useModal, useNavigation } from "../state/AppContext.js";
+import {
+	useApp,
+	useModal,
+	useNavigation,
+	useNotify,
+} from "../state/AppContext.js";
 import { useDimensions } from "../state/DimensionsContext.js";
 
 import { addMcpServer, setAllowMcp } from "../../services/claude-settings.js";
@@ -75,6 +80,7 @@ export function McpRegistryScreen() {
 	const { state, dispatch } = useApp();
 	const { mcpRegistry } = state;
 	const modal = useModal();
+	const notify = useNotify();
 	const { navigateToScreen } = useNavigation();
 	const dimensions = useDimensions();
 
@@ -190,11 +196,8 @@ export function McpRegistryScreen() {
 			await setAllowMcp(true, state.projectPath);
 			await addMcpServer(server.name, config, state.projectPath);
 			modal.hideModal();
-			await modal.message(
-				"Installed",
-				`${server.name} has been configured.\n\nRestart Claude Code to activate.`,
-				"success",
-			);
+			// A warning: the server does nothing until the user restarts.
+			notify(`Added ${server.name} — restart Claude Code to use it`, "warning");
 		} catch (error) {
 			modal.hideModal();
 			await modal.message("Error", `Failed to install: ${error}`, "error");

package/src/ui/screens/McpScreen.tsx

@@ -2,7 +2,12 @@ import React, { useEffect, useCallback, useMemo } from "react";
 import { ScreenLayout } from "../components/layout/index.js";
 import { useScreenKeys } from "../input/KeyRouter.js";
 import { moveDirection } from "../keymap.js";
-import { useApp, useModal, useNavigation } from "../state/AppContext.js";
+import {
+	useApp,
+	useModal,
+	useNavigation,
+	useNotify,
+} from "../state/AppContext.js";
 import { useDimensions } from "../state/DimensionsContext.js";
 
 import {
@@ -30,6 +35,7 @@ export function McpScreen() {
 	const { state, dispatch } = useApp();
 	const { mcp } = state;
 	const modal = useModal();
+	const notify = useNotify();
 	const { navigateToScreen } = useNavigation();
 	const dimensions = useDimensions();
 
@@ -69,9 +75,12 @@ export function McpScreen() {
 		}
 	}, [dispatch, state.projectPath]);
 
+	// Load data on mount or when dataRefreshVersion changes — a profile
+	// activating changes what this screen shows.
+	// biome-ignore lint/correctness/useExhaustiveDependencies: dataRefreshVersion is the external refresh trigger; bumping it must re-run the fetch even though the body never reads it
 	useEffect(() => {
 		fetchData();
-	}, [fetchData]);
+	}, [fetchData, state.dataRefreshVersion]);
 
 	const allListItems = useMemo((): McpListItem[] => {
 		if (mcp.servers.status !== "success") return [];
@@ -138,11 +147,7 @@ export function McpScreen() {
 				try {
 					await removeMcpServer(server.name, state.projectPath);
 					modal.hideModal();
-					await modal.message(
-						"Removed",
-						`${server.name} has been removed.`,
-						"success",
-					);
+					// The row turns uninstalled; nothing else to say.
 					fetchData();
 				} catch (error) {
 					modal.hideModal();
@@ -216,11 +221,10 @@ export function McpScreen() {
 		try {
 			await addMcpServer(server.name, config, state.projectPath);
 			modal.hideModal();
-			await modal.message(
-				"Installed",
-				`${server.name} has been configured.\n\nRestart Claude Code to activate.`,
-				"success",
-			);
+			// The row shows it installed; the restart it needs does not show,
+			// and it is something the user has to do — so a warning, which also
+			// stays long enough to be read.
+			notify(`Added ${server.name} — restart Claude Code to use it`, "warning");
 			fetchData();
 		} catch (error) {
 			modal.hideModal();

package/src/ui/screens/PluginsScreen.tsx

@@ -91,7 +91,12 @@ import {
 	renderPluginDetail,
 	renderPluginRow,
 } from "../renderers/pluginRenderers.js";
-import { useApp, useModal, useProgress } from "../state/AppContext.js";
+import {
+	useApp,
+	useModal,
+	useNotify,
+	useProgress,
+} from "../state/AppContext.js";
 import { useDimensions } from "../state/DimensionsContext.js";
 import { asyncValue } from "../state/types.js";
 import { theme } from "../theme.js";
@@ -121,6 +126,7 @@ export function PluginsScreen() {
 	const { plugins: pluginsState } = state;
 	const modal = useModal();
 	const progress = useProgress();
+	const notify = useNotify();
 	const dimensions = useDimensions();
 
 	const isSearchActive =
@@ -558,21 +564,15 @@ export function PluginsScreen() {
 			clearContentDriftCache();
 			progress.hide();
 
-			let message =
-				"Cache refreshed.\n\n" +
-				"To update marketplaces from GitHub, run in Claude Code:\n" +
-				"  /plugin marketplace update\n\n" +
-				"Then refresh magus again with 'r'.";
-
-			if (result.repair.length > 0) {
-				const totalRepaired = result.repair.reduce(
-					(sum, r) => sum + r.repaired.length,
-					0,
-				);
-				message += `\n\nAuto-repaired ${totalRepaired} plugin(s) with missing agents/commands.`;
-			}
-
-			await modal.message("Refreshed", message, "success");
+			const totalRepaired = result.repair.reduce(
+				(sum, r) => sum + r.repaired.length,
+				0,
+			);
+			notify(
+				totalRepaired > 0
+					? `Refreshed — repaired ${totalRepaired} plugin(s) with missing files`
+					: "Refreshed",
+			);
 			fetchData();
 		} catch (error) {
 			progress.hide();
@@ -697,10 +697,9 @@ export function PluginsScreen() {
 			);
 
 			if (!wantToConfigure) {
-				await modal.message(
-					"Skipped Configuration",
-					`You can configure these variables later in the Settings tab (press ${tabKey("settings")}).`,
-					"info",
+				notify(
+					`${serverNames.join(", ")} not configured — set the variables in the Settings tab (press ${tabKey("settings")})`,
+					"warning",
 				);
 				return true;
 			}
@@ -725,10 +724,9 @@ export function PluginsScreen() {
 				);
 
 				if (value === null) {
-					await modal.message(
-						"Configuration Incomplete",
-						`Skipped remaining configuration.\nYou can configure these later in the Settings tab (press ${tabKey("settings")}).`,
-						"info",
+					notify(
+						`${serverNames.join(", ")} partly configured — set the rest in the Settings tab (press ${tabKey("settings")})`,
+						"warning",
 					);
 					return true;
 				}
@@ -807,11 +805,7 @@ export function PluginsScreen() {
 					"error",
 				);
 			} else if (result.installed.length > 0) {
-				await modal.message(
-					"Dependencies Installed",
-					`Installed ${result.installed.length} package(s):\n${result.installed.join(", ")}`,
-					"success",
-				);
+				notify(`Installed ${result.installed.join(", ")}`);
 			}
 		} catch (error) {
 			console.error("Error installing plugin deps:", error);
@@ -1047,13 +1041,8 @@ export function PluginsScreen() {
 			// Ran, exited 0, moved nothing — and the row will not have moved
 			// either. Saying nothing here is what made "press U, press U,
 			// forever": the CLI names the cause, so the screen does too.
-			if (result.unchanged.length > 0) {
-				await modal.message(
-					"No change",
-					reasons.lines(result.unchanged),
-					"info",
-				);
-			}
+			const unchanged = reasons.notice(result.unchanged);
+			if (unchanged) notify(unchanged, "warning");
 			fetchData();
 		} catch (error) {
 			modal.hideModal();
@@ -1121,13 +1110,10 @@ export function PluginsScreen() {
 					"error",
 				);
 			}
-			if (result.unchanged.length > 0) {
-				await modal.message(
-					"No change",
-					reasons.lines(result.unchanged),
-					"info",
-				);
-			}
+			// One line however many were left where they were: a line each
+			// filled the banner and pushed out everything else it had to say.
+			const unchanged = reasons.notice(result.unchanged);
+			if (unchanged) notify(unchanged, "warning");
 			fetchData();
 		} catch (error) {
 			modal.hideModal();
@@ -1278,10 +1264,8 @@ export function PluginsScreen() {
 		try {
 			await saveProfile(name.trim(), enabledPlugins, scope, state.projectPath);
 			modal.hideModal();
-			await modal.message(
-				"Saved",
-				`Profile "${name.trim()}" saved.\nPress ${tabKey("profiles")} to manage profiles.`,
-				"success",
+			notify(
+				`Saved profile "${name.trim()}" at ${scope === "user" ? "USER" : "PROJECT"} scope`,
 			);
 		} catch (error) {
 			modal.hideModal();
@@ -1379,18 +1363,13 @@ export function PluginsScreen() {
 		width: dimensions.terminalWidth,
 		now: nowTick,
 	});
-	// Without a resolved profile, exact pins are unknown here and every row is
-	// judged against "latest". Saying so is what keeps a row that disagrees with
-	// `magus update <profile>` from reading as a contradiction.
+	// Without a resolved profile every row is judged against "latest". That is
+	// not said here: the startup question already tells the user there is no
+	// active profile, and "profile not resolved" was mechanism, not state.
 	const notice = isReloading ? (
 		<text fg={theme.colors.muted}>⟳ Refreshing catalogs from GitHub…</text>
 	) : (
-		(catalogNotice ??
-		(pins === null ? (
-			<text fg={theme.colors.muted}>
-				profile not resolved — states judged against latest
-			</text>
-		) : null))
+		catalogNotice
 	);
 
 	return (