* 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
Get 10X more out of Claude Code, Gemini CLI, Codex, Amp and other coding agents...
Overview
AI coding agents are increasingly writing the world's code and human engineers now spend the majority of their time planning, reviewing, and orchestrating tasks. Vibe Kanban streamlines this process, enabling you to:
- Easily switch between different coding agents
- Orchestrate the execution of multiple coding agents in parallel or in sequence
- Quickly review work and start dev servers
- Track the status of tasks that your coding agents are working on
- Centralise configuration of coding agent MCP configs
You can watch a video overview here.
Installation
Make sure you have authenticated with your favourite coding agent. A full list of supported coding agents can be found in the docs. Then in your terminal run:
npx vibe-kanban
Documentation
Please head to the website for the latest documentation and user guides.
Support
Please open an issue on this repo if you find any bugs or have any feature requests.
Contributing
We would prefer that ideas and changes are raised with the core team via GitHub issues, where we can discuss implementation details and alignment with the existing roadmap. Please do not open PRs without first discussing your proposal with the team.
Development
Prerequisites
Additional development tools:
cargo install cargo-watch
cargo install sqlx-cli
Install dependencies:
pnpm i
Running the dev server
pnpm run dev
This will start the backend. A blank DB will be copied from the dev_assets_seed folder.
Building the frontend
To build just the frontend:
cd frontend
pnpm build
Build from source
- Run
build-npm-package.sh - In the
npx-clifolder runnpm pack - You can run your build with
npx [GENERATED FILE].tgz
Environment Variables
The following environment variables can be configured at build time or runtime:
| Variable | Type | Default | Description |
|---|---|---|---|
GITHUB_CLIENT_ID |
Build-time | Ov23li9bxz3kKfPOIsGm |
GitHub OAuth app client ID for authentication |
POSTHOG_API_KEY |
Build-time | Empty | PostHog analytics API key (disables analytics if empty) |
POSTHOG_API_ENDPOINT |
Build-time | Empty | PostHog analytics endpoint (disables analytics if empty) |
BACKEND_PORT |
Runtime | 0 (auto-assign) |
Backend server port |
FRONTEND_PORT |
Runtime | 3000 |
Frontend development server port |
HOST |
Runtime | 127.0.0.1 |
Backend server host |
DISABLE_WORKTREE_ORPHAN_CLEANUP |
Runtime | Not set | Disable git worktree cleanup (for debugging) |
Build-time variables must be set when running pnpm run build. Runtime variables are read when the application starts.
Custom GitHub OAuth App (Optional)
By default, Vibe Kanban uses Bloop AI's GitHub OAuth app for authentication. To use your own GitHub app for self-hosting or custom branding:
- Create a GitHub OAuth App at GitHub Developer Settings
- Enable "Device Flow" in the app settings
- Set scopes to include
user:email,repo - Build with your client ID:
GITHUB_CLIENT_ID=your_client_id_here pnpm run build
