feat: dynamic system font detection for terminal font picker

Replace the hardcoded 10-font list with dynamic system font enumeration
via fc-list IPC, falling back to canvas-based detection when unavailable.

- Add GetSystemFonts IPC channel that runs `fc-list :spacing=mono` to
  enumerate all installed monospace fonts (works on Linux natively,
  macOS via fontconfig)
- Fix canvas-based font detection false negative on macOS where the
  default monospace font (Menlo) matches the test baseline
- Widen TerminalFont type from union to string throughout store and
  persistence layer to support arbitrary font families
- Filter weight variants by taking only primary family name from
  fc-list output (283 → ~93 entries)
- Make SettingsDialog font list async-aware via SolidJS signal + effect
- Fix pre-existing bug: check_is_git_repo missing from preload allowlist
- Add .letta/ to .prettierignore

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: ASRagab

.prettierignore

@@ -5,6 +5,7 @@ release/
 node_modules/
 .worktrees/
 .claude/
+.letta/
 package-lock.json
 *.AppImage
 *.deb

electron/ipc/channels.ts

@@ -93,6 +93,9 @@ export enum IPC {
   CheckDockerImageExists = 'check_docker_image_exists',
   BuildDockerImage = 'build_docker_image',
 
+  // System
+  GetSystemFonts = 'get_system_fonts',
+
   // Notifications
   ShowNotification = 'show_notification',
   NotificationClicked = 'notification_clicked',

electron/ipc/register.ts

@@ -50,6 +50,7 @@ import { listAgents } from './agents.js';
 import { saveAppState, loadAppState } from './persistence.js';
 import { spawn } from 'child_process';
 import { askAboutCode, cancelAskAboutCode } from './ask-code.js';
+import { getSystemMonospaceFonts } from './system-fonts.js';
 import path from 'path';
 import {
   assertString,
@@ -407,6 +408,9 @@ export function registerAllHandlers(win: BrowserWindow): void {
     cancelAskAboutCode(args.requestId);
   });
 
+  // --- System ---
+  ipcMain.handle(IPC.GetSystemFonts, () => getSystemMonospaceFonts());
+
   // --- Notifications (fire-and-forget via ipcMain.on) ---
   const activeNotifications = new Set<Notification>();
   ipcMain.on(IPC.ShowNotification, (_e, args) => {

electron/ipc/system-fonts.ts

@@ -0,0 +1,35 @@
+import { execFile } from 'child_process';
+
+let cachedFonts: string[] | null = null;
+
+export async function getSystemMonospaceFonts(): Promise<string[]> {
+  if (cachedFonts) return cachedFonts;
+
+  try {
+    const fonts = await queryFcList();
+    cachedFonts = fonts;
+    return fonts;
+  } catch {
+    cachedFonts = [];
+    return [];
+  }
+}
+
+function queryFcList(): Promise<string[]> {
+  return new Promise((resolve, reject) => {
+    execFile('fc-list', [':spacing=mono', 'family'], { timeout: 5000 }, (err, stdout) => {
+      if (err) return reject(err);
+      const families = new Set<string>();
+      for (const line of stdout.split('\n')) {
+        const trimmed = line.trim();
+        if (!trimmed) continue;
+        // fc-list outputs comma-separated names: primary family first, then aliases
+        // for weight variants (e.g. "BlexMono Nerd Font,BlexMono Nerd Font Light").
+        // Taking only the first name collapses all weight variants into one entry.
+        const primary = trimmed.split(',')[0].trim();
+        if (primary && !primary.startsWith('.')) families.add(primary);
+      }
+      resolve([...families].sort((a, b) => a.localeCompare(b)));
+    });
+  });
+}

electron/preload.cjs

@@ -35,6 +35,7 @@ const ALLOWED_CHANNELS = new Set([
   'rebase_task',
   'get_main_branch',
   'get_current_branch',
+  'check_is_git_repo',
   // Persistence
   'save_app_state',
   'load_app_state',
@@ -85,6 +86,8 @@ const ALLOWED_CHANNELS = new Set([
   // Ask about code
   'ask_about_code',
   'cancel_ask_about_code',
+  // System
+  'get_system_fonts',
   // Notifications
   'show_notification',
   'notification_clicked',

src/components/SettingsDialog.tsx

@@ -1,6 +1,11 @@
-import { For, Show, createMemo } from 'solid-js';
+import { For, Show, createSignal, createEffect, on } from 'solid-js';
 import { Dialog } from './Dialog';
-import { getAvailableTerminalFonts, getTerminalFontFamily, LIGATURE_FONTS } from '../lib/fonts';
+import {
+  getAvailableTerminalFonts,
+  fetchAvailableTerminalFonts,
+  getTerminalFontFamily,
+  LIGATURE_FONTS,
+} from '../lib/fonts';
 import { LOOK_PRESETS } from '../lib/look';
 import { theme, sectionLabelStyle } from '../lib/theme';
 import {
@@ -16,20 +21,33 @@ import {
 } from '../store/store';
 import { CustomAgentEditor } from './CustomAgentEditor';
 import { mod } from '../lib/platform';
-import type { TerminalFont } from '../lib/fonts';
 
 interface SettingsDialogProps {
   open: boolean;
   onClose: () => void;
 }
 
+function ensureSelectedFont(available: string[]): string[] {
+  if (available.includes(store.terminalFont)) return available;
+  return [store.terminalFont, ...available];
+}
+
 export function SettingsDialog(props: SettingsDialogProps) {
-  const fonts = createMemo<TerminalFont[]>(() => {
-    const available = getAvailableTerminalFonts();
-    // Always include the currently selected font so it stays visible even if detection misses it
-    if (available.includes(store.terminalFont)) return available;
-    return [store.terminalFont, ...available];
-  });
+  const [fonts, setFonts] = createSignal<string[]>(ensureSelectedFont(getAvailableTerminalFonts()));
+
+  // Fetch system fonts when the dialog opens
+  createEffect(
+    on(
+      () => props.open,
+      (open) => {
+        if (open) {
+          fetchAvailableTerminalFonts().then((available) =>
+            setFonts(ensureSelectedFont(available)),
+          );
+        }
+      },
+    ),
+  );
 
   return (
     <Dialog

src/lib/fonts.ts

@@ -1,3 +1,6 @@
+import { IPC } from '../../electron/ipc/channels';
+
+/** Well-known monospace fonts used as fallback when system font enumeration is unavailable. */
 export const TERMINAL_FONTS = [
   'JetBrains Mono',
   'Fira Code',
@@ -11,53 +14,83 @@ export const TERMINAL_FONTS = [
   'Consolas',
 ] as const;
 
-export type TerminalFont = (typeof TERMINAL_FONTS)[number];
-
-export const DEFAULT_TERMINAL_FONT: TerminalFont = 'JetBrains Mono';
-
-export function isTerminalFont(v: unknown): v is TerminalFont {
-  return typeof v === 'string' && (TERMINAL_FONTS as readonly string[]).includes(v);
-}
+export const DEFAULT_TERMINAL_FONT: string = 'JetBrains Mono';
 
 /** Fonts that ship with programming ligatures (disabled in terminal via CSS). */
-export const LIGATURE_FONTS: ReadonlySet<TerminalFont> = new Set([
+export const LIGATURE_FONTS: ReadonlySet<string> = new Set([
   'JetBrains Mono',
   'Fira Code',
   'Cascadia Code',
 ]);
 
-export function getTerminalFontFamily(font: TerminalFont): string {
+export function getTerminalFontFamily(font: string): string {
   return `'${font}', monospace`;
 }
 
 /** Fonts loaded via Google Fonts — always available regardless of local install. */
-const WEB_FONTS: ReadonlySet<TerminalFont> = new Set(['JetBrains Mono']);
+const WEB_FONTS: ReadonlySet<string> = new Set(['JetBrains Mono']);
+
+/**
+ * Returns monospace fonts available on this system.
+ * Uses IPC to query the main process (fc-list), falling back to canvas-based
+ * detection of the hardcoded TERMINAL_FONTS list.
+ */
+let systemFontsPromise: Promise<string[]> | null = null;
+let systemFontsResult: string[] | null = null;
+
+export function getAvailableTerminalFonts(): string[] {
+  // Return cached result synchronously if available
+  if (systemFontsResult) return systemFontsResult;
+  // Return fallback (web fonts only) while async fetch is in progress
+  return [...WEB_FONTS];
+}
 
-/** Returns the subset of TERMINAL_FONTS that are installed on this system. Cached after first call. */
-let availableCache: TerminalFont[] | null = null;
+export async function fetchAvailableTerminalFonts(): Promise<string[]> {
+  if (systemFontsResult) return systemFontsResult;
+  if (!systemFontsPromise) {
+    systemFontsPromise = loadSystemFonts();
+  }
+  return systemFontsPromise;
+}
 
-export function getAvailableTerminalFonts(): TerminalFont[] {
-  if (availableCache) return availableCache;
+async function loadSystemFonts(): Promise<string[]> {
+  try {
+    const systemFonts = (await window.electron.ipcRenderer.invoke(IPC.GetSystemFonts)) as string[];
+    if (systemFonts.length === 0) {
+      // fc-list unavailable or returned nothing — use canvas fallback
+      systemFontsResult = detectFontsViaCanvas();
+    } else {
+      // Merge web fonts (always available) with system fonts, deduplicated
+      const all = new Set<string>([...WEB_FONTS, ...systemFonts]);
+      systemFontsResult = [...all].sort((a, b) => a.localeCompare(b));
+    }
+  } catch {
+    // IPC failed — fall back to canvas-based detection of hardcoded list
+    systemFontsResult = detectFontsViaCanvas();
+  }
+  return systemFontsResult;
+}
 
+/** Canvas-based detection of the hardcoded TERMINAL_FONTS list (fallback). */
+function detectFontsViaCanvas(): string[] {
   const canvas = document.createElement('canvas');
   const ctx = canvas.getContext('2d');
-  if (!ctx) {
-    availableCache = [...TERMINAL_FONTS];
-    return availableCache;
-  }
+  if (!ctx) return [...TERMINAL_FONTS];
 
   const testString = 'mmmmmmmmmmlli';
   const fontSize = '72px';
-  const fallback = 'monospace';
+  const fallbacks = ['serif', 'sans-serif'] as const;
 
-  ctx.font = `${fontSize} ${fallback}`;
-  const baseWidth = ctx.measureText(testString).width;
+  const baseWidths = fallbacks.map((fb) => {
+    ctx.font = `${fontSize} ${fb}`;
+    return ctx.measureText(testString).width;
+  });
 
-  availableCache = TERMINAL_FONTS.filter((font) => {
+  return TERMINAL_FONTS.filter((font) => {
     if (WEB_FONTS.has(font)) return true;
-    ctx.font = `${fontSize} '${font}', ${fallback}`;
-    return ctx.measureText(testString).width !== baseWidth;
+    return fallbacks.some((fb, i) => {
+      ctx.font = `${fontSize} '${font}', ${fb}`;
+      return ctx.measureText(testString).width !== baseWidths[i];
+    });
   });
-
-  return availableCache;
 }

src/store/persistence.ts

@@ -14,7 +14,7 @@ import type {
   Project,
 } from './types';
 import type { AgentDef } from '../ipc/types';
-import { DEFAULT_TERMINAL_FONT, isTerminalFont } from '../lib/fonts';
+import { DEFAULT_TERMINAL_FONT } from '../lib/fonts';
 import { isLookPreset } from '../lib/look';
 import { syncTerminalCounter } from './terminals';
 
@@ -283,7 +283,10 @@ export async function loadState(): Promise<void> {
         typeof mergedLinesRemovedRaw === 'number' && Number.isFinite(mergedLinesRemovedRaw)
           ? Math.max(0, Math.floor(mergedLinesRemovedRaw))
           : 0;
-      s.terminalFont = isTerminalFont(raw.terminalFont) ? raw.terminalFont : DEFAULT_TERMINAL_FONT;
+      s.terminalFont =
+        typeof raw.terminalFont === 'string' && raw.terminalFont.trim()
+          ? raw.terminalFont
+          : DEFAULT_TERMINAL_FONT;
       s.themePreset = isLookPreset(raw.themePreset) ? raw.themePreset : 'minimal';
       s.windowState = parsePersistedWindowState(raw.windowState);
       s.autoTrustFolders = typeof raw.autoTrustFolders === 'boolean' ? raw.autoTrustFolders : false;

src/store/types.ts

@@ -1,5 +1,4 @@
 import type { AgentDef, WorktreeStatus } from '../ipc/types';
-import type { TerminalFont } from '../lib/fonts';
 import type { LookPreset } from '../lib/look';
 
 export interface TerminalBookmark {
@@ -113,7 +112,7 @@ export interface PersistedState {
   completedTaskCount?: number;
   mergedLinesAdded?: number;
   mergedLinesRemoved?: number;
-  terminalFont?: TerminalFont;
+  terminalFont?: string;
   themePreset?: LookPreset;
   windowState?: PersistedWindowState;
   autoTrustFolders?: boolean;
@@ -177,7 +176,7 @@ export interface AppStore {
   completedTaskCount: number;
   mergedLinesAdded: number;
   mergedLinesRemoved: number;
-  terminalFont: TerminalFont;
+  terminalFont: string;
   themePreset: LookPreset;
   windowState: PersistedWindowState | null;
   autoTrustFolders: boolean;

src/store/ui.ts

@@ -1,6 +1,5 @@
 import { produce } from 'solid-js/store';
 import { store, setStore } from './core';
-import type { TerminalFont } from '../lib/fonts';
 import type { LookPreset } from '../lib/look';
 import type { PersistedWindowState } from './types';
 
@@ -71,7 +70,7 @@ export function toggleSidebar(): void {
   setStore('sidebarVisible', !store.sidebarVisible);
 }
 
-export function setTerminalFont(terminalFont: TerminalFont): void {
+export function setTerminalFont(terminalFont: string): void {
   setStore('terminalFont', terminalFont);
 }