claudeup 4.17.0 → 4.19.0

package/src/ui/hooks/useGitignoreModal.ts

@@ -5,7 +5,7 @@ import type { ModalState } from "../state/types.js";
 /**
  * Startup gitignore-violation modal. Mirrors `useMismatchModal` so the
  * two flows feel identical to the user — claudeup launches, detects
- * a problem, asks "fix safe entries / open the tab / dismiss".
+ * a problem, asks "add missing ignores / open the tab / dismiss".
  *
  * Pure builder is exported separately for tests.
  */
@@ -24,12 +24,12 @@ export function buildGitignoreModal(args: BuildModalArgs): ModalState {
     {
       label:
         safeCount > 0
-          ? `Append ${safeCount} safe entr${safeCount === 1 ? "y" : "ies"} to .gitignore`
-          : "(no safe-fixable entries)",
+          ? `Add ${safeCount} missing .gitignore entr${safeCount === 1 ? "y" : "ies"}`
+          : "(no missing .gitignore entries)",
       value: "fix-safe",
     },
     {
-      label: "Open Gitignore tab to review",
+      label: "Open Git State tab to review",
       value: "open-tab",
     },
     {
@@ -41,11 +41,10 @@ export function buildGitignoreModal(args: BuildModalArgs): ModalState {
     type: "select",
     title: "Gitignore violations detected",
     message:
-      `Found ${violationCount} issue(s) where the resolved gitignore manifest ` +
-      `disagrees with your working tree.\n\n` +
-      `Safe fixes append to .gitignore (no index mutation). Destructive fixes ` +
-      `(\`git rm --cached\`, removing .gitignore lines) must be applied one at ` +
-      `a time from the Gitignore tab.`,
+      `Found ${violationCount} managed gitignore item(s) that do not match ` +
+      `the current repo state.\n\n` +
+      `Missing .gitignore entries can be added now. Items that change git ` +
+      `tracking are reviewed and fixed from the Gitignore tab.`,
     options,
     onSelect: (value: string) => {
       if (value === "fix-safe") onFixSafe();

package/src/ui/renderers/gitignoreRenderers.js

@@ -1,33 +1,46 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@opentui/react/jsx-runtime";
-const SELECTION_BG = "#7e57c2";
-const SELECTION_FG = "white";
-// Layout: "  X Verb    path" — 2 (gutter) + 2 (status) + 7 (verb) + 4 (gap)
-// = 15 prefix chars. On a 38-col panel inner width that leaves 23 chars for
-// the path; truncate at 22 to keep 1 col safety margin (OpenTUI <text>
-// reserves a second line if the rendered string equals the inner width).
+// Two color channels that never collide:
+//   • Badge color = direction (where the item ends up): green = tracked by git,
+//     reddish = ignored/dropped from git. Same on clean AND violation rows.
+//   • Filename color = severity: dim gray when fine, red when it's a violation.
+// No row background tints — red is reserved entirely for "needs attention".
+const TRACK_FG = "#5fd787"; // green — item ends up tracked by git
+const IGNORE_FG = "#d78787"; // reddish — item ends up ignored / dropped
+const VIOLATION_PATH_FG = "#ff5f5f"; // bright red filename = look here
+const CLEAN_PATH_FG = "gray";
+const SELECTED_BG = "#2a2a3a"; // faint slate highlight for the cursor row
+// Violation badges are solid chips so the required direction reads at a glance:
+// green chip = will be tracked, red chip = will be ignored/dropped.
+const TRACK_CHIP_BG = "#1f5132";
+const IGNORE_CHIP_BG = "#5a2323";
+const CHIP_FG = "white";
+// The only marker is the cursor: ▶ on the selected row, blank otherwise.
+// Action (track/ignore) is read from the badge word and, for clean items,
+// from the group the row sits under — so no per-row dot is needed.
+const MARKER_SELECTED = "▶";
+const MARKER_NONE = " ";
+// Layout: "  M action  path" — keep the prefix compact so the narrow terminal
+// case still has room for the path without wrapping.
 const MAX_PATH_LEN = 22;
 function truncatePath(p) {
     return p.length > MAX_PATH_LEN ? p.slice(0, MAX_PATH_LEN - 1) + "…" : p;
 }
 export function renderRuleRow(row, isSelected) {
-    const { rule, violation } = row;
+    const { rule, violations } = row;
     const path = truncatePath(rule.pattern);
     const key = `${rule.action}:${rule.pattern}`;
-    // Layout: status-glyph (2) + verb (7) + 2 spaces + path
-    // OK rule: ✓ Ignore  path
-    // Violated:! Track   path
-    const verb = rule.action === "ignore" ? "Ignore " : "Track  ";
-    if (!violation) {
-        // Clean rule — muted, just confirmation
-        if (isSelected) {
-            return (_jsx("text", { bg: SELECTION_BG, fg: SELECTION_FG, children: `▶ ✓ ${verb}  ${path}` }, key));
-        }
-        return (_jsxs("text", { children: [_jsx("span", { fg: "green", children: `  ✓ ` }), _jsx("span", { fg: "gray", children: `${verb}  ${path}` })] }, key));
+    // Badge text padded to a fixed width so paths line up in a column.
+    const badge = rule.action === "ignore" ? "ignore" : "track ";
+    const badgeFg = rule.action === "ignore" ? IGNORE_FG : TRACK_FG;
+    const suffix = violations.length > 1 ? ` +${violations.length - 1}` : "";
+    const rowBg = isSelected ? SELECTED_BG : undefined;
+    const marker = isSelected ? MARKER_SELECTED : MARKER_NONE;
+    const isViolation = violations.length > 0;
+    if (isViolation) {
+        // Solid badge chip + red filename. The chip color is the fix direction.
+        const chipBg = rule.action === "ignore" ? IGNORE_CHIP_BG : TRACK_CHIP_BG;
+        return (_jsxs("text", { bg: rowBg, children: [_jsx("span", { fg: VIOLATION_PATH_FG, children: `  ${marker} ` }), _jsx("span", { bg: chipBg, fg: CHIP_FG, children: ` ${badge} ` }), _jsx("span", { fg: VIOLATION_PATH_FG, children: `  ${path}${suffix}` })] }, key));
     }
-    // Violated rule — color encodes severity of the fix
-    const sevColor = violation.severity === "safe" ? "yellow" : "red";
-    if (isSelected) {
-        return (_jsx("text", { bg: SELECTION_BG, fg: SELECTION_FG, children: `▶ ! ${verb}  ${path}` }, key));
-    }
-    return (_jsxs("text", { children: [_jsx("span", { fg: sevColor, children: `  ! ` }), _jsx("span", { fg: "white", children: `${verb}  ${path}` })] }, key));
+    // Clean row: flat colored badge word, dim path, no chip.
+    return (_jsxs("text", { bg: rowBg, children: [_jsx("span", { fg: badgeFg, children: `  ${marker} ` }), _jsx("span", { fg: badgeFg, children: badge }), _jsx("span", { fg: CLEAN_PATH_FG, children: `  ${path}` })] }, key));
 }

package/src/ui/renderers/gitignoreRenderers.tsx

@@ -3,68 +3,77 @@ import type { ResolvedRule, Violation } from "../../types/gitignore.js";
 
 /**
  * A unified row for the Gitignore screen — represents one resolved rule,
- * optionally annotated with the violation it has against the working tree.
+ * annotated with every violation it has against the working tree.
  */
 export interface RuleRow {
   rule: ResolvedRule;
-  violation?: Violation;
+  violations: Violation[];
 }
 
-const SELECTION_BG = "#7e57c2";
-const SELECTION_FG = "white";
+// Two color channels that never collide:
+//   • Badge color = direction (where the item ends up): green = tracked by git,
+//     reddish = ignored/dropped from git. Same on clean AND violation rows.
+//   • Filename color = severity: dim gray when fine, red when it's a violation.
+// No row background tints — red is reserved entirely for "needs attention".
+const TRACK_FG = "#5fd787"; // green — item ends up tracked by git
+const IGNORE_FG = "#d78787"; // reddish — item ends up ignored / dropped
+const VIOLATION_PATH_FG = "#ff5f5f"; // bright red filename = look here
+const CLEAN_PATH_FG = "gray";
+const SELECTED_BG = "#2a2a3a"; // faint slate highlight for the cursor row
 
-// Layout: "  X Verb    path" — 2 (gutter) + 2 (status) + 7 (verb) + 4 (gap)
-// = 15 prefix chars. On a 38-col panel inner width that leaves 23 chars for
-// the path; truncate at 22 to keep 1 col safety margin (OpenTUI <text>
-// reserves a second line if the rendered string equals the inner width).
+// Violation badges are solid chips so the required direction reads at a glance:
+// green chip = will be tracked, red chip = will be ignored/dropped.
+const TRACK_CHIP_BG = "#1f5132";
+const IGNORE_CHIP_BG = "#5a2323";
+const CHIP_FG = "white";
+
+// The only marker is the cursor: ▶ on the selected row, blank otherwise.
+// Action (track/ignore) is read from the badge word and, for clean items,
+// from the group the row sits under — so no per-row dot is needed.
+const MARKER_SELECTED = "▶";
+const MARKER_NONE = " ";
+
+// Layout: "  M action  path" — keep the prefix compact so the narrow terminal
+// case still has room for the path without wrapping.
 const MAX_PATH_LEN = 22;
 
 function truncatePath(p: string): string {
   return p.length > MAX_PATH_LEN ? p.slice(0, MAX_PATH_LEN - 1) + "…" : p;
 }
 
-export function renderRuleRow(row: RuleRow, isSelected: boolean): React.ReactNode {
-  const { rule, violation } = row;
+export function renderRuleRow(
+  row: RuleRow,
+  isSelected: boolean,
+): React.ReactNode {
+  const { rule, violations } = row;
   const path = truncatePath(rule.pattern);
   const key = `${rule.action}:${rule.pattern}`;
+  // Badge text padded to a fixed width so paths line up in a column.
+  const badge = rule.action === "ignore" ? "ignore" : "track ";
+  const badgeFg = rule.action === "ignore" ? IGNORE_FG : TRACK_FG;
+  const suffix = violations.length > 1 ? ` +${violations.length - 1}` : "";
+  const rowBg = isSelected ? SELECTED_BG : undefined;
+  const marker = isSelected ? MARKER_SELECTED : MARKER_NONE;
+  const isViolation = violations.length > 0;
 
-  // Layout: status-glyph (2) + verb (7) + 2 spaces + path
-  // OK rule: ✓ Ignore  path
-  // Violated:! Track   path
-
-  const verb = rule.action === "ignore" ? "Ignore " : "Track  ";
-
-  if (!violation) {
-    // Clean rule — muted, just confirmation
-    if (isSelected) {
-      return (
-        <text key={key} bg={SELECTION_BG} fg={SELECTION_FG}>
-          {`▶ ✓ ${verb}  ${path}`}
-        </text>
-      );
-    }
+  if (isViolation) {
+    // Solid badge chip + red filename. The chip color is the fix direction.
+    const chipBg = rule.action === "ignore" ? IGNORE_CHIP_BG : TRACK_CHIP_BG;
     return (
-      <text key={key}>
-        <span fg="green">{`  ✓ `}</span>
-        <span fg="gray">{`${verb}  ${path}`}</span>
+      <text key={key} bg={rowBg}>
+        <span fg={VIOLATION_PATH_FG}>{`  ${marker} `}</span>
+        <span bg={chipBg} fg={CHIP_FG}>{` ${badge} `}</span>
+        <span fg={VIOLATION_PATH_FG}>{`  ${path}${suffix}`}</span>
       </text>
     );
   }
 
-  // Violated rule — color encodes severity of the fix
-  const sevColor = violation.severity === "safe" ? "yellow" : "red";
-
-  if (isSelected) {
-    return (
-      <text key={key} bg={SELECTION_BG} fg={SELECTION_FG}>
-        {`▶ ! ${verb}  ${path}`}
-      </text>
-    );
-  }
+  // Clean row: flat colored badge word, dim path, no chip.
   return (
-    <text key={key}>
-      <span fg={sevColor}>{`  ! `}</span>
-      <span fg="white">{`${verb}  ${path}`}</span>
+    <text key={key} bg={rowBg}>
+      <span fg={badgeFg}>{`  ${marker} `}</span>
+      <span fg={badgeFg}>{badge}</span>
+      <span fg={CLEAN_PATH_FG}>{`  ${path}`}</span>
     </text>
   );
 }