* update cleanup script docs * Perfect! I've successfully created comprehensive documentation for the Preview Mode feature and updated the existing documentation. Here's what I've completed: ## New Documentation Created **[Preview Mode](/core-features/preview-mode)** - A complete guide covering: - Overview and key benefits - Prerequisites and setup requirements - Step-by-step setup instructions for the Web Companion - Usage instructions with toolbar controls - Component selection workflow - Comprehensive troubleshooting section - Advanced usage examples ## Updated Documentation **[Task Details Full Screen Mode](/core-features/task-details-full-screen)** - Enhanced with: - Added Preview tab to the right panel navigation - New Preview Tab section explaining embedded browser functionality - Cross-reference link to the detailed Preview Mode documentation - Updated related documentation links **[Navigation](/docs.json)** - Added the new preview-mode page to the Core Features section ## Key Features Documented The documentation covers all the preview mode capabilities you described: - **Initial setup** requirements and configuration - **Automatic URL detection** from development server logs - **Embedded browser** viewing within full screen mode - **Web Companion installation** for component selection - **Precise component selection** with Alt+click and context menus - **Seamless workflows** without leaving Vibe Kanban The documentation includes placeholder spaces for screenshots as requested, and follows the existing Mintlify documentation patterns with proper formatting, components, and cross-references. * I've successfully updated the [Vibe Kanban MCP Server documentation](/integrations/vibe-kanban-mcp-server) with comprehensive tool coverage: ## New Documentation Sections Added **Available MCP Tools** - Complete reference tables organized by category: - **Project Operations**: `list_projects` - **Task Management**: `list_tasks`, `create_task`, `get_task`, `update_task`, `delete_task` - **Task Execution**: `start_task_attempt` (new feature) **Supported Executors** - Full list of coding agents that can be used with `start_task_attempt` **Status Values** - Valid kebab-case status values for filtering and updates ## Enhanced Example Usage **Planning and Task Creation** - Shows how coding agents use the `create_task` tool **Starting Task Execution** - Demonstrates the new `start_task_attempt` feature with example JSON parameters **Complete Workflow Example** - End-to-end workflow from listing projects to starting task execution The documentation now provides a complete reference for all MCP tools, with the new `start_task_attempt` feature prominently highlighted and explained with practical examples. * Done! I've updated [supported-coding-agents.mdx](file:///private/var/folders/5q/5vgq75y92dz0k7n62z93299r0000gn/T/vibe-kanban/worktrees/4d6d-update-docs/docs/supported-coding-agents.mdx): 1. **Reordered**: Claude Code first, OpenAI Codex second, then Amp 2. **Renamed**: "Codex" → "OpenAI Codex" 3. **Renamed**: "SST OpenCode" → "OpenCode" * Done! Updated [vibe-kanban-mcp-server.mdx](file:///private/var/folders/5q/5vgq75y92dz0k7n62z93299r0000gn/T/vibe-kanban/worktrees/4d6d-update-docs/docs/integrations/vibe-kanban-mcp-server.mdx): 1. Added syntax note to Option 2: Manual Configuration 2. Removed type hints from all parameters in MCP tools table 3. Removed the Info callout about `start_task_attempt` being newly added * Done! Removed the Status Values section from [vibe-kanban-mcp-server.mdx](file:///private/var/folders/5q/5vgq75y92dz0k7n62z93299r0000gn/T/vibe-kanban/worktrees/4d6d-update-docs/docs/integrations/vibe-kanban-mcp-server.mdx). * Done! I've updated the terminology in [vibe-kanban-mcp-server.mdx](file:///private/var/folders/5q/5vgq75y92dz0k7n62z93299r0000gn/T/vibe-kanban/worktrees/4d6d-update-docs/docs/integrations/vibe-kanban-mcp-server.mdx): - Changed section heading from "Using MCP with Coding Agents" to "Using the MCP Server" - Replaced "your coding agent" with "your MCP client" in the workflow steps and examples - Kept references to "coding agents" only where appropriate (e.g., when referring to agents within Vibe Kanban, or the executor parameter for `start_task_attempt`) * fix docs (vibe-kanban a870f5a1) The server is live and the docs are accessible via the URL http://localhost:3000/core-features/preview-mode I'm seeing `🚧 A parsing error occured. Please contact the owner of this website.` on this preview mode page and it seemingly has something to do with the Steps component. Using the Chrome DevTools that you have access to, you should be able to launch the website and iteratively make changes until this error is no longer present and the preview mode documentation is displaying itself as intended. You can look at recent commits to understand what has been changed with this documentation. You also have access to the Mintlify tools in order to search the official Mintlify documentation in case you need to troubleshoot. * Done! I've updated the [preview-mode.mdx](file:///private/var/folders/5q/5vgq75y92dz0k7n62z93299r0000gn/T/vibe-kanban/worktrees/4d6d-update-docs/docs/core-features/preview-mode.mdx) with: 1. **Emphasized automatic installation** as the recommended approach with an Info callout 2. **Accurate setup steps** from the official README for Create React App, Next.js, and Vite 3. **Removed conditional rendering** (`process.env.NODE_ENV` checks) since tree-shaking handles this automatically 4. **Added note about tree-shaking** to clarify that the companion is automatically removed from production builds * Done! I've completed both tasks: 1. ✅ Copied the dev server screenshot to [docs/images/preview-mode-start-dev-server.png](file:///private/var/folders/5q/5vgq75y92dz0k7n62z93299r0000gn/T/vibe-kanban/worktrees/4d6d-update-docs/docs/images/preview-mode-start-dev-server.png) 2. ✅ Removed the "Advanced Usage" section from [preview-mode.mdx](file:///private/var/folders/5q/5vgq75y92dz0k7n62z93299r0000gn/T/vibe-kanban/worktrees/4d6d-update-docs/docs/core-features/preview-mode.mdx) * Done! I've completed all the image updates: 1. ✅ Replaced the dev server start image with the new screenshot 2. ✅ Added all preview mode screenshots: - `preview-mode-interface.png` - Preview tab with dev server on - `preview-mode-component-selection.png` - Hovering over component with companion - `preview-mode-component-depth.png` - Component selected showing hierarchy 3. ✅ Removed all placeholder comments from the Frame elements * Done! I've completed all 6 review fixes: 1. ✅ Copied dev script config screenshot 2. ✅ Added install companion button screenshot within the Info callout 3. ✅ Removed the false "Automatically switch to Preview tab when ready" line 4. ✅ Added preview toolbar screenshot 5. ✅ Removed "Stop Dev" from toolbar controls (it's not part of the toolbar) 6. ✅ Fixed component selection instructions - now correctly states to click the floating VK companion button in bottom-right corner, removed incorrect Alt+Click and Context Menu instructions * Done! I've simplified the troubleshooting section to only include the relevant tip about ensuring the development server prints the URL to stdout/stderr for automatic detection, along with the supported URL formats. Removed all the less relevant troubleshooting content. * Done! I've completed all 3 review fixes: 1. ✅ Removed emojis from toolbar controls (🔄, 📋, 🌐) 2. ✅ Replaced component depth image with new screenshot and moved the old one to the top as an overview image 3. ✅ Removed "IDE" from the overview text - now only mentions switching between browser and Vibe Kanban * Done! Replaced the overview image with the new screenshot. * Done! I've fixed both issues in [task-details-full-screen.mdx](file:///private/var/folders/5q/5vgq75y92dz0k7n62z93299r0000gn/T/vibe-kanban/worktrees/4d6d-update-docs/docs/core-features/task-details-full-screen.mdx): 1. ✅ Updated toolbar description from "Start, stop, and manage your development server" to "Refresh the preview, copy the URL, or open in a new browser tab" 2. ✅ Changed image from `vk-preview.png` to `preview-mode-overview.png` (same as the preview mode docs page) * Done! I've added GitHub Copilot to the [supported coding agents documentation](file:///private/var/folders/5q/5vgq75y92dz0k7n62z93299r0000gn/T/vibe-kanban/worktrees/4d6d-update-docs/docs/supported-coding-agents.mdx). The new section includes: - Installation instructions via npm (`npm install -g @github/copilot`) - Prerequisites (Copilot subscription, Node.js 22+, npm 10+) - Authentication instructions using the `/login` command - Link to official GitHub Copilot CLI documentation It's positioned between Amp and Cursor CLI in the list. * Done! Removed the placeholder comment from [preview-mode.mdx](file:///private/var/folders/5q/5vgq75y92dz0k7n62z93299r0000gn/T/vibe-kanban/worktrees/4d6d-update-docs/docs/core-features/preview-mode.mdx). * remove old preview * Done! I've updated [vibe-kanban-mcp-server.mdx](file:///private/var/folders/5q/5vgq75y92dz0k7n62z93299r0000gn/T/vibe-kanban/worktrees/4d6d-update-docs/docs/integrations/vibe-kanban-mcp-server.mdx) with both corrections: 1. ✅ Changed "Create a task in 'plan mode'" to mention creating a custom agent profile with a planning prompt, with a link to the Agent Configurations documentation 2. ✅ Changed "Generate Sub-Tasks" to "Generate Tasks" since the MCP server only generates tasks, not sub-tasks * Done! Removed the "Real-time preview" line from the key benefits section in [preview-mode.mdx](file:///private/var/folders/5q/5vgq75y92dz0k7n62z93299r0000gn/T/vibe-kanban/worktrees/4d6d-update-docs/docs/core-features/preview-mode.mdx). * update docs on Codex w/ ChatGPT * update MCP server install command docs
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
We use GitHub Discussions for feature requests. Please open a discussion to create a feature request. For bugs please open an issue on this repo.
Contributing
We would prefer that ideas and changes are first raised with the core team via GitHub Discussions or Discord, 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
