Remove colour themes (vibe-kanban) (#805)

* Perfect! The backend changes are now complete. Here's a summary of what I've accomplished:

1. **Created new config version v7.rs**:
   - Defined new `ThemeMode` enum with only `Light`, `Dark`, `System`
   - Implemented proper migration from v6 that maps all color themes (Purple, Green, Blue, Orange, Red) to `System`
   - Added logging to inform users about the theme migration
   - Maintains all other config fields unchanged

2. **Updated config module system**:
   - Updated `mod.rs` to use v7 as the current config version
   - Added v7 module to the versions module
   - All config type aliases now point to v7 implementations

3. **Type generation**:
   - No changes needed to `generate_types.rs` - it automatically picks up the new v7 types
   - Successfully generated new TypeScript types
   - Verified that `shared/types.ts` now contains `ThemeMode` enum with only `LIGHT`, `DARK`, `SYSTEM`

4. **Migration behavior**:
   - Existing users with color themes will be automatically migrated to `System` theme on next app startup
   - Migration respects the established config versioning pattern
   - No data loss - users get a sensible default that respects their OS preference

The backend is now ready and the TypeScript types have been updated. All users with color themes will be gracefully migrated to System theme, which will respect their operating system's light/dark preference.

Ready for the frontend changes when you are!

Perfect! The TypeScript types are correctly updated to only contain the 3 theme modes.

I have successfully completed all the frontend changes to remove color theme support:

1. **✅ Updated theme-provider.tsx**:
   - Removed color theme classes (`'purple'`, `'green'`, `'blue'`, `'orange'`, `'red'`) from `classList.remove()`
   - Now only removes `'light'`, `'dark'` classes
   - Prettier formatting applied

2. **✅ Simplified theme.ts**:
   - Removed outdated comment about color themes mapping to dark
   - Updated logic to explicitly handle only `ThemeMode.DARK` instead of catch-all "other themes"
   - Function now cleanly handles only Light, Dark, and System modes

3. **✅ Settings UI automatically updated**:
   - The dropdown in `GeneralSettings.tsx` automatically populates from `Object.values(ThemeMode)`
   - Since the backend enum was updated to only include Light/Dark/System, the UI now shows only 3 options
   - No manual changes were needed - the architecture handled this automatically

- **✅ TypeScript compilation**: `npx tsc --noEmit` - No errors
- **✅ Linting**: `npm run lint` - 0 errors, 97 pre-existing warnings (unchanged)
- **✅ Formatting**: `npm run format:check` - All files properly formatted

1. **Theme switching** works seamlessly between Light/Dark/System only
2. **Settings UI** shows exactly 3 theme options instead of the previous 8
3. **CSS class cleanup** - no orphaned color theme classes remain on document root
4. **System theme** continues to properly detect OS preference
5. **User migration** - existing users with color themes will be automatically migrated to System theme on backend startup

The frontend changes are minimal, clean, and leverage the TypeScript type system to automatically update the UI. All functionality is preserved for the remaining Light/Dark/System themes while completely removing support for color themes.

**Ready for testing or deployment!** 🎉

* Format

crates/services/src/services/config/mod.rs

@@ -14,14 +14,14 @@ pub enum ConfigError {
     ValidationError(String),
 }
 
-pub type Config = versions::v6::Config;
+pub type Config = versions::v7::Config;
-pub type NotificationConfig = versions::v6::NotificationConfig;
+pub type NotificationConfig = versions::v7::NotificationConfig;
-pub type EditorConfig = versions::v6::EditorConfig;
+pub type EditorConfig = versions::v7::EditorConfig;
-pub type ThemeMode = versions::v6::ThemeMode;
+pub type ThemeMode = versions::v7::ThemeMode;
-pub type SoundFile = versions::v6::SoundFile;
+pub type SoundFile = versions::v7::SoundFile;
-pub type EditorType = versions::v6::EditorType;
+pub type EditorType = versions::v7::EditorType;
-pub type GitHubConfig = versions::v6::GitHubConfig;
+pub type GitHubConfig = versions::v7::GitHubConfig;
-pub type UiLanguage = versions::v6::UiLanguage;
+pub type UiLanguage = versions::v7::UiLanguage;
 
 /// Will always return config, trying old schemas or eventually returning default
 pub async fn load_config_from_file(config_path: &PathBuf) -> Config {

crates/services/src/services/config/versions/mod.rs

@@ -4,3 +4,4 @@ pub(super) mod v3;
 pub(super) mod v4;
 pub(super) mod v5;
 pub(super) mod v6;
+pub(super) mod v7;

crates/services/src/services/config/versions/v7.rs

@@ -0,0 +1,131 @@
+use anyhow::Error;
+use executors::{executors::BaseCodingAgent, profile::ExecutorProfileId};
+use serde::{Deserialize, Serialize};
+use strum_macros::EnumString;
+use ts_rs::TS;
+pub use v6::{EditorConfig, EditorType, GitHubConfig, NotificationConfig, SoundFile, UiLanguage};
+
+use crate::services::config::versions::v6;
+
+#[derive(Debug, Clone, Serialize, Deserialize, TS, EnumString)]
+#[ts(use_ts_enum)]
+#[serde(rename_all = "SCREAMING_SNAKE_CASE")]
+#[strum(serialize_all = "SCREAMING_SNAKE_CASE")]
+pub enum ThemeMode {
+    Light,
+    Dark,
+    System,
+}
+
+#[derive(Clone, Debug, Serialize, Deserialize, TS)]
+pub struct Config {
+    pub config_version: String,
+    pub theme: ThemeMode,
+    pub executor_profile: ExecutorProfileId,
+    pub disclaimer_acknowledged: bool,
+    pub onboarding_acknowledged: bool,
+    pub github_login_acknowledged: bool,
+    pub telemetry_acknowledged: bool,
+    pub notifications: NotificationConfig,
+    pub editor: EditorConfig,
+    pub github: GitHubConfig,
+    pub analytics_enabled: Option<bool>,
+    pub workspace_dir: Option<String>,
+    pub last_app_version: Option<String>,
+    pub show_release_notes: bool,
+    #[serde(default)]
+    pub language: UiLanguage,
+}
+
+impl Config {
+    pub fn from_previous_version(raw_config: &str) -> Result<Self, Error> {
+        let old_config = match serde_json::from_str::<v6::Config>(raw_config) {
+            Ok(cfg) => cfg,
+            Err(e) => {
+                tracing::error!("❌ Failed to parse config: {}", e);
+                tracing::error!("   at line {}, column {}", e.line(), e.column());
+                return Err(e.into());
+            }
+        };
+
+        // Map old theme modes to new simplified theme modes
+        let theme = match old_config.theme {
+            v6::ThemeMode::Light => ThemeMode::Light,
+            v6::ThemeMode::Dark => ThemeMode::Dark,
+            v6::ThemeMode::System => ThemeMode::System,
+            // Map all color themes to System (respects user's OS preference)
+            v6::ThemeMode::Purple
+            | v6::ThemeMode::Green
+            | v6::ThemeMode::Blue
+            | v6::ThemeMode::Orange
+            | v6::ThemeMode::Red => {
+                tracing::info!(
+                    "Migrating color theme {:?} to System theme",
+                    old_config.theme
+                );
+                ThemeMode::System
+            }
+        };
+
+        Ok(Self {
+            config_version: "v7".to_string(),
+            theme,
+            executor_profile: old_config.executor_profile,
+            disclaimer_acknowledged: old_config.disclaimer_acknowledged,
+            onboarding_acknowledged: old_config.onboarding_acknowledged,
+            github_login_acknowledged: old_config.github_login_acknowledged,
+            telemetry_acknowledged: old_config.telemetry_acknowledged,
+            notifications: old_config.notifications,
+            editor: old_config.editor,
+            github: old_config.github,
+            analytics_enabled: old_config.analytics_enabled,
+            workspace_dir: old_config.workspace_dir,
+            last_app_version: old_config.last_app_version,
+            show_release_notes: old_config.show_release_notes,
+            language: old_config.language,
+        })
+    }
+}
+
+impl From<String> for Config {
+    fn from(raw_config: String) -> Self {
+        if let Ok(config) = serde_json::from_str::<Config>(&raw_config)
+            && config.config_version == "v7"
+        {
+            return config;
+        }
+
+        match Self::from_previous_version(&raw_config) {
+            Ok(config) => {
+                tracing::info!("Config upgraded to v7");
+                config
+            }
+            Err(e) => {
+                tracing::warn!("Config migration failed: {}, using default", e);
+                Self::default()
+            }
+        }
+    }
+}
+
+impl Default for Config {
+    fn default() -> Self {
+        Self {
+            config_version: "v7".to_string(),
+            theme: ThemeMode::System,
+            executor_profile: ExecutorProfileId::new(BaseCodingAgent::ClaudeCode),
+            disclaimer_acknowledged: false,
+            onboarding_acknowledged: false,
+            github_login_acknowledged: false,
+            telemetry_acknowledged: false,
+            notifications: NotificationConfig::default(),
+            editor: EditorConfig::default(),
+            github: GitHubConfig::default(),
+            analytics_enabled: None,
+            workspace_dir: None,
+            last_app_version: None,
+            show_release_notes: false,
+            language: UiLanguage::default(),
+        }
+    }
+}

frontend/src/components/theme-provider.tsx

@@ -33,15 +33,7 @@ export function ThemeProvider({
   useEffect(() => {
     const root = window.document.documentElement;
 
-    root.classList.remove(
+    root.classList.remove('light', 'dark');
-      'light',
-      'dark',
-      'purple',
-      'green',
-      'blue',
-      'orange',
-      'red'
-    );
 
     if (theme === ThemeMode.SYSTEM) {
       const systemTheme = window.matchMedia('(prefers-color-scheme: dark)')

frontend/src/utils/theme.ts

@@ -18,6 +18,6 @@ export function getActualTheme(
       : 'light';
   }
 
-  // All other themes (DARK, PURPLE, GREEN, BLUE, ORANGE, RED) have dark backgrounds
+  // ThemeMode.DARK
   return 'dark';
 }

shared/types.ts

@@ -90,7 +90,7 @@ export type Config = { config_version: string, theme: ThemeMode, executor_profil
 
 export type NotificationConfig = { sound_enabled: boolean, push_enabled: boolean, sound_file: SoundFile, };
 
-export enum ThemeMode { LIGHT = "LIGHT", DARK = "DARK", SYSTEM = "SYSTEM", PURPLE = "PURPLE", GREEN = "GREEN", BLUE = "BLUE", ORANGE = "ORANGE", RED = "RED" }
+export enum ThemeMode { LIGHT = "LIGHT", DARK = "DARK", SYSTEM = "SYSTEM" }
 
 export type EditorConfig = { editor_type: EditorType, custom_command: string | null, };