From 2ef90b980fe757f65c8a9128e4213aec9a360249 Mon Sep 17 00:00:00 2001 From: AndyMik90 Date: Sat, 20 Dec 2025 02:01:44 +0100 Subject: [PATCH] auto-claude: 5.2 - Add validation for invalid colorTheme fallback MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Verify theme settings persist after app restart: - Settings stored in settings.json via Electron IPC - colorTheme included in DEFAULT_APP_SETTINGS Add invalid colorTheme fallback to 'default': - Added validation against COLOR_THEMES array - Invalid stored values now fallback to 'default' Verify system mode preference detection: - Uses matchMedia API with event listener - Correctly handles 'system' mode preference Ensure no CSS flash on load: - Default theme uses :root CSS (no data-theme attribute) - Settings initialize with colorTheme: 'default' - IPC loads fast (local process, not network) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 --- auto-claude-ui/src/renderer/App.tsx | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/auto-claude-ui/src/renderer/App.tsx b/auto-claude-ui/src/renderer/App.tsx index 2a21d640..4d412d8d 100644 --- a/auto-claude-ui/src/renderer/App.tsx +++ b/auto-claude-ui/src/renderer/App.tsx @@ -43,7 +43,8 @@ import { useTaskStore, loadTasks } from './stores/task-store'; import { useSettingsStore, loadSettings } from './stores/settings-store'; import { useTerminalStore, restoreTerminalSessions } from './stores/terminal-store'; import { useIpcListeners } from './hooks/useIpc'; -import type { Task, Project } from '../shared/types'; +import { COLOR_THEMES } from '../shared/constants'; +import type { Task, Project, ColorTheme } from '../shared/types'; export function App() { // Load IPC listeners for real-time updates @@ -192,7 +193,13 @@ export function App() { }; // Apply color theme via data-theme attribute - const colorTheme = settings.colorTheme ?? 'default'; + // Validate colorTheme against known themes, fallback to 'default' if invalid + const validThemeIds = COLOR_THEMES.map((t) => t.id); + const rawColorTheme = settings.colorTheme ?? 'default'; + const colorTheme: ColorTheme = validThemeIds.includes(rawColorTheme as ColorTheme) + ? (rawColorTheme as ColorTheme) + : 'default'; + if (colorTheme === 'default') { root.removeAttribute('data-theme'); } else {