magus-cli 7.1.0 → 7.3.0

package/src/ui/renderers/pluginStatusText.ts

@@ -41,6 +41,20 @@ export function pluginStatusText(
 			};
 		case "repair":
 			return { suffix: ` stale — reinstall${withNote}`, tone: "warning" };
+		case "stale-load":
+			// NO VERSIONS, and the note is deliberately not shown. This row used to
+			// print the classifier's note verbatim — "≠ loads v0.3.0, installed
+			// v0.5.0" — which is internal vocabulary: it tells a reader neither what
+			// is wrong nor what to do, because "loads" versus "installed" is a
+			// distinction only this codebase draws. The row's job is the verdict and
+			// the key; the mechanism, including which project's registry row wins,
+			// belongs in the detail panel, which is where someone curious looks.
+			//
+			// Red, not the amber it carried while this was report-only. Amber is
+			// this file's tone for "cannot tell" and for routine work; a plugin
+			// whose session runs a version nobody installed is broken, and there is
+			// now a key that fixes it.
+			return { suffix: " BROKEN — press a to fix", tone: "danger" };
 		case "install":
 			// `absent` only ever comes from a profile pin (see `pinForRow`), so it
 			// may say so. An undeclared row that is merely enabled must not.

package/src/ui/renderers/profileRenderers.tsx

@@ -68,7 +68,16 @@ export function wrapNames(names: string[], lineMax = 40): string[] {
 	return lines;
 }
 
-export function formatDate(iso: string): string {
+/**
+ * A profile's timestamp, or an em dash when it has none.
+ *
+ * `createdAt`/`updatedAt` are bookkeeping the TUI writes and the CLI does not,
+ * so a CLI-authored or hand-written profile legitimately has neither. Rendering
+ * "—" states that plainly; the alternative, printing "Invalid Date", reads as a
+ * corrupt file rather than an absent field.
+ */
+export function formatDate(iso: string | undefined): string {
+	if (!iso) return "—";
 	try {
 		const d = new Date(iso);
 		return d.toLocaleDateString("en-US", {
@@ -232,18 +241,23 @@ const predefinedRenderer: ItemRenderer<{
 const savedRenderer: ItemRenderer<{ kind: "saved"; entry: ProfileEntry }> = {
 	renderRow: ({ item, isSelected }) => {
 		const { entry } = item;
-		const pluginCount = Object.keys(entry.plugins).length;
+		const pluginCount = Object.keys(entry.plugins ?? {}).length;
 		const dateStr = formatDate(entry.updatedAt);
 		const label = truncate(
 			`${entry.name} — ${pluginCount} plugin${pluginCount !== 1 ? "s" : ""} · ${dateStr}`,
 			45,
 		);
+		// `●` for the profile the project is actually running, matching the glyph
+		// `magus profile list` prints. A column that is blank on every row costs
+		// two cells and is worth it: without the mark, activating a profile and
+		// landing on this tab shows two rows that look identical.
+		const marker = entry.active ? "●" : " ";
 
 		if (isSelected) {
 			return (
 				<text bg={theme.selection.bg} fg={theme.selection.fg}>
 					{" "}
-					{label}{" "}
+					{marker} {label}{" "}
 				</text>
 			);
 		}
@@ -254,6 +268,9 @@ const savedRenderer: ItemRenderer<{ kind: "saved"; entry: ProfileEntry }> = {
 
 		return (
 			<text fg={theme.colors.text}>
+				<span fg={entry.active ? theme.colors.success : theme.colors.text}>
+					{marker}{" "}
+				</span>
 				<span fg={scopeColor}>{scopeLabel} </span>
 				<span fg={theme.colors.text}>{label}</span>
 			</text>
@@ -262,7 +279,7 @@ const savedRenderer: ItemRenderer<{ kind: "saved"; entry: ProfileEntry }> = {
 
 	renderDetail: ({ item }) => {
 		const { entry: selectedProfile } = item;
-		const plugins = Object.keys(selectedProfile.plugins);
+		const plugins = Object.keys(selectedProfile.plugins ?? {});
 		const cleanPlugins = plugins.map(stripSuffix);
 		const scopeColor =
 			selectedProfile.scope === "user"
@@ -281,6 +298,12 @@ const savedRenderer: ItemRenderer<{ kind: "saved"; entry: ProfileEntry }> = {
 				<box marginTop={1}>
 					<text fg={theme.colors.muted}>Scope: </text>
 					<text fg={scopeColor}>{scopeLabel}</text>
+					{/* Stated in words as well as the row glyph: the detail pane is
+					    where someone looks to check, and "●" alone is not an answer
+					    to "is this the one that is running?". */}
+					{selectedProfile.active ? (
+						<text fg={theme.colors.success}> · active</text>
+					) : null}
 				</box>
 				<box marginTop={1}>
 					<text fg={theme.colors.muted}>

package/src/ui/screens/PluginsScreen.tsx

@@ -996,9 +996,16 @@ export function PluginsScreen() {
 	const handleUpdate = async () => {
 		const item = selectableItems[pluginsState.selectedIndex];
 		if (!item || item.kind !== "plugin") return;
-		// The row said "update" or "stale — reinstall"; nothing else is work.
+		// The row said "update", "stale — reinstall" or "BROKEN"; nothing else is
+		// work for this key. `install` stays out — that is the scope keys' and the
+		// profile's business, and the detail panel never offers U for it.
 		const status = statuses.get(item.plugin.id);
-		if (status?.action !== "update" && status?.action !== "repair") return;
+		if (
+			status?.action !== "update" &&
+			status?.action !== "repair" &&
+			status?.action !== "stale-load"
+		)
+			return;
 
 		const plugin = item.plugin;
 		const scope: PluginScope =
@@ -1010,9 +1017,13 @@ export function PluginsScreen() {
 		const repairing = status.action === "repair";
 
 		modal.loading(
-			repairing
-				? `Repairing ${plugin.name}…\nclaude plugin uninstall ${plugin.id} --scope ${scope} && claude plugin install ${plugin.id} --scope ${scope}`
-				: `Updating ${plugin.name}…\nclaude plugin install ${plugin.id} --scope ${scope}`,
+			// A broken plugin runs NO claude command at all, so naming one here would
+			// misdescribe the work: the repair rewrites installed_plugins.json rows.
+			status.action === "stale-load"
+				? `Repairing ${plugin.name}…\nmoving this repository's install records forward to v${status.target ?? "?"}`
+				: repairing
+					? `Repairing ${plugin.name}…\nclaude plugin uninstall ${plugin.id} --scope ${scope} && claude plugin install ${plugin.id} --scope ${scope}`
+					: `Updating ${plugin.name}…\nclaude plugin install ${plugin.id} --scope ${scope}`,
 		);
 		const reasons = noMoveReasons();
 		try {
@@ -1069,24 +1080,38 @@ export function PluginsScreen() {
 	const handleUpdateAll = async () => {
 		if (pluginsState.plugins.status !== "success") return;
 
-		// Exactly the rows that say "update" or "stale — reinstall", each planned
-		// under its real pin. Content-stale plugins are included: they need
-		// repairing, and excluding them meant "update all" left the machine with
-		// silently outdated files.
+		// Exactly the rows that say "update", "stale — reinstall" or "BROKEN — press
+		// a to fix", each planned under its real pin. Content-stale plugins are
+		// included: they need repairing, and excluding them meant "update all" left
+		// the machine with silently outdated files. Broken (`stale-load`) rows are
+		// included because the row itself now names this key — leaving them out
+		// would make that hint a lie. `install` stays out: a plugin nothing has
+		// installed is `s`'s business, per the note above.
 		const items = [...statuses.values()]
-			.filter((s) => s.action === "update" || s.action === "repair")
+			.filter(
+				(s) =>
+					s.action === "update" ||
+					s.action === "repair" ||
+					s.action === "stale-load",
+			)
 			.sort((a, b) => a.pluginId.localeCompare(b.pluginId));
 		if (items.length === 0) return;
 
 		const projectPath = state.projectPath || process.cwd();
 		const total = items.filter(pluginNeedsWork).length;
 
+		// A broken plugin is repaired in the registry, not updated, and the progress
+		// line is the only place the user sees which one happened to which plugin.
+		const actionOf = new Map(items.map((i) => [i.pluginId, i.action]));
+
 		let done = 0;
 		const reasons = noMoveReasons();
 		const reporter: ApplyReporter = {
 			begin: (name) => {
 				done++;
-				modal.loading(`Updating ${name} (${done}/${total})…`);
+				const verb =
+					actionOf.get(name) === "stale-load" ? "Repairing" : "Updating";
+				modal.loading(`${verb} ${name} (${done}/${total})…`);
 			},
 			finish: reasons.reporter.finish,
 			detach: (work) => work(),
@@ -1348,8 +1373,16 @@ export function PluginsScreen() {
 	// "cannot tell rendered as fine" bug.
 	const unknownCount = counts.unknown;
 	const installCount = counts.install;
-	const subtitle = `${scopeLabel} │ ${installedCount} installed${updateCount > 0 ? ` │ ${updateCount} updates` : ""}${installCount > 0 ? ` │ ${installCount} to install` : ""}${unknownCount > 0 ? ` │ ${unknownCount} unverified` : ""}`;
-	const searchPlaceholder = `${scopeLabel} │ ${installedCount} installed${updateCount > 0 ? ` │ ${updateCount} ⬆` : ""}${installCount > 0 ? ` │ ${installCount} +` : ""}${unknownCount > 0 ? ` │ ${unknownCount} ?` : ""} │ / to search`;
+	// Broken: installed at the right version, loading an older one. Its own
+	// number, never folded into `updateCount` or into silence — a clean header
+	// over a session running a version nobody installed is the whole defect.
+	//
+	// "broken", not "loading older". The old wording described the mechanism, so
+	// a reader had to already know what "loads" versus "installed" means here
+	// before the count told them anything. `a` clears these.
+	const brokenCount = counts["stale-load"];
+	const subtitle = `${scopeLabel} │ ${installedCount} installed${updateCount > 0 ? ` │ ${updateCount} updates` : ""}${installCount > 0 ? ` │ ${installCount} to install` : ""}${brokenCount > 0 ? ` │ ${brokenCount} broken` : ""}${unknownCount > 0 ? ` │ ${unknownCount} unverified` : ""}`;
+	const searchPlaceholder = `${scopeLabel} │ ${installedCount} installed${updateCount > 0 ? ` │ ${updateCount} ⬆` : ""}${installCount > 0 ? ` │ ${installCount} +` : ""}${brokenCount > 0 ? ` │ ${brokenCount} ✗` : ""}${unknownCount > 0 ? ` │ ${unknownCount} ?` : ""} │ / to search`;
 
 	const catalogNotice = buildCatalogNotice({
 		failures: catalogFailures,

package/src/ui/screens/ProfilesScreen.tsx

@@ -190,7 +190,7 @@ export function ProfilesScreen() {
 				? "~/.claude/settings.json"
 				: ".claude/settings.json";
 
-		const pluginCount = Object.keys(selectedProfile.plugins).length;
+		const pluginCount = Object.keys(selectedProfile.plugins ?? {}).length;
 		const emptyWarning =
 			pluginCount === 0
 				? "\n\nWARNING: This profile has no plugins — applying will disable all plugins."

package/src/ui/state/types.ts

@@ -12,6 +12,7 @@ import type {
 	ProfileEntry,
 	SkillInfo,
 } from "../../types/index.js";
+import type { ReportBadgeKind } from "../theme-mode.js";
 
 // ============================================================================
 // Route Types
@@ -76,6 +77,13 @@ export interface SelectOption {
 	label: string;
 	value: string;
 	description?: string;
+	/**
+	 * A chip for a discrete state — dark ink on a saturated fill, the shape the
+	 * report already uses. Optional because most selects have no state to say.
+	 */
+	badge?: { label: string; kind: ReportBadgeKind };
+	/** Dim trailing detail — chrome, never the thing being chosen. */
+	meta?: string;
 }
 
 export type ModalState =
@@ -102,6 +110,16 @@ export type ModalState =
 			defaultIndex?: number;
 			onSelect: (value: string) => void;
 			onCancel: () => void;
+			/**
+			 * False for a question that must be answered.
+			 *
+			 * Only changes what the footer PROMISES; `onCancel` decides what Escape
+			 * actually does. The two must agree, and they did not: the profile gate's
+			 * `onCancel` is a no-op, so the footer's "esc cancel" was an instruction
+			 * that did nothing when followed — worse than no hint, because the user
+			 * concludes the app is stuck rather than that the question is required.
+			 */
+			cancellable?: boolean;
 	  }
 	| {
 			type: "message";

package/src/ui/theme-mode.ts

@@ -396,6 +396,60 @@ export function trackFill(): string {
 	return TRACK_FILL[detected];
 }
 
+/**
+ * A key hint drawn as ONE two-tone chip: the key on a brighter fill, its label
+ * on a quieter fill of the same hue, butted together with no gap.
+ *
+ * Two halves rather than a chip plus loose text, because a bare label beside a
+ * filled key reads as prose that happens to follow a badge. Both halves filled
+ * makes the pair one object, and the brightness step inside it says which half
+ * you press.
+ *
+ * GREY, and no hue at all. Two earlier passes both failed by colouring it: the
+ * first gave `↵` the info blue and `esc` the danger red, which read as a traffic
+ * light — three saturated chips of unrelated meaning, none of them signalling
+ * anything, since `esc` is not dangerous, it is the way out. The second made all
+ * three magus purple, which stopped lying but competed with the selected row's
+ * purple fill directly above it, so the two most prominent things in the dialog
+ * were the same colour and the eye had nowhere to land.
+ *
+ * A key hint is chrome. It says "these are keys" and nothing more, so it earns
+ * no hue — leaving the dialog exactly one accent, on the row you are choosing.
+ * The two halves separate by INTENSITY: the key steps toward the foreground,
+ * the label sits near the page.
+ *
+ * Both pages are built from the greys already in this file — the light label is
+ * `SCOPE_OFF_FILL.light`, the dark key is `TRACK_FILL.dark` — so the footer sits
+ * in the same neutral family as every other quiet fill rather than introducing a
+ * third grey ramp.
+ */
+const HINT_CHIP = {
+	light: {
+		keyBg: "#B4B4A6",
+		keyFg: "#1F1F1A",
+		labelBg: "#D9D9CC",
+		labelFg: "#44443D",
+	},
+	dark: {
+		keyBg: "#6E6E7A",
+		keyFg: "#FBFBFD",
+		labelBg: "#44444E",
+		labelFg: "#D6D6DE",
+	},
+} as const;
+
+export interface HintChipInk {
+	keyBg: string;
+	keyFg: string;
+	labelBg: string;
+	labelFg: string;
+}
+
+/** The two-tone key-hint chip, for the resolved mode. */
+export function hintChip(): HintChipInk {
+	return HINT_CHIP[detected];
+}
+
 /**
  * Effort's colour ramp — TEXT only, never a fill, so a row never paints two blocks.
  *