claudeup 4.16.0 → 4.18.0

package/src/ui/screens/GitignoreScreen.tsx

@@ -1,22 +1,40 @@
 import React, { useEffect, useState, useCallback, useMemo } from "react";
 import { spawn } from "node:child_process";
+import { appendFileSync } from "node:fs";
+import { useRenderer } from "@opentui/react";
 import { useApp, useModal } from "../state/AppContext.js";
 import { useKeyboardHandler } from "../hooks/useKeyboardHandler.js";
 import { ScreenLayout } from "../components/layout/index.js";
 import {
   loadGitignoreState,
-  applyAllSafeFixes,
   applyDestructiveFix,
+  ensureProjectManifestForEdit,
   applyTemplate,
   type GitignoreState,
 } from "../../services/gitignore-service.js";
 import { BUILTIN_TEMPLATES } from "../../data/gitignore-templates.js";
-import { renderRuleRow, type RuleRow } from "../renderers/gitignoreRenderers.js";
-import type { ResolvedRule, Violation } from "../../types/gitignore.js";
+import { getGitignoreRuleReason } from "../../data/gitignore-reasons.js";
+import {
+  renderRuleRow,
+  type RuleRow,
+} from "../renderers/gitignoreRenderers.js";
+import type { ResolvedRule, Tier, Violation } from "../../types/gitignore.js";
+
+// Clean rows are grouped by the manifest that defined them. Order = display
+// order, top to bottom. "Default" is the user-facing name for the built-in
+// rules. Each label names where you'd go to change that group's rules.
+const SOURCE_ORDER: Tier[] = ["project", "global", "profile", "builtin"];
+const SOURCE_LABELS: Record<Tier, string> = {
+  project: "Project · .claude/gitignore.json",
+  global: "Global · ~/.claude/gitignore.json",
+  profile: "Profile",
+  builtin: "Default · built into claudeup",
+};
 
 export function GitignoreScreen() {
   const { state } = useApp();
   const modal = useModal();
+  const renderer = useRenderer();
   const cwd = state.projectPath;
 
   const [data, setData] = useState<GitignoreState | null>(null);
@@ -41,31 +59,38 @@ export function GitignoreScreen() {
     void reload();
   }, [reload]);
 
-  // Build the unified row list: every rule, sorted with violations first so
-  // problems are visible at the top of the list without scrolling.
+  // Build the managed list: every desired gitignore rule, with all matching
+  // violations grouped under the rule that owns them.
   const rows: RuleRow[] = useMemo(() => {
     if (!data) return [];
-    const violationByPattern = new Map<string, Violation>();
-    for (const v of data.violations) {
-      // A violation's `path` is the rule's pattern for ignored-but-should-track
-      // and missing-from-gitignore; for tracked-but-should-ignore it's the
-      // actual tracked file under a directory rule. Index by rule pattern by
-      // matching either path or its prefix.
-      // Simplest: index by path; lookup will try exact then prefix.
-      violationByPattern.set(v.path, v);
-    }
 
     const annotated: RuleRow[] = data.resolved.rules.map((rule) => {
-      const v =
-        violationByPattern.get(rule.pattern) ??
-        findPrefixMatch(rule, data.violations);
-      return { rule, violation: v };
+      const violations = data.violations.filter((v) =>
+        violationMatchesRule(rule, v),
+      );
+      return { rule, violations };
     });
 
+    // Display order = flat index order (the keyboard handler walks this array),
+    // so the on-screen layout must match this sort exactly:
+    //   1. violations first (most violations first)
+    //   2. then clean rows grouped by source manifest (SOURCE_ORDER)
+    //   3. alphabetical within each group
+    const sourceRank = (tier: ResolvedRule["source"]): number => {
+      const i = SOURCE_ORDER.indexOf(tier);
+      return i === -1 ? SOURCE_ORDER.length : i;
+    };
     return annotated.sort((a, b) => {
-      const aBad = a.violation ? 0 : 1;
-      const bBad = b.violation ? 0 : 1;
-      if (aBad !== bBad) return aBad - bBad;
+      const aViol = a.violations.length > 0;
+      const bViol = b.violations.length > 0;
+      if (aViol !== bViol) return aViol ? -1 : 1;
+      if (aViol && bViol && a.violations.length !== b.violations.length) {
+        return b.violations.length - a.violations.length;
+      }
+      if (!aViol) {
+        const sr = sourceRank(a.rule.source) - sourceRank(b.rule.source);
+        if (sr !== 0) return sr;
+      }
       return a.rule.pattern.localeCompare(b.rule.pattern);
     });
   }, [data]);
@@ -78,52 +103,96 @@ export function GitignoreScreen() {
   }, [rows.length, selectedIdx]);
 
   const selectedRow = rows[selectedIdx];
-  const violationCount = data?.violations.length ?? 0;
-  const safeCount =
-    data?.violations.filter((v) => v.severity === "safe").length ?? 0;
-  const destructiveCount = violationCount - safeCount;
+  const ignoreRuleCount =
+    data?.resolved.rules.filter((rule) => rule.action === "ignore").length ?? 0;
+  const trackRuleCount =
+    data?.resolved.rules.filter((rule) => rule.action === "track").length ?? 0;
+  const toFixCount = data?.violations.length ?? 0;
+
+  // Group rows for display while preserving each row's flat index in `rows`
+  // (the keyboard handler walks `rows` by index, so the highlight must track
+  // the original index, not the position within a rendered group).
+  const indexed = rows.map((row, index) => ({ row, index }));
+  const toFixRows = indexed.filter((r) => r.row.violations.length > 0);
+  // Clean rows grouped by which manifest defined them. Sections render only
+  // when non-empty, so e.g. the Profile group stays hidden until profiles
+  // actually contribute rules.
+  const cleanIndexed = indexed.filter((r) => r.row.violations.length === 0);
+  const sourceGroups = SOURCE_ORDER.map((tier) => ({
+    tier,
+    label: SOURCE_LABELS[tier],
+    items: cleanIndexed.filter((r) => r.row.rule.source === tier),
+  })).filter((g) => g.items.length > 0);
+  const cleanCount = cleanIndexed.length;
 
   // ── Action handlers ───────────────────────────────────────────────────
 
-  const handleApplySafe = useCallback(async () => {
-    if (!data || safeCount === 0) return;
-    const r = await applyAllSafeFixes(cwd, data.violations);
-    await modal.message(
-      "Applied safe fixes",
-      `Appended ${r.appended.length} pattern(s) to .gitignore.${
-        r.alreadyPresent.length > 0
-          ? `\n\n${r.alreadyPresent.length} pattern(s) were already present.`
-          : ""
-      }`,
-      "success",
-    );
-    await reload();
-  }, [cwd, data, safeCount, modal, reload]);
-
-  const handleApplySelected = useCallback(async () => {
-    if (!selectedRow?.violation) return;
-    const v = selectedRow.violation;
+  // Fix every out-of-sync row. Iterates the grouped rows (not the flat
+  // violation list) so each .gitignore entry uses the rule's pattern/glob,
+  // not one specific path under it — same association handleApplyOne relies on.
+  const handleFixAll = useCallback(async () => {
+    if (!data || toFixRows.length === 0) return;
+    try {
+      const messages: string[] = [];
+      const failures: string[] = [];
+      for (const { row } of toFixRows) {
+        for (const v of row.violations) {
+          const r = await applyDestructiveFix(cwd, v, row.rule.pattern);
+          (r.applied ? messages : failures).push(r.message);
+        }
+      }
+      await reload();
+      if (failures.length > 0) {
+        await modal.message(
+          "Some fixes didn't apply",
+          [...failures, ...messages].join("\n"),
+          "error",
+        );
+      }
+    } catch (err) {
+      await modal.message(
+        "Fix failed",
+        err instanceof Error ? err.message : String(err),
+        "error",
+      );
+    }
+  }, [cwd, data, toFixRows, reload, modal]);
 
-    if (v.severity === "safe") {
-      await handleApplySafe();
+  // 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",
+      );
       return;
     }
-
-    const confirmed = await modal.confirm(
-      "Apply destructive fix?",
-      `${v.kind} on ${v.path}\n\n` +
-        `This mutates the git index (e.g. \`git rm --cached\` or \`git add\`).\n` +
-        `You can review the change with \`git status\` afterwards.`,
-    );
-    if (!confirmed) return;
-
-    try {
-      const result = await applyDestructiveFix(cwd, v);
+    if (selectedRow.violations.length === 0) {
       await modal.message(
-        result.applied ? "Fix applied" : "Fix failed",
-        result.message,
-        result.applied ? "success" : "error",
+        "Nothing to fix",
+        `${selectedRow.rule.pattern} already matches. f only applies to rows that need fixing.`,
+        "info",
       );
+      return;
+    }
+
+    try {
+      const results: Array<{ applied: boolean; message: string }> = [];
+      for (const v of selectedRow.violations) {
+        results.push(await applyDestructiveFix(cwd, v, selectedRow.rule.pattern));
+      }
+      const failed = results.filter((r) => !r.applied);
+      await reload();
+      // Success is silent — the reload removes the fixed row. Only surface a
+      // modal when something didn't apply.
+      if (failed.length > 0) {
+        await modal.message(
+          "Some fixes didn't apply",
+          results.map((r) => r.message).join("\n"),
+          "error",
+        );
+      }
     } catch (err) {
       await modal.message(
         "Fix failed",
@@ -131,13 +200,16 @@ export function GitignoreScreen() {
         "error",
       );
     }
-    await reload();
-  }, [selectedRow, handleApplySafe, modal, cwd, reload]);
+  }, [selectedRow, modal, 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");
+      await modal.message(
+        "No templates",
+        "No built-in templates available.",
+        "info",
+      );
       return;
     }
     const selected = await modal.select(
@@ -170,17 +242,37 @@ export function GitignoreScreen() {
   }, [cwd, modal, reload]);
 
   const handleEditManifest = useCallback(async () => {
-    const projectManifest = `${cwd}/.claude/gitignore.json`;
+    const current = data ?? await loadGitignoreState(cwd);
+    const projectManifest = await ensureProjectManifestForEdit(
+      cwd,
+      current.resolved,
+    );
     const editor = process.env.EDITOR ?? process.env.VISUAL ?? "vi";
-    await new Promise<void>((resolveEdit) => {
-      const child = spawn(editor, [projectManifest], { stdio: "inherit" });
-      child.on("exit", () => resolveEdit());
-      child.on("error", () => resolveEdit());
-    });
+    renderer.suspend();
+    try {
+      await new Promise<void>((resolveEdit) => {
+        const child = spawn(editor, [projectManifest], { stdio: "inherit" });
+        child.on("exit", () => resolveEdit());
+        child.on("error", () => resolveEdit());
+      });
+    } finally {
+      renderer.resume();
+    }
     await reload();
-  }, [cwd, reload]);
+    renderer.requestRender();
+  }, [cwd, data, reload, renderer]);
 
   useKeyboardHandler((input, key) => {
+    if (process.env.CLAUDEUP_DEBUG_KEYS === "1") {
+      try {
+        appendFileSync(
+          "/tmp/claudeup-keys.log",
+          `${new Date().toISOString()} screen=gitignore input=${JSON.stringify(input)} name=${JSON.stringify(key.name)} shift=${key.shift} ctrl=${key.ctrl} meta=${key.meta}\n`,
+        );
+      } catch {
+        // best-effort logging — never break the UI
+      }
+    }
     if (state.modal) return;
     if (input === "j" || key.downArrow) {
       setSelectedIdx((i) => Math.min(i + 1, Math.max(0, rows.length - 1)));
@@ -190,12 +282,13 @@ export function GitignoreScreen() {
       setSelectedIdx((i) => Math.max(i - 1, 0));
       return;
     }
-    if (input === "f") {
-      void handleApplySafe();
+    // F = fix everything out of sync; f = fix just the selected row.
+    if (input === "F" || (input === "f" && key.shift)) {
+      void handleFixAll();
       return;
     }
-    if (input === "F") {
-      void handleApplySelected();
+    if (input === "f") {
+      void handleFixOne();
       return;
     }
     if (input === "t") {
@@ -213,7 +306,9 @@ export function GitignoreScreen() {
 
   // ── Rendering ─────────────────────────────────────────────────────────
 
-  const summary = data ? renderSummary(violationCount, safeCount, destructiveCount) : null;
+  const summary = data
+    ? renderSummary(rows.length, ignoreRuleCount, trackRuleCount, toFixCount)
+    : null;
 
   const listBody = loading ? (
     <text fg="gray">Loading...</text>
@@ -223,14 +318,35 @@ export function GitignoreScreen() {
     <text fg="gray">No rules resolved.</text>
   ) : (
     <box flexDirection="column">
-      {rows.slice(0, 200).map((row, i) => renderRuleRow(row, i === selectedIdx))}
+      {toFixRows.length > 0 && (
+        <box flexDirection="column">
+          <text fg="red">{`Needs fixing (${toFixRows.length})`}</text>
+          {toFixRows
+            .slice(0, 100)
+            .map(({ row, index }) => renderRuleRow(row, index === selectedIdx))}
+          <text> </text>
+        </box>
+      )}
+      <text fg="gray">{`Managed items (${cleanCount})`}</text>
+      {/* One section per manifest source (Default / Global / Project /
+          Profile). Empty sources are dropped, so headers only appear when
+          they have rows. The header names where you'd change those rules. */}
+      {sourceGroups.map((group, gi) => (
+        <box flexDirection="column" key={group.tier}>
+          {gi > 0 && <text> </text>}
+          <text fg="gray">{`  ${group.label}`}</text>
+          {group.items.map(({ row, index }) =>
+            renderRuleRow(row, index === selectedIdx),
+          )}
+        </box>
+      ))}
     </box>
   );
 
   const listPanel = (
     <box flexDirection="column">
       {summary}
-      <text>{" "}</text>
+      <text> </text>
       {listBody}
     </box>
   );
@@ -238,52 +354,60 @@ export function GitignoreScreen() {
   const detailPanel = renderDetail(selectedRow, data?.warnings ?? []);
 
   const subtitle = data
-    ? violationCount === 0
-      ? "all clean"
-      : `${violationCount} violation${violationCount === 1 ? "" : "s"}`
+    ? toFixCount === 0
+      ? `${rows.length} managed`
+      : `${toFixCount} to fix`
     : "";
 
   return (
     <ScreenLayout
-      title="Gitignore Manager"
+      title="Managed Git State"
       subtitle={subtitle}
       currentScreen="gitignore"
-      footerHints="↑↓ move  f fix-all-safe  F fix-this  t tpl  e edit  r reload"
+      footerHints={[
+        { keys: ["↑", "↓"], label: "move" },
+        { keys: ["f"], label: "fix selected" },
+        { keys: ["F"], label: "fix all" },
+        { keys: ["t"], label: "template" },
+        { keys: ["e"], label: "edit" },
+        { keys: ["r"], label: "reload" },
+      ]}
       listPanel={listPanel}
       detailPanel={detailPanel}
     />
   );
 }
 
-function findPrefixMatch(
+function violationMatchesRule(
   rule: ResolvedRule,
-  violations: Violation[],
-): Violation | undefined {
-  // A directory rule like "ai-docs/sessions/" can have a violation on a child
-  // path like "ai-docs/sessions/leak.md". Match by path-startsWith-pattern.
-  if (!rule.pattern.endsWith("/") && !rule.pattern.includes("*")) return undefined;
+  violation: Violation,
+): boolean {
+  if (violation.path === rule.pattern) return true;
+  if (!rule.pattern.endsWith("/") && !rule.pattern.includes("*")) return false;
   const prefix = rule.pattern.replace(/\*+$/, "");
-  return violations.find((v) => v.path.startsWith(prefix));
+  return violation.path.startsWith(prefix);
 }
 
 function renderSummary(
-  violations: number,
-  safe: number,
-  destructive: number,
+  rules: number,
+  ignoreRules: number,
+  trackRules: number,
+  toFix: number,
 ): React.ReactNode {
-  if (violations === 0) {
-    return <text fg="green">✓ All rules satisfied — nothing to fix.</text>;
-  }
-
   return (
-    <text>
-      <span fg="white">{`${violations} violation${violations === 1 ? "" : "s"} `}</span>
-      <span fg="gray">{`(`}</span>
-      {safe > 0 && <span fg="yellow">{`${safe} safe`}</span>}
-      {safe > 0 && destructive > 0 && <span fg="gray">{`, `}</span>}
-      {destructive > 0 && <span fg="red">{`${destructive} destructive`}</span>}
-      <span fg="gray">{`)`}</span>
-    </text>
+    <box flexDirection="column">
+      <text>
+        <span fg="white">{`${rules} managed item${rules === 1 ? "" : "s"}`}</span>
+      </text>
+      <text>
+        <span fg="gray">{`${ignoreRules} ignored  ${trackRules} tracked`}</span>
+      </text>
+      {toFix === 0 ? (
+        <text fg="green">Everything matches — nothing to fix.</text>
+      ) : (
+        <text fg="yellow">{`${toFix} need${toFix === 1 ? "s" : ""} fixing — f one, F all`}</text>
+      )}
+    </box>
   );
 }
 
@@ -299,7 +423,9 @@ function renderDetail(
           <box flexDirection="column" marginTop={1}>
             <text fg="yellow">Warnings:</text>
             {warnings.map((w, i) => (
-              <text fg="gray" key={i}>{w}</text>
+              <text fg="gray" key={i}>
+                {w}
+              </text>
             ))}
           </box>
         )}
@@ -307,58 +433,112 @@ function renderDetail(
     );
   }
 
-  const { rule, violation } = row;
+  const { rule, violations } = row;
+  const reason = getGitignoreRuleReason(rule.action, rule.pattern);
+
+  const setIn = sourceName(rule.source);
 
-  if (!violation) {
-    // Rule is satisfied — show what it enforces and where it came from
+  if (violations.length === 0) {
     return (
       <box flexDirection="column">
-        <text fg="white"><strong>{rule.pattern}</strong></text>
-        <text>{" "}</text>
-        <text fg="green">{`✓ ${rule.action === "ignore" ? "Ignored" : "Tracked"} as required.`}</text>
-        <text>{" "}</text>
-        <text fg="gray">{`Rule from ${rule.source} tier.`}</text>
+        <text fg="white">
+          <strong>{rule.pattern}</strong>
+        </text>
+        <text> </text>
+        <text fg="green">{`✓ Already ${rule.action === "ignore" ? "ignored" : "tracked"} — nothing to do.`}</text>
+        <text> </text>
+        <text fg="gray">{reason}</text>
+        <text> </text>
+        <text fg="gray">{`Set in: ${setIn}`}</text>
+        {renderWarnings(warnings)}
       </box>
     );
   }
 
-  // Rule is violated — explain and show the action
   return (
     <box flexDirection="column">
-      <text fg="white"><strong>{violation.path}</strong></text>
-      <text>{" "}</text>
-      <text fg="white">{describeKind(violation.kind)}</text>
-      <text>{" "}</text>
-      <text fg="gray">{`Rule from ${rule.source} tier.`}</text>
-      <text fg={violation.severity === "safe" ? "yellow" : "red"}>
-        {violation.severity === "safe"
-          ? "Safe — only appends to .gitignore."
-          : "Destructive — mutates the git index."}
+      <text fg="white">
+        <strong>{rule.pattern}</strong>
       </text>
-      <text>{" "}</text>
-      <text fg="cyan">{actionHint(violation.kind)}</text>
+      <text> </text>
+      <text>
+        <span fg="gray">Should be: </span>
+        <span fg="white">
+          {rule.action === "ignore" ? "ignored by git" : "tracked by git"}
+        </span>
+      </text>
+      <text fg="gray">{reason}</text>
+      <text fg="gray">{`Set in: ${setIn}`}</text>
+      <text> </text>
+      <text fg="yellow">{`Needs fixing (${violations.length}):`}</text>
+      {violations.map((v, i) => (
+        <box
+          key={`${v.kind}:${v.path}:${i}`}
+          flexDirection="column"
+          marginTop={i === 0 ? 0 : 1}
+        >
+          <text fg="white">{v.path}</text>
+          <text fg="gray">{describeKind(v.kind)}</text>
+          <text fg={v.severity === "safe" ? "cyan" : "red"}>
+            {actionHint(v.kind)}
+          </text>
+        </box>
+      ))}
+      {renderWarnings(warnings)}
     </box>
   );
 }
 
+/** Friendly, where-to-change-it name for a rule's source manifest. */
+function sourceName(source: ResolvedRule["source"]): string {
+  switch (source) {
+    case "project":
+      return "Project (.claude/gitignore.json)";
+    case "global":
+      return "Global (~/.claude/gitignore.json)";
+    case "profile":
+      return "Profile";
+    case "builtin":
+      return "Default (built into claudeup)";
+  }
+}
+
 function describeKind(kind: Violation["kind"]): string {
   switch (kind) {
-    case "tracked-but-should-ignore":  return "This file is in the git index but the manifest says it should be ignored.";
-    case "ignored-but-should-track":   return "Your .gitignore excludes this path but the manifest says it should be tracked.";
-    case "untracked-and-should-track": return "This path exists on disk but git doesn't track it; the manifest says it should.";
-    case "missing-from-gitignore":     return "The manifest says ignore this path, but it's not in any .gitignore line.";
+    case "tracked-but-should-ignore":
+      return "Git is tracking it, but it should be ignored.";
+    case "ignored-but-should-track":
+      return "A .gitignore rule hides it, but it should be in git.";
+    case "untracked-and-should-track":
+      return "It's on disk but git isn't tracking it yet.";
+    case "missing-from-gitignore":
+      return "It should be ignored, but nothing in .gitignore covers it.";
   }
 }
 
 function actionHint(kind: Violation["kind"]): string {
   switch (kind) {
     case "tracked-but-should-ignore":
-      return "[F] runs `git rm --cached` and appends a .gitignore entry.";
+      return "Press f to stop tracking it and add it to .gitignore.";
     case "ignored-but-should-track":
-      return "[F] removes the matching .gitignore line and runs `git add`.";
+      return "Press f to remove the .gitignore line and add it to git.";
     case "untracked-and-should-track":
-      return "[F] runs `git add` to stage the path.";
+      return "Press f to add it to git.";
     case "missing-from-gitignore":
-      return "[f] appends this and every other safe entry to .gitignore.";
+      return "Press f to add it to .gitignore (F to fix all).";
   }
 }
+
+function renderWarnings(warnings: string[]): React.ReactNode {
+  if (warnings.length === 0) return null;
+  return (
+    <box flexDirection="column" marginTop={1}>
+      <text fg="yellow">Warnings:</text>
+      {warnings.map((w, i) => (
+        <text fg="gray" key={i}>
+          {w}
+        </text>
+      ))}
+    </box>
+  );
+}

package/src/ui/screens/McpRegistryScreen.js

@@ -214,8 +214,19 @@ export function McpRegistryScreen() {
     };
     // Footer hints
     const footerHints = isSearchActive
-        ? "Type to search │ ↑↓:nav │ Enter:done │ Esc:cancel"
-        : "↑↓:nav │ Enter:install │ /:search │ R:refresh │ l:local";
+        ? [
+            { keys: ["type"], label: "search" },
+            { keys: ["↑", "↓"], label: "nav" },
+            { keys: ["Enter"], label: "done" },
+            { keys: ["Esc"], label: "cancel" },
+        ]
+        : [
+            { keys: ["↑", "↓"], label: "nav" },
+            { keys: ["Enter"], label: "install" },
+            { keys: ["/"], label: "search" },
+            { keys: ["R"], label: "refresh" },
+            { keys: ["l"], label: "local" },
+        ];
     // Status for search placeholder
     const searchPlaceholder = `${servers.length} servers │ / to search`;
     return (_jsx(ScreenLayout, { title: "claudeup MCP Registry", subtitle: "Powered by MCP Registry", currentScreen: "mcp-registry", search: {

package/src/ui/screens/McpRegistryScreen.tsx

@@ -303,8 +303,19 @@ export function McpRegistryScreen() {
 
 	// Footer hints
 	const footerHints = isSearchActive
-		? "Type to search │ ↑↓:nav │ Enter:done │ Esc:cancel"
-		: "↑↓:nav │ Enter:install │ /:search │ R:refresh │ l:local";
+		? [
+				{ keys: ["type"], label: "search" },
+				{ keys: ["↑", "↓"], label: "nav" },
+				{ keys: ["Enter"], label: "done" },
+				{ keys: ["Esc"], label: "cancel" },
+			]
+		: [
+				{ keys: ["↑", "↓"], label: "nav" },
+				{ keys: ["Enter"], label: "install" },
+				{ keys: ["/"], label: "search" },
+				{ keys: ["R"], label: "refresh" },
+				{ keys: ["l"], label: "local" },
+			];
 
 	// Status for search placeholder
 	const searchPlaceholder = `${servers.length} servers │ / to search`;

package/src/ui/screens/McpScreen.js

@@ -166,6 +166,11 @@ export function McpScreen() {
     const installedCount = Object.keys(mcp.installedServers).length;
     const enabledCount = Object.values(mcp.installedServers).filter((v) => v === true).length;
     const subtitle = `${enabledCount} enabled │ ${installedCount} configured │ / to search`;
-    return (_jsx(ScreenLayout, { title: "claudeup MCP Servers", subtitle: subtitle, currentScreen: "mcp", footerHints: "\u2191\u2193:nav \u2502 Enter:toggle \u2502 /:search \u2502 r:registry", listPanel: _jsx(ScrollableList, { items: allListItems, selectedIndex: mcp.selectedIndex, renderItem: renderMcpRow, maxHeight: dimensions.listPanelHeight }), detailPanel: renderMcpDetail(selectedItem, isLoading) }));
+    return (_jsx(ScreenLayout, { title: "claudeup MCP Servers", subtitle: subtitle, currentScreen: "mcp", footerHints: [
+            { keys: ["↑", "↓"], label: "nav" },
+            { keys: ["Enter"], label: "toggle" },
+            { keys: ["/"], label: "search" },
+            { keys: ["r"], label: "registry" },
+        ], listPanel: _jsx(ScrollableList, { items: allListItems, selectedIndex: mcp.selectedIndex, renderItem: renderMcpRow, maxHeight: dimensions.listPanelHeight }), detailPanel: renderMcpDetail(selectedItem, isLoading) }));
 }
 export default McpScreen;