feat: make graphite the default theme (#57)

Author: benvinegar

README.md

@@ -134,7 +134,7 @@ Hunk reads config from:
 Example:
 
 ```toml
-theme = "midnight" # midnight, graphite, paper, ember
+theme = "graphite" # graphite, midnight, paper, ember
 mode = "auto"      # auto, split, stack
 line_numbers = true
 wrap_lines = false

src/ui/themes.ts

@@ -76,43 +76,6 @@ function withLazySyntaxStyle(theme: Omit<AppTheme, "syntaxColors" | "syntaxStyle
 }
 
 export const THEMES: AppTheme[] = [
-  withLazySyntaxStyle({
-    id: "midnight",
-    label: "Midnight",
-    appearance: "dark",
-    background: "#08111f",
-    panel: "#0e1b2e",
-    panelAlt: "#13243a",
-    border: "#284264",
-    accent: "#7fd1ff",
-    accentMuted: "#355578",
-    text: "#eef4ff",
-    muted: "#8da5c7",
-    addedBg: "#153526",
-    removedBg: "#47262a",
-    contextBg: "#0f1b2d",
-    addedContentBg: "#102a1f",
-    removedContentBg: "#371b1e",
-    contextContentBg: "#132238",
-    addedSignColor: "#69d69a",
-    removedSignColor: "#ff8e8e",
-    lineNumberBg: "#0b1627",
-    lineNumberFg: "#56739a",
-    selectedHunk: "#20466a",
-    badgeAdded: "#5ad188",
-    badgeRemoved: "#ff8b8b",
-    badgeNeutral: "#89a5d3",
-  }, {
-      default: "#e8f1ff",
-      keyword: "#8ed4ff",
-      string: "#c7b4ff",
-      comment: "#6e85a7",
-      number: "#ffd883",
-      function: "#b6c9ff",
-      property: "#a8d6ff",
-      type: "#a4b7ff",
-      punctuation: "#6e85a7",
-    }),
   withLazySyntaxStyle({
     id: "graphite",
     label: "Graphite",
@@ -150,6 +113,43 @@ export const THEMES: AppTheme[] = [
       type: "#d3d9e2",
       punctuation: "#7f8b97",
     }),
+  withLazySyntaxStyle({
+    id: "midnight",
+    label: "Midnight",
+    appearance: "dark",
+    background: "#08111f",
+    panel: "#0e1b2e",
+    panelAlt: "#13243a",
+    border: "#284264",
+    accent: "#7fd1ff",
+    accentMuted: "#355578",
+    text: "#eef4ff",
+    muted: "#8da5c7",
+    addedBg: "#153526",
+    removedBg: "#47262a",
+    contextBg: "#0f1b2d",
+    addedContentBg: "#102a1f",
+    removedContentBg: "#371b1e",
+    contextContentBg: "#132238",
+    addedSignColor: "#69d69a",
+    removedSignColor: "#ff8e8e",
+    lineNumberBg: "#0b1627",
+    lineNumberFg: "#56739a",
+    selectedHunk: "#20466a",
+    badgeAdded: "#5ad188",
+    badgeRemoved: "#ff8b8b",
+    badgeNeutral: "#89a5d3",
+  }, {
+      default: "#e8f1ff",
+      keyword: "#8ed4ff",
+      string: "#c7b4ff",
+      comment: "#6e85a7",
+      number: "#ffd883",
+      function: "#b6c9ff",
+      property: "#a8d6ff",
+      type: "#a4b7ff",
+      punctuation: "#6e85a7",
+    }),
   withLazySyntaxStyle({
     id: "paper",
     label: "Paper",
@@ -237,5 +237,5 @@ export function resolveTheme(requested: string | undefined, themeMode: ThemeMode
     return THEMES.find((theme) => theme.id === "paper") ?? THEMES[0]!;
   }
 
-  return THEMES.find((theme) => theme.id === "midnight") ?? THEMES[0]!;
+  return THEMES.find((theme) => theme.id === "graphite") ?? THEMES[0]!;
 }

test/ui-lib.test.ts

@@ -72,7 +72,7 @@ describe("ui helpers", () => {
 
   test("buildAppMenus creates checked entries from the current shell state", () => {
     const menus = buildAppMenus({
-      activeThemeId: "midnight",
+      activeThemeId: "graphite",
       focusFiles: () => {},
       focusFilter: () => {},
       layoutMode: "stack",
@@ -105,7 +105,12 @@ describe("ui helpers", () => {
       "Line numbers",
       "Line wrapping",
     ]);
-    expect(menus.theme.some((entry) => entry.kind === "item" && entry.label === "Midnight" && entry.checked)).toBe(true);
+    expect(
+      menus.theme
+        .filter((entry): entry is Extract<MenuEntry, { kind: "item" }> => entry.kind === "item")
+        .map((entry) => entry.label),
+    ).toEqual(["Graphite", "Midnight", "Paper", "Ember"]);
+    expect(menus.theme.some((entry) => entry.kind === "item" && entry.label === "Graphite" && entry.checked)).toBe(true);
   });
 
   test("fitText and padText clamp using the terminal fallback marker", () => {
@@ -180,7 +185,7 @@ describe("ui helpers", () => {
 
     expect(midnight.id).toBe("midnight");
     expect(missingLight.id).toBe("paper");
-    expect(missingDark.id).toBe("midnight");
+    expect(missingDark.id).toBe("graphite");
     expect(resolveTheme("ember", null).syntaxStyle).toBeDefined();
   });
 });