# https://github.com/BloopAI/vibe-kanban 项目说明书 生成时间：2026-05-18 03:48:47 UTC ## 目录 - [Project Introduction](#page-project-introduction) - [Key Concepts](#page-key-concepts) - [Development Setup](#page-development-setup) - [Backend Architecture](#page-backend-architecture) - [Frontend Architecture](#page-frontend-architecture) - [Crate Reference](#page-crate-reference) - [Coding Agent Executors](#page-executors) - [MCP Server Integration](#page-mcp-integration) - [Relay and Remote Access](#page-relay-remote-access) - [Database and Data Models](#page-database-models) - [Deployment and Infrastructure](#page-deployment-infrastructure) ## Project Introduction ### 相关页面 相关主题：[Key Concepts](#page-key-concepts), [Development Setup](#page-development-setup)
相关源码文件 以下源码文件用于生成本页说明： - [README.md](https://github.com/BloopAI/vibe-kanban/blob/main/README.md) - [packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts) - [packages/web-core/src/shared/stores/useUiPreferencesStore.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/stores/useUiPreferencesStore.ts) - [packages/ui/src/components/CommandBar.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/ui/src/components/CommandBar.tsx) - [packages/web-core/src/shared/components/WorkspacesSidebar.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/components/WorkspacesSidebar.tsx) - [crates/server/src/routes/oauth.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/server/src/routes/oauth.rs)
# Project Introduction Vibe Kanban is a specialized project planning and agent execution platform designed for software engineering teams that leverage AI coding agents. The project provides an integrated environment where teams can plan work using kanban issues and execute coding tasks through dedicated workspaces that give AI agents controlled access to code branches, terminals, and development servers. ## Purpose and Scope The primary purpose of Vibe Kanban is to address the workflow inefficiency that emerges when software engineers spend significant time planning and reviewing AI coding agent activities. By providing a structured kanban interface combined with agent execution capabilities, the platform enables teams to: - Plan and prioritize work through visual kanban boards - Execute coding tasks through multiple supported AI agents - Review AI-generated changes with inline commenting capabilities - Preview applications directly within the development environment - Create and merge pull requests without context switching 资料来源：[README.md](https://github.com/BloopAI/vibe-kanban/blob/main/README.md) ## Supported AI Agents Vibe Kanban integrates with a wide variety of coding agents, allowing teams to choose the most appropriate tool for their needs. The platform supports the following agents: | Agent | Description | |-------|-------------| | Claude Code | Anthropic's CLI agent | | Codex | OpenAI's coding agent | | Gemini CLI | Google's CLI agent | | GitHub Copilot | GitHub's AI pair programmer | | Amp | Alternative agent | | Cursor | Cursor AI IDE agent | | OpenCode | Open source agent | | Droid | Android development agent | | CCR | Custom agent integration | | Qwen Code | Alibaba's coding agent | 资料来源：[README.md](https://github.com/BloopAI/vibe-kanban/blob/main/README.md) ## Architecture Overview Vibe Kanban follows a monorepo architecture with multiple packages organized for different concerns. ```mermaid graph TD subgraph "packages/" WC["web-core
(packages/web-core)"] UI["ui
(packages/ui)"] REM["remote-web
(packages/remote-web)"] end subgraph "crates/" SERVER["server
(crates/server)"] end WC <--> SERVER UI <--> WC REM --> SERVER ``` ### Core Packages The web application is built using multiple TypeScript packages: - **packages/web-core**: Contains shared hooks, stores, dialogs, and components that form the business logic layer - **packages/ui**: Reusable UI components including CommandBar, WorkspaceSidebar, and various input components - **packages/remote-web**: Pages and layouts for the remote/web deployment scenarios The backend is implemented in Rust using Actix-web, providing OAuth authentication and API endpoints. 资料来源：[packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts) ## Key Features ### Kanban Issue Management The kanban board provides a visual interface for creating, prioritizing, and assigning issues. Teams can organize work privately or collaboratively, with issues flowing through customizable status columns. ### Workspace Execution Workspaces provide isolated environments for AI agents to execute tasks. Each workspace includes: - A dedicated git branch for the task - Terminal access for command execution - Integrated dev server for live preview - Diff viewing and inline commenting ```mermaid graph LR A[Kanban Issue] --> B[Create Workspace] B --> C[Agent Executes on Branch] C --> D[Review Diffs] D --> E[Inline Comments] E --> F[Create PR] F --> G[Merge] ``` 资料来源：[packages/ui/src/components/WorkspacesSidebar.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/ui/src/components/WorkspacesSidebar.tsx) ### Command Bar Navigation The application features a comprehensive command palette (activated via `Cmd+K`) that provides quick access to all major functionality: - Repository and branch selection - Status and priority filtering - Issue navigation and creation - Workspace management ```typescript // Keyboard shortcut mappings from useWorkspaceShortcuts.ts const SHORTCUTS = { 'v>p': 'Toggle Preview Mode', 'v>s': 'Toggle Left Sidebar', 'v>h': 'Toggle Left Main Panel', 'x>p': 'Git Create PR', 'x>m': 'Git Merge', 'x>r': 'Git Rebase', 'x>u': 'Git Push', 't>d': 'Toggle Dev Server', 'r>s': 'Run Setup Script', 'r>c': 'Run Cleanup Script' }; ``` 资料来源：[packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts) ### Attachment and Comment System Issues support rich commenting with file attachments. The system handles upload progression, confirmation states, and attachment metadata tracking. ```typescript // Attachment state transitions type AttachmentStatus = 'uploading' | 'confirming' | 'completed'; interface LocalAttachmentMetadata { path: string; pending_status: AttachmentStatus; upload_progress: number; } ``` 资料来源：[packages/web-core/src/shared/hooks/useAzureAttachments.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/hooks/useAzureAttachments.ts) ### Pending Approval Workflow When agents require human authorization for sensitive operations, the system displays a pending approval entry that allows users to approve or deny requests with explanatory messages. ```mermaid stateDiagram-v2 [*] --> AgentRequestsAction AgentRequestsAction --> PendingApproval PendingApproval --> Approved: User Approves PendingApproval --> Denied: User Denies Approved --> [*] Denied --> AgentResubmits: Agent Adjusts AgentResubmits --> PendingApproval ``` 资料来源：[packages/web-core/src/shared/components/NormalizedConversation/PendingApprovalEntry.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/components/NormalizedConversation/PendingApprovalEntry.tsx) ## UI State Management The application maintains comprehensive UI state through Zustand stores, handling layout modes, panel visibility, and workspace-specific configurations. ```typescript // Core UI preferences from useUiPreferencesStore.ts interface UiPreferencesState { layoutMode: 'workspaces' | 'kanban' | 'accordion'; isLeftSidebarVisible: boolean; isRightSidebarVisible: boolean; isTerminalVisible: boolean; paneSizes: Record; workspacePanelStates: Record; } ``` 资料来源：[packages/web-core/src/shared/stores/useUiPreferencesStore.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/stores/useUiPreferencesStore.ts) ## OAuth Authentication The server implements OAuth authentication flows for secure user sessions, returning HTML responses for browser-based authentication callbacks. ```rust // Simplified OAuth response structure struct OAuthCallback { message: String, // Success or error message app_icon: Vec, // Base64 encoded application icon } ``` 资料来源：[crates/server/src/routes/oauth.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/server/src/routes/oauth.rs) ## Git Operations The platform integrates comprehensive Git functionality directly into the workspace workflow: | Operation | Shortcut | Description | |-----------|----------|-------------| | Create Pull Request | `x>p` | Generate PR with AI-written descriptions | | Merge | `x>m` | Merge approved pull requests | | Rebase | `x>r` | Rebase branch onto target | | Push | `x>u` | Push changes to remote | | Force Push | (Dialog) | Force push with warning confirmation | Force push operations require explicit user confirmation through a dedicated dialog due to the destructive nature of the operation. 资料来源：[packages/web-core/src/shared/dialogs/command-bar/ForcePushDialog.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/dialogs/command-bar/ForcePushDialog.tsx) ## Conflict Resolution When Git operations encounter conflicts, the application provides a dedicated dialog to help users resolve them, displaying conflicted files and offering options to create new sessions or continue with existing ones. ```typescript interface ResolveConflictsDialogProps { conflictedFiles: string[]; profiles?: ExecutorProfile[]; hasExistingSession: boolean; createNewSession: boolean; onCreateNewSessionChange: (value: boolean) => void; } ``` 资料来源：[packages/web-core/src/shared/dialogs/tasks/ResolveConflictsDialog.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/dialogs/tasks/ResolveConflictsDialog.tsx) ## Development Workflow Summary ```mermaid graph TD A[Plan Issue on Kanban] --> B[Create Workspace] B --> C[Select Agent] C --> D[Agent Executes Tasks] D --> E{Requires Approval?} E -->|Yes| F[User Reviews & Approves/Denies] F --> G[Agent Continues] E -->|No| G G --> H[Review Diffs & Comments] H --> I[Create Pull Request] I --> J[Merge to Main] J --> K[Archive Workspace] ``` The platform streamlines the entire development lifecycle from initial planning through final merge, keeping all stakeholders in a single interface throughout the process. --- ## Key Concepts ### 相关页面 相关主题：[Project Introduction](#page-project-introduction), [Database and Data Models](#page-database-models)
相关源码文件 以下源码文件用于生成本页说明： - [packages/web-core/src/shared/stores/useUiPreferencesStore.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/stores/useUiPreferencesStore.ts) - [packages/ui/src/components/WorkspacesSidebar.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/ui/src/components/WorkspacesSidebar.tsx) - [packages/web-core/src/shared/components/tasks/TaskDetails/ProcessesTab.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/components/tasks/TaskDetails/ProcessesTab.tsx) - [packages/ui/src/components/IssueCommentsSection.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/ui/src/components/IssueCommentsSection.tsx) - [packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts) - [packages/web-core/src/shared/dialogs/command-bar/WorkspaceSelectionDialog.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/dialogs/command-bar/WorkspaceSelectionDialog.tsx)
# Key Concepts Vibe Kanban is a development workflow management tool designed for software engineering teams that work with AI coding agents. The application combines kanban-based issue planning with workspace-based agent execution, enabling engineers to plan, delegate, and review AI-assisted coding work within a unified interface. ## Core Architecture Overview The system is built around several interconnected concepts that work together to manage the lifecycle of AI-assisted development tasks. ```mermaid graph TD A[Organizations] --> B[Projects] B --> C[Kanban Issues] B --> D[Workspaces] C -->|Assign to| D D --> E[Sessions] D --> F[Scratches] E --> G[Processes] G --> H[Git Operations] E --> I[Attachments] D --> J[Dev Server] ``` ## Projects Projects serve as the top-level organizational unit in Vibe Kanban. Each project contains its own kanban board and associated workspaces. ### Project Properties | Property | Type | Description | |----------|------|-------------| | `id` | string | Unique identifier | | `name` | string | Display name | | `color` | string | Hex color for UI identification | | `updated_at` | timestamp | Last modification time | Projects are organized under organizations and contain all related kanban issues and workspaces. 资料来源：[packages/remote-web/src/pages/HomePage.tsx:60-80]() ### Project Card Component The `ProjectCard` component renders project items in the home page grid layout, displaying project name and providing navigation to individual project views. 资料来源：[packages/remote-web/src/pages/HomePage.tsx:80-100]() ## Workspaces Workspaces are the execution environment where coding agents operate. Each workspace provides an isolated branch, terminal access, and a dev server for a single coding agent. ### Workspace Lifecycle ```mermaid stateDiagram-v2 [*] --> Active: Created Active --> Running: Agent starts Running --> Active: Agent pauses Active --> Archived: User archives Running --> Completed: Task finished Archived --> Active: User restores Completed --> [*] Active --> [*] ``` ### Workspace Properties | Property | Type | Description | |----------|------|-------------| | `id` | string | Unique workspace identifier | | `name` | string | Display name | | `branch` | string | Git branch name | | `filesChanged` | number | Count of modified files | | `linesAdded` | number | Lines of code added | | `linesRemoved` | number | Lines of code removed | | `isRunning` | boolean | Agent currently executing | | `isPinned` | boolean | Pinned for quick access | | `isArchived` | boolean | Archived state | | `hasPendingApproval` | boolean | Awaiting human approval | | `hasRunningDevServer` | boolean | Dev server active | | `hasUnseenActivity` | boolean | New activity since last view | | `latestProcessCompletedAt` | timestamp | Last process completion | | `latestProcessStatus` | string | Status of latest process | | `prStatus` | string | Pull request status | 资料来源：[packages/ui/src/components/WorkspacesSidebar.tsx:20-40]() ### Workspace Panel State Management The UI preferences store manages workspace panel visibility states, allowing users to toggle the left main panel and persist these preferences. 资料来源：[packages/web-core/src/shared/stores/useUiPreferencesStore.ts:30-50]() ## Sessions Sessions represent individual agent execution instances within a workspace. Each time a coding agent runs, it creates a new session that captures the execution context. ### Session Attributes Sessions track the complete execution context including: - **Profile Configuration**: The AI model and agent settings used - **Context Window**: Available memory and context for the agent - **Execution History**: Commands executed and outputs generated - **Process Chain**: Sequential processes that ran during the session 资料来源：[packages/web-core/src/shared/components/tasks/TaskDetails/ProcessesTab.tsx:20-60]() ### Process Tracking Each session contains multiple processes that represent discrete units of work: ```mermaid graph LR A[Process Start] --> B[Running] B --> C[User Approval Point] C -->|Approved| B C -->|Rejected| D[Stopped] B --> E[Completed] D --> E ``` The process tab displays: - Process status (running, completed, stopped) - Started timestamp - Completed timestamp - Copy logs functionality 资料来源：[packages/web-core/src/shared/components/tasks/TaskDetails/ProcessesTab.tsx:60-100]() ## Kanban Issues Kanban issues are the planning units in Vibe Kanban. They can be created, prioritized, and assigned to workspaces for execution. ### Issue Comments The `IssueCommentsSection` component handles all comment-related functionality for issues: ```typescript interface IssueCommentsSectionProps { comments: IssueCommentData[]; commentInput: string; editingCommentId: string | null; editingValue: string; reactionsByCommentId: Map; localAttachments?: LocalAttachmentMetadata[]; // ... additional handlers } ``` 资料来源：[packages/ui/src/components/IssueCommentsSection.tsx:1-30]() ### Comment Features | Feature | Description | |---------|-------------| | Add Comment | Submit new comments on issues | | Edit Comment | Modify existing comments | | Delete Comment | Remove comments | | Reactions | Add emoji reactions to comments | | Reply | Quote and reply to specific comments | | Attachments | Upload files to comments | ### Issue Priority and Status Issues support priority levels and status tracking, accessible through the command bar. Priority labels include urgency indicators, while status values track issue progression through workflow states. 资料来源：[packages/ui/src/components/CommandBar.tsx:80-100]() ## Scratches Scratches are temporary execution spaces that allow quick experimentation or notes without creating a full workspace. They share the workspace execution environment but are not persisted in the same way. ## Git Operations Vibe Kanban integrates Git operations directly into the workspace workflow: | Operation | Shortcut | Description | |-----------|----------|-------------| | Create PR | `x>p` | Create pull request | | Merge | `x>m` | Merge current branch | | Rebase | `x>r` | Rebase onto target branch | | Push | `x>u` | Push changes | | Force Push | Dialog | Force push with confirmation | 资料来源：[packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts:1-20]() ### Conflict Resolution When conflicts occur during Git operations, the `ResolveConflictsDialog` handles conflict detection and resolution workflows, allowing users to select agents and profiles for creating new resolution sessions. 资料来源：[packages/web-core/src/shared/dialogs/tasks/ResolveConflictsDialog.tsx:50-80]() ## UI Layout and Navigation ### Layout Modes Vibe Kanban supports two primary layout modes: | Mode | Description | |------|-------------| | `kanban` | Kanban board view for issue planning | | `workspaces` | Workspace-focused view for agent execution | The layout mode can be toggled via the UI preferences store. 资料来源：[packages/web-core/src/shared/stores/useUiPreferencesStore.ts:20-30]() ### Keyboard Shortcuts Comprehensive keyboard shortcuts enable efficient workflow management: | Category | Shortcut | Action | |----------|----------|--------| | View | `v>p` | Toggle preview mode | | View | `v>s` | Toggle left sidebar | | View | `v>h` | Toggle left main panel | | Git | `x>p` | Create PR | | Git | `x>m` | Merge | | Git | `x>r` | Rebase | | Git | `x>u` | Push | | Copy | `y>p` | Copy workspace path | | Copy | `y>l` | Copy raw logs | | Terminal | `t>d` | Toggle dev server | | Terminal | `t>w` | Toggle wrap lines | | Scripts | `r>s` | Run setup script | | Scripts | `r>c` | Run cleanup script | 资料来源：[packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts:1-30]() ### Sidebar Components The `WorkspacesSidebar` provides the main navigation interface with sections for: - Active workspaces - Draft workspaces (in creation) - Archived workspaces - Needs attention section (with raised hand indicator) Workspaces can be filtered and sorted, with visual indicators for running agents, pending approvals, and unseen activity. 资料来源：[packages/ui/src/components/WorkspacesSidebar.tsx:10-50]() ## Command Bar The command bar (`CommandBar`) provides quick access to all application actions through a searchable interface: ### Command Item Types | Type | Search Label Format | |------|---------------------| | `page` | `{pageId} {label}` | | `repo` | `{repoId} {displayName}` | | `branch` | `{branchName}` | | `status` | `{statusId} {statusName}` | | `priority` | `{priorityId} {priorityName}` | | `issue` | `{issueId} {simpleId} {title}` | | `createSubIssue` | `create new issue` | 资料来源：[packages/ui/src/components/CommandBar.tsx:100-130]() ### Workspace Selection The `WorkspaceSelectionDialog` enables linking kanban issues to workspaces, displaying available workspaces with their branch information and archive status. 资料来源：[packages/web-core/src/shared/dialogs/command-bar/WorkspaceSelectionDialog.tsx:30-60]() ## Data Flow Architecture ```mermaid graph TD subgraph Frontend A[React Components] --> B[Zustand Stores] B --> C[API Client] end subgraph Backend C --> D[Rust Server] D --> E[Database] D --> F[OAuth Handler] end B -->|Optimistic Updates| A C -->|REST API| D D -->|CRUD| E ``` ## File Tree Persistence The UI preferences store persists file tree collapsed paths per workspace using a keyed storage system: ```typescript const key = workspaceId ? `file-tree:${workspaceId}` : ''; const paths = useUiPreferencesStore((s) => s.collapsedPaths[key] ?? []); ``` This ensures that file tree expansion states are preserved across sessions and workspace switches. 资料来源：[packages/web-core/src/shared/stores/useUiPreferencesStore.ts:70-100]() ## Integration Points ### OAuth Flow The Rust server handles OAuth authentication flows, returning branded HTML pages for authentication completion. 资料来源：[crates/server/src/routes/oauth.rs:1-30]() ### GitHub CLI Setup The `GhCliSetupDialog` guides users through GitHub CLI installation and authentication, with help instructions for common error variants. 资料来源：[packages/web-core/src/shared/dialogs/auth/GhCliSetupDialog.tsx:1-50]() ## Related Documentation - [Installation Guide](./installation.md) - [Getting Started](./getting-started.md) - [API Reference](./api-reference.md) - [Configuration](./configuration.md) --- ## Development Setup ### 相关页面 相关主题：[Project Introduction](#page-project-introduction), [Backend Architecture](#page-backend-architecture)
相关源码文件 以下源码文件用于生成本页说明： - [npx-cli/README.md](https://github.com/BloopAI/vibe-kanban/blob/main/npx-cli/README.md) - [npx-cli/package.json](https://github.com/BloopAI/vibe-kanban/blob/main/npx-cli/package.json) - [README.md](https://github.com/BloopAI/vibe-kanban/blob/main/README.md) - [packages/web-core/src/shared/hooks/useAzureAttachments.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/hooks/useAzureAttachments.ts) - [packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts)
# Development Setup This guide covers the development environment setup for Vibe Kanban, a visual project management tool for developers that integrates with git repositories and coding agents. ## Project Architecture Overview Vibe Kanban is a monorepo application built with multiple technologies: ```mermaid graph TD subgraph "Frontend (TypeScript/React)" A[packages/web-core] --> B[packages/ui] A --> C[packages/remote-web] end subgraph "CLI Layer" D[npx-cli] --> A D --> E[vibe-kanban-mcp] end subgraph "Backend (Rust)" F[crates/server] end D --> F ``` ## Prerequisites ### System Requirements | Requirement | Version | Purpose | |-------------|---------|---------| | Node.js | >= 20.19.0 | Frontend runtime and CLI | | Rust | Stable toolchain | Backend server | | pnpm | Latest | Package management | ### Required Tools 1. **Coding Agent Authentication** - Configure authentication for your preferred coding agent (Claude Code, Codex, Gemini CLI, etc.) 2. **Git** - Repository operations and worktree management 3. **Azure CLI** (optional) - For attachment upload functionality ## Repository Structure ``` vibe-kanban/ ├── packages/ │ ├── web-core/ # Core React hooks, stores, and components │ ├── ui/ # Shared UI components │ ├── remote-web/ # Web application pages │ └── public/ # Static assets ├── crates/ │ └── server/ # Rust backend server ├── npx-cli/ # CLI entry point └── scripts/ # Build and development scripts ``` 资料来源：[npx-cli/README.md:1-20](https://github.com/BloopAI/vibe-kanban/blob/main/npx-cli/README.md) ## Installation ### 1. Clone the Repository ```bash git clone https://github.com/BloopAI/vibe-kanban cd vibe-kanban ``` ### 2. Install Dependencies ```bash npm install -g pnpm pnpm install ``` ### 3. Build the CLI ```bash cd npx-cli pnpm build ``` The build script uses esbuild to bundle the TypeScript source: ```javascript // npx-cli/package.json { "scripts": { "build": "esbuild src/cli.ts --bundle --platform=node --target=node20 --format=cjs --outfile=bin/cli.js" } } ``` 资料来源：[npx-cli/package.json:8](https://github.com/BloopAI/vibe-kanban/blob/main/npx-cli/package.json) ## Development Workflow ### Running the Application ```bash npx vibe-kanban ``` This launches the application locally and opens it in your browser automatically. ### Available CLI Commands ```bash npx vibe-kanban --help npx vibe-kanban --version npx vibe-kanban review --help npx vibe-kanban mcp --help ``` 资料来源：[npx-cli/README.md:12-17](https://github.com/BloopAI/vibe-kanban/blob/main/npx-cli/README.md) ## Hotkeys Reference The application provides keyboard shortcuts for common actions: | Shortcut | Action | |----------|--------| | `v>p` | Toggle preview mode | | `v>s` | Toggle left sidebar | | `v>h` | Toggle left main panel | | `x>p` | Git create PR | | `x>m` | Git merge | | `x>r` | Git rebase | | `x>u` | Git push | | `y>p` | Copy workspace path | | `y>l` | Copy raw logs | | `t>d` | Toggle dev server | | `t>w` | Toggle wrap lines | | `r>s` | Run setup script | | `r>c` | Run cleanup script | 资料来源：[packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts) ## State Management The application uses Zustand stores for state management: ```mermaid graph TD A[UI Store] -->|paneSizes, collapsedPaths| B[useUiPreferencesStore] C[Workspace Store] -->|diff data| D[useWorkspaceDiffStore] E[Project Store] -->|organizations, projects| F[Remote Data] ``` ### Key Stores | Store | Purpose | Key State | |-------|---------|-----------| | `useUiPreferencesStore` | UI layout preferences | paneSizes, collapsedPaths, layoutMode | | `useWorkspaceDiffStore` | GitHub comments and diffs | comments, file changes | 资料来源：[packages/web-core/src/shared/stores/useUiPreferencesStore.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/stores/useUiPreferencesStore.ts) ## Attachment Handling File attachments use Azure Blob Storage for uploads: ```mermaid sequenceDiagram participant User participant UI as React Components participant API as confirmAttachmentUpload participant Azure as Azure Blob Storage User->>UI: Select file UI->>Azure: Upload file chunk Azure-->>UI: Upload progress (0-100%) UI->>API: Confirm upload API-->>UI: Return attachment ID ``` The attachment confirmation payload includes: ```typescript { project_id: string, upload_id: string, filename: string, content_type: string, size_bytes: number, hash: string, issue_id: string, comment_id: string } ``` 资料来源：[packages/web-core/src/shared/hooks/useAzureAttachments.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/hooks/useAzureAttachments.ts) ## Git Integration ### Worktree-Based Development Vibe Kanban creates isolated git worktrees for each task attempt, enabling: - Parallel development on multiple features - Clean separation between task branches - Easy diff viewing of agent changes ### Supported Git Operations | Operation | Shortcut | Description | |-----------|----------|-------------| | Create PR | `x>p` | Create pull request with AI-generated description | | Merge | `x>m` | Merge changes back to main | | Rebase | `x>r` | Rebase current branch | | Push | `x>u` | Push changes | | Force Push | Dialog | Force push with confirmation dialog | ## Backend Server (Rust) The backend server handles OAuth flows and API requests: ```rust // OAuth flow returns HTML response Response::builder() .status(StatusCode::OK) .header("content-type", "text/html; charset=utf-8") .body(body) ``` 资料来源：[crates/server/src/routes/oauth.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/server/src/routes/oauth.rs) ## Troubleshooting ### Common Setup Issues 1. **Node Version Mismatch** - Ensure Node.js >= 20.19.0 - Use `nvm use` or update Node installation 2. **CLI Not Found After Build** - Run `pnpm build` in the npx-cli directory - Ensure bin directory is in PATH 3. **Authentication Failures** - Verify coding agent authentication - Check GitHub CLI authentication with `gh auth status` ## Documentation For more information, visit: - [Official Documentation](https://vibekanban.com/docs) - [Self-Hosting Guide](https://vibekanban.com/docs/self-hosting/deploy-docker) - [Supported Coding Agents](https://vibekanban.com/docs/supported-coding-agents) - [GitHub Discussions](https://github.com/BloopAI/vibe-kanban/discussions) ## Contributing Ideas and changes should be raised via: 1. [GitHub Discussions](https://github.com/BloopAI/vibe-kanban/discussions) 2. [Discord](https://discord.gg/AC4nwVtJM3) 资料来源：[README.md:45-50](https://github.com/BloopAI/vibe-kanban/blob/main/README.md) --- ## Backend Architecture ### 相关页面 相关主题：[Crate Reference](#page-crate-reference), [Database and Data Models](#page-database-models), [Coding Agent Executors](#page-executors)
相关源码文件 以下源码文件用于生成本页说明： - [crates/server/src/lib.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/server/src/lib.rs) - [crates/server/src/main.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/server/src/main.rs) - [crates/server/src/routes/mod.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/server/src/routes/mod.rs) - [crates/server/src/routes/oauth.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/server/src/routes/oauth.rs) - [crates/server/src/startup.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/server/src/startup.rs) - [crates/server/src/runtime/mod.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/server/src/runtime/mod.rs)
# Backend Architecture ## Overview Vibe Kanban's backend is built with Rust using the Axum web framework, providing a high-performance API server that handles workspace management, authentication, and integration with coding agents. The backend follows a modular architecture with clear separation between routing, runtime management, and core server functionality. The server component (`crates/server`) serves as the central hub for coordinating between the web frontend and various external services including GitHub integrations, coding agent executors, and development workspace environments. ## Architecture Components ### Core Server Structure The backend is organized into several key modules: | Module | Purpose | |--------|---------| | `main.rs` | Application entry point and initialization | | `lib.rs` | Library interface and shared exports | | `startup.rs` | Server bootstrap and configuration | | `routes/` | HTTP endpoint handlers | | `runtime/` | Agent runtime execution management | ### Module Hierarchy ```mermaid graph TD A[crates/server] --> B[main.rs] A --> C[lib.rs] A --> D[startup.rs] A --> E[routes/] A --> F[runtime/] E --> E1[oauth.rs] E --> E2[mod.rs] F --> F1[mod.rs] ``` ## Request Flow ```mermaid graph LR A[Client Request] --> B[Axum Router] B --> C[Route Handlers] C --> D[OAuth Routes] C --> E[API Routes] C --> F[Runtime Routes] D --> G[OAuth Callback] E --> H[JSON Response] F --> I[Agent Execution] ``` ## Routing System ### Route Organization The routing layer in `crates/server/src/routes/mod.rs` acts as a central router that aggregates all HTTP endpoints. Routes are organized by functional domain: - **OAuth Routes** (`routes/oauth.rs`) - Handle GitHub authentication and OAuth callbacks - **API Routes** - Handle workspace operations, task management, and agent interactions - **Runtime Routes** (`runtime/mod.rs`) - Manage coding agent execution contexts ### OAuth Implementation The OAuth route handler in `crates/server/src/routes/oauth.rs` demonstrates the server's response pattern for authentication flows: ```rust Response::builder() .status(StatusCode::OK) .header("content-type", "text/html; charset=utf-8") .body(body) .unwrap() ``` 资料来源：[crates/server/src/routes/oauth.rs:20-25]() The OAuth callback returns an HTML response with embedded base64-encoded app icon, displaying a success message and instructions to return to the application. ## Startup Sequence ```mermaid graph TD A[main.rs entry] --> B[Initialize Config] B --> C[Load Environment] C --> D[startup.rs::run] D --> E[Build Router] E --> F[Bind Socket] F --> G[Start Axum Server] G --> H[Listen for Requests] ``` The startup module (`crates/server/src/startup.rs`) handles: - Configuration loading from environment variables - Router construction with middleware - Socket binding and server initialization ## Runtime Management ### Agent Execution Model The runtime module (`crates/server/src/runtime/mod.rs`) manages the lifecycle of coding agent processes within workspaces. Each workspace provides an agent with: | Resource | Description | |----------|-------------| | Git Branch | Isolated branch for agent modifications | | Terminal | Shell access for command execution | | Dev Server | Preview environment for testing | 资料来源：[crates/server/src/runtime/mod.rs]() ### Process Tracking The backend tracks agent processes with metadata including: - `started_at` - Process initialization timestamp - `completed_at` - Process termination timestamp - `isRunning` - Active execution state - `filesChanged` - Modified file count - `linesAdded` / `linesRemoved` - Change statistics ## State Management ### Workspace States ```mermaid stateDiagram-v2 [*] --> Draft Draft --> Running: Start Agent Running --> Completed: Agent Finishes Running --> Error: Execution Failure Completed --> Archived: User Archives Error --> Running: Retry Archived --> [*] Draft --> [*]: Cancel ``` Workspaces maintain states including draft, running, completed, and archived, allowing users to manage multiple concurrent agent execution contexts. ## API Response Patterns The backend uses standard HTTP response patterns with JSON payloads: | Status Code | Usage | |-------------|-------| | 200 OK | Successful requests | | 400 Bad Request | Invalid input | | 401 Unauthorized | Authentication required | | 500 Internal Server Error | Server-side failures | ## Frontend Integration The web-core package (`packages/web-core/src/shared/`) interacts with the backend through: - **Dialog Components** - Modal interfaces for OAuth setup, force push, workspace selection - **Store Hooks** - State management via `useWorkspaceDiffStore`, `useUiPreferencesStore` - **API Hooks** - Data fetching through `useAzureAttachments` for file handling 资料来源：[crates/server/src/lib.rs]() 资料来源：[crates/web-core/src/shared/stores/useWorkspaceDiffStore.ts]() 资料来源：[crates/web-core/src/shared/hooks/useAzureAttachments.ts]() ## Configuration The server reads configuration from environment variables with sensible defaults for: - Server host and port - Database connection strings - OAuth client credentials - Agent executor profiles ## Dependencies Key Rust dependencies for the backend: | Crate | Version | Purpose | |-------|---------|---------| | axum | ^0.7 | Web framework | | tokio | ^1 | Async runtime | | serde | ^1 | Serialization | | tower | latest | Middleware | 资料来源：[crates/server/src/main.rs]() 资料来源：[crates/server/src/routes/mod.rs]() --- ## Frontend Architecture ### 相关页面 相关主题：[Crate Reference](#page-crate-reference), [Backend Architecture](#page-backend-architecture)
Relevant Source Files 以下源码文件用于生成本页说明： - [packages/local-web/src/routes/_app.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/local-web/src/routes/_app.tsx) - [packages/remote-web/src/app/entry/App.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/remote-web/src/app/entry/App.tsx) - [packages/web-core/src/shared/hooks/useActions.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/hooks/useActions.ts) - [packages/web-core/src/shared/providers/WorkspaceProvider.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/providers/WorkspaceProvider.tsx) - [packages/ui/src/components/KanbanBoard.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/ui/src/components/KanbanBoard.tsx) - [packages/ui/src/components/CommandBar.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/ui/src/components/CommandBar.tsx) - [packages/ui/src/components/WorkspacesSidebar.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/ui/src/components/WorkspacesSidebar.tsx) - [packages/web-core/src/shared/stores/useUiPreferencesStore.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/stores/useUiPreferencesStore.ts) - [packages/web-core/src/pages/kanban/KanbanIssuePanelContainer.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/pages/kanban/KanbanIssuePanelContainer.tsx) - [packages/web-core/src/shared/dialogs/command-bar/WorkspaceSelectionDialog.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/dialogs/command-bar/WorkspaceSelectionDialog.tsx)
# Frontend Architecture ## Overview Vibe Kanban implements a modern, component-driven frontend architecture designed for complex project management workflows involving AI coding agents. The frontend is organized as a monorepo using a layered package structure that separates concerns between UI primitives, business logic, and deployment variants. The architecture follows these core principles: - **Component Reusability**: Shared UI components across multiple deployment contexts - **State Centralization**: Global state management via Zustand stores - **Provider Pattern**: Context-based dependency injection for cross-cutting concerns - **Type Safety**: Full TypeScript coverage with strict typing ## Monorepo Structure The project uses a monorepo architecture with the following key packages: | Package | Purpose | |---------|---------| | `packages/ui` | Reusable UI component library (buttons, dialogs, command bar) | | `packages/web-core` | Business logic, hooks, stores, and shared features | | `packages/local-web` | Local deployment variant (runs entirely in browser) | | `packages/remote-web` | Remote deployment variant (connects to backend server) | | `npx-cli` | CLI wrapper for easy execution via `npx vibe-kanban` | ``` vibe-kanban/ ├── packages/ │ ├── ui/ # Shared UI primitives │ │ └── src/components/ │ │ ├── CommandBar.tsx │ │ ├── KanbanBoard.tsx │ │ └── WorkspacesSidebar.tsx │ ├── web-core/ # Core business logic │ │ └── src/ │ │ ├── shared/ │ │ │ ├── hooks/ # useActions, useAzureAttachments │ │ │ ├── providers/ # WorkspaceProvider │ │ │ ├── stores/ # Zustand state stores │ │ │ └── dialogs/ # Modal components │ │ └── pages/ │ ├── local-web/ # Local app entry point │ └── remote-web/ # Remote/server-connected variant └── npx-cli/ # CLI entry point ``` ## Application Entry Points ### Local Web Application The local web application serves as the standalone deployment variant that runs entirely in the browser without requiring a backend server. ```tsx // packages/local-web/src/routes/_app.tsx // Main entry point for local deployment ``` ### Remote Web Application The remote web application connects to a backend server for persistent storage and multi-user collaboration features. ```tsx // packages/remote-web/src/app/entry/App.tsx // Main entry point for remote deployment ``` ## State Management ### UI Preferences Store The application uses Zustand for centralized state management. The `useUiPreferencesStore` handles UI-specific state including sidebar visibility, panel sizes, and layout modes. ```typescript // packages/web-core/src/shared/stores/useUiPreferencesStore.ts interface UiPreferencesState { // Layout state layoutMode: 'workspaces' | 'kanban'; isLeftSidebarVisible: boolean; isRightSidebarVisible: boolean; isTerminalVisible: boolean; // Panel states per workspace workspacePanelStates: Record; // Pane configurations paneSizes: Record; collapsedPaths: Record; } ``` Key state transitions supported by the store: | Action | Description | |--------|-------------| | `toggleLayoutMode()` | Switch between workspaces and kanban views | | `toggleLeftSidebar()` | Show/hide left sidebar | | `toggleTerminal()` | Show/hide terminal panel | | `toggleWorkspacePanel(workspaceId, panel)` | Toggle specific workspace panel | 资料来源：[packages/web-core/src/shared/stores/useUiPreferencesStore.ts:1-50](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/stores/useUiPreferencesStore.ts) ### Workspace Provider The `WorkspaceProvider` is a React context provider that manages workspace-scoped state and operations. ```tsx // packages/web-core/src/shared/providers/WorkspaceProvider.tsx // Provides workspace context to child components ``` ## Core UI Components ### KanbanBoard The `KanbanBoard` component is the central UI element for task visualization and management. It renders the drag-and-drop interface for issues across different status columns. ```tsx // packages/ui/src/components/KanbanBoard.tsx ``` The board supports multiple item types rendered through consistent interface patterns: | Item Type | Identifier | Search Label Pattern | |-----------|------------|---------------------| | Page | `pageId` | `{pageId} {label}` | | Repository | `repo.id` | `{repo.id} {repo.display_name}` | | Branch | `branch.name` | `branch.name` | | Status | `status.id` | `{status.id} {status.name}` | | Priority | `priority.id` | `{priority.id ?? 'none'} {priority.name}` | | Issue | `issue.id` | `{issue.id} {issue.simple_id} {issue.title}` | 资料来源：[packages/ui/src/components/CommandBar.tsx:1-50](https://github.com/BloopAI/vibe-kanban/blob/main/packages/ui/src/components/CommandBar.tsx) ### CommandBar The `CommandBar` component provides a keyboard-driven interface for navigation and actions. It groups items by category and supports fuzzy search through labels. ```tsx // packages/ui/src/components/CommandBar.tsx ``` ### WorkspacesSidebar The `WorkspacesSidebar` displays workspace summaries with multiple layout modes: - **List Layout**: Flat vertical list with sections for active, archived, and needs-attention workspaces - **Accordion Layout**: Collapsible sections with header persistence ```tsx // packages/ui/src/components/WorkspacesSidebar.tsx ``` Workspace summaries display: - Workspace name and active state - Running status and pending approvals - Dev server status - PR status - Activity indicators (unseen activity flag) - Git statistics (files changed, lines added/removed) 资料来源：[packages/ui/src/components/WorkspacesSidebar.tsx:1-80](https://github.com/BloopAI/vibe-kanban/blob/main/packages/ui/src/components/WorkspacesSidebar.tsx) ## Dialog System ### Dialog Architecture The application uses a modal dialog system for complex interactions. Dialogs are defined using the `defineModal` higher-order function pattern. ```tsx // Example dialog pattern export const ForcePushDialog = defineModal( ForcePushDialogImpl ); ``` ### Dialog Types | Dialog | Purpose | Key Features | |--------|---------|--------------| | `ForcePushDialog` | Confirm destructive force-push operations | Loading state, destructive variant | | `ResolveConflictsDialog` | Handle git merge conflicts | Agent/profile selector, file list | | `WorkspaceSelectionDialog` | Link issues to workspaces | Workspace search, archive filtering | | `ReleaseNotesDialog` | Display changelog information | GitHub integration, markdown rendering | | `GhCliSetupDialog` | GitHub CLI authentication setup | Step-by-step instructions, error help | ### ResolveConflictsDialog Handles git merge conflicts by displaying conflicted files and providing agent selection for resolution. ```tsx // packages/web-core/src/shared/dialogs/tasks/ResolveConflictsDialog.tsx {conflictedFiles.slice(0, 5).map((file) => (
  • {file}
    • ))} {conflictedFiles.length > 5 && (
  • And {conflictedFiles.length - 5} more...
    • )} ``` The dialog includes: - Conflicted file list with truncation for large conflicts - Agent selector for AI-powered resolution - Config selector for resolution parameters - New session toggle for existing workspace sessions 资料来源：[packages/web-core/src/shared/dialogs/tasks/ResolveConflictsDialog.tsx:80-100](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/dialogs/tasks/ResolveConflictsDialog.tsx) ## Kanban Issue Panel The `KanbanIssuePanelContainer` renders detailed issue views with multiple collapsible sections: ```tsx // packages/web-core/src/pages/kanban/KanbanIssuePanelContainer.tsx } renderRelationshipsSection={(issueId) => } renderSubIssuesSection={(issueId) => } renderCommentsSection={(issueId) => } /> ``` ### Issue Panel Sections | Section | Container Component | Purpose | |---------|---------------------|---------| | Workspaces | `IssueWorkspacesSectionContainer` | Associated workspace links | | Relationships | `IssueRelationshipsSectionContainer` | Linked issues and parent-child relations | | Sub-Issues | `IssueSubIssuesSectionContainer` | Child issues breakdown | | Comments | `IssueCommentsSectionContainer` | Discussion and review comments | ## Hooks System ### useActions Hook Custom hooks encapsulate business logic and provide clean interfaces for components. ```tsx // packages/web-core/src/shared/hooks/useActions.ts // Centralizes action dispatching and state updates ``` ### useAzureAttachments Hook Handles file upload workflows with progress tracking: ```typescript // packages/web-core/src/shared/hooks/useAzureAttachments.ts // Progress tracking for uploads setPendingAttachments((prev) => prev.map((p) => p.file === file ? { ...p, status: 'confirming', progress: 100 } : p )) ); ``` The hook manages: - Pending attachment states - Upload progress tracking - Confirmation workflows - Completed attachment tracking ## Component Interaction Flow ```mermaid graph TD A[App Entry Point] --> B[WorkspaceProvider] A --> C[UiPreferencesStore] B --> D[KanbanBoard] B --> E[WorkspacesSidebar] D --> F[KanbanIssuePanelContainer] F --> G[Dialog System] E --> H[CommandBar] G --> I[ForcePushDialog] G --> J[ResolveConflictsDialog] G --> K[WorkspaceSelectionDialog] C --> L[Layout Toggle] C --> M[Sidebar Visibility] C --> N[Terminal Toggle] style A fill:#e1f5fe style B fill:#fff3e0 style C fill:#e8f5e9 ``` ## Home Page Structure The remote web application provides a structured home page with organization and project navigation: ```tsx // packages/remote-web/src/pages/HomePage.tsx function OrganizationSection({ organization, projects, hostId, onRequireHost }) { return (

    {organization.name}

    {projects.length} {projects.length === 1 ? "project" : "projects"}

      {projects.map((project) => )}
    ); } ``` ## Deployment Variants The application supports two deployment modes: ```mermaid graph LR subgraph Local["Local Deployment"] L1[local-web package] L2[Browser-only execution] L3[No server required] end subgraph Remote["Remote Deployment"] R1[remote-web package] R2[Backend server connection] R3[Multi-user support] end style Local fill:#bbdefb style Remote fill:#c8e6c9 ``` ### Local Web - Runs entirely in the browser - No backend server required - Single-user mode - Data stored in browser storage ### Remote Web - Requires backend server (`crates/server`) - Multi-user support via OAuth authentication - Persistent storage in database - Real-time collaboration features ## Technology Stack | Layer | Technology | Purpose | |-------|------------|---------| | Framework | React 18+ | UI rendering | | Language | TypeScript | Type safety | | State | Zustand | Lightweight state management | | Styling | Tailwind CSS | Utility-first styling | | Build | Vite + esbuild | Fast builds | | Routing | React Router | SPA navigation | | i18n | react-i18next | Internationalization | | Icons | Lucide React | Icon library | ## Key Architectural Patterns ### 1. Provider Pattern Cross-cutting concerns are injected via React context providers: ```tsx // Workspace context available throughout the component tree ``` ### 2. Store Pattern Zustand stores provide centralized, typed state with simple update functions: ```typescript // Simple store usage const { layoutMode, toggleLayoutMode } = useUiPreferencesStore(); ``` ### 3. Modal Definition Pattern Dialogs use a higher-order function for consistent modal lifecycle management: ```tsx export const SomeDialog = defineModal(Component); ``` ### 4. Lazy Loading Components support dynamic imports for code splitting: ```tsx // Dialogs loaded on demand to reduce initial bundle size const SomeDialog = lazy(() => import('./dialogs/SomeDialog')); --- ## Crate Reference ### 相关页面 相关主题：[Backend Architecture](#page-backend-architecture), [Coding Agent Executors](#page-executors), [Relay and Remote Access](#page-relay-remote-access)
    相关源码文件 以下源码文件用于生成本页说明： - [crates/server/src/routes/oauth.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/server/src/routes/oauth.rs) - [README.md](https://github.com/BloopAI/vibe-kanban/blob/main/README.md)
    # Crate Reference ## Overview Vibe Kanban is a monorepo with a multi-package architecture that combines Rust-based backend services (crates) with TypeScript/React frontend packages. The backend crates provide core infrastructure for workspace management, code execution, database operations, and secure communication. The project structure includes: - **Frontend packages** (`packages/`): React-based UI including `web-core`, `ui`, and `remote-web` - **Rust crates** (`crates/`): Backend services for server operations, API types, database, executors, MCP protocol, relay tunneling, workspace management, and worktree management ## Crate Architecture The Rust backend consists of several specialized crates that work together to provide the core functionality of Vibe Kanban: | Crate | Purpose | |-------|---------| | `server` | Main HTTP server with route handlers | | `api-types` | Shared type definitions for API communication | | `db` | Database operations and models | | `executors` | Code execution engine for coding agents | | `relay-tunnel` | Secure relay communication | | `mcp` | Model Context Protocol integration | | `workspace-manager` | Workspace lifecycle management | | `worktree-manager` | Git worktree operations | ## Server Crate The `server` crate (`crates/server/src/`) is the main entry point for the backend application. It handles HTTP routing and serves both the API endpoints and static assets. ### OAuth Routes The server provides OAuth authentication flow endpoints for GitHub integration: **File:** `crates/server/src/routes/oauth.rs` The OAuth handler returns an HTML page confirming successful authentication: ```rust Response::builder() .status(StatusCode::OK) .header("content-type", "text/html; charset=utf-8") .body(body) .unwrap() ``` The response includes: - Application logo embedded as base64 PNG - Success message display - User instruction to close the tab and return to the app ## Project Organization ### Monorepo Structure ``` vibe-kanban/ ├── packages/ │ ├── web-core/ # Core web UI components │ ├── ui/ # Shared UI components │ └── remote-web/ # Remote access web interface ├── crates/ │ ├── server/ # HTTP server │ ├── api-types/ # API type definitions │ ├── db/ # Database layer │ ├── executors/ # Agent execution engine │ ├── relay-tunnel/ # Relay communication │ ├── mcp/ # MCP protocol │ ├── workspace-manager/ # Workspace operations │ └── worktree-manager/ # Git worktree management └── public/ # Static assets ``` ## Data Flow Architecture ```mermaid graph TD subgraph Frontend["Frontend (TypeScript/React)"] UI[UI Components] WC[Web Core] end subgraph Backend["Backend (Rust Crates)"] Server[Server Crate] DB[(Database)] API[API Types] end subgraph Execution["Execution Layer"] Exec[Executors] WM[Workspace Manager] WTM[Worktree Manager] MCP[MCP Protocol] RT[Relay Tunnel] end UI --> WC WC --> Server Server --> DB Server --> API Exec --> WM WM --> WTM Exec --> MCP Exec --> RT ``` ## Key Modules ### API Types The `api-types` crate provides shared type definitions used across the frontend and backend for type-safe API communication. ### Database Layer The `db` crate handles persistent storage operations, including: - Workspace state persistence - User preferences - Project and organization data ### Workspace Manager Manages the lifecycle of workspaces, including creation, archival, and state tracking. ### Worktree Manager Handles Git worktree operations, providing isolated branch environments for each workspace. ### Executors The execution engine that runs coding agents (Claude Code, Codex, Gemini CLI, etc.) within workspace environments. ### Relay Tunnel Provides secure communication channels for remote access scenarios. ### MCP Integration Implements the Model Context Protocol for enhanced agent capabilities. ## Configuration and Preferences The frontend manages user preferences through the `useUiPreferencesStore`, which handles: | Setting | Description | |---------|-------------| | `layoutMode` | Toggle between 'workspaces' and 'kanban' views | | `isLeftSidebarVisible` | Left sidebar visibility | | `isTerminalVisible` | Terminal panel visibility | | `paneSizes` | Customizable panel dimensions | | `collapsedPaths` | File tree collapsed state per workspace | | `fileSearchRepoId` | Active repository for file search | 资料来源：[packages/web-core/src/shared/stores/useUiPreferencesStore.ts]() ## Development Workflow The system supports the following developer keyboard shortcuts: | Shortcut | Action | |----------|--------| | `v>p` | Toggle preview mode | | `v>s` | Toggle left sidebar | | `v>h` | Toggle left main panel | | `x>p` | Create Git PR | | `x>m` | Merge PR | | `x>r` | Git rebase | | `x>u` | Git push | | `t>d` | Toggle dev server | | `t>w` | Toggle wrap lines | 资料来源：[packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts]() ## Summary The Vibe Kanban architecture combines TypeScript/React frontend packages with Rust backend crates to provide a comprehensive coding agent workspace management system. The Rust crates handle core infrastructure including database operations, workspace lifecycle, Git worktree management, code execution, and secure communication, while the frontend provides the user interface for planning, reviewing, and managing coding agent activities. For the latest updates and project status, refer to the official announcement at [vibekanban.com/blog/shutdown](https://vibekanban.com/blog/shutdown). --- ## Coding Agent Executors ### 相关页面 相关主题：[Crate Reference](#page-crate-reference), [MCP Server Integration](#page-mcp-integration)
    相关源码文件 以下源码文件用于生成本页说明： - [README.md](https://github.com/BloopAI/vibe-kanban/blob/main/README.md) - [packages/web-core/src/features/workspace-chat/ui/SessionChatBoxContainer.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/features/workspace-chat/ui/SessionChatBoxContainer.tsx) - [packages/web-core/src/features/workspace-chat/ui/ConversationListContainer.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/features/workspace-chat/ui/ConversationListContainer.tsx) - [packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts) - [packages/web-core/src/shared/dialogs/command-bar/WorkspaceSelectionDialog.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/dialogs/command-bar/WorkspaceSelectionDialog.tsx) - [packages/web-core/src/shared/components/tasks/TaskDetails/ProcessesTab.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/components/tasks/TaskDetails/ProcessesTab.tsx)
    # Coding Agent Executors ## Overview Coding Agent Executors in Vibe Kanban are the runtime engines that enable AI coding agents to execute tasks within isolated workspace environments. Each workspace provides an agent with a dedicated branch, terminal, and dev server, allowing software engineers to plan work through kanban issues while agents perform the actual coding tasks. The executor system supports multiple AI coding agents, enabling teams to choose the most appropriate agent for their specific needs or switch between agents based on task requirements. 资料来源：[README.md:1-20]() ## Supported Agents Vibe Kanban supports the following coding agents: | Agent | Description | |-------|-------------| | Claude Code | Anthropic's CLI tool for Claude models | | Codex | OpenAI's coding agent | | Gemini CLI | Google's Gemini-based CLI agent | | GitHub Copilot | Microsoft's AI pair programmer | | Amp | Alternative coding agent | | Cursor | Cursor IDE's AI agent | | OpenCode | Open-source coding agent | | Droid | Mobile-optimized coding agent | | CCR | Custom coding agent configuration | | Qwen Code | Alibaba's Qwen-based coding agent | 资料来源：[README.md:25]() ## Architecture ### Executor Components The executor system consists of several key components: 1. **Session Chat Box** - The primary interface for interacting with coding agents during task execution 2. **Conversation List** - Displays the ongoing conversation and output between the agent and user 3. **Process Management** - Handles the lifecycle of agent processes including start, execution, and completion 4. **Workspace Integration** - Provides isolated environments with git branches, terminals, and dev servers ```mermaid graph TD A[Kanban Issue] --> B[Workspace Creation] B --> C[Session Chat Box] C --> D[Agent Executor] D --> E[Conversation List] D --> F[Process Execution] F --> G[Branch & Terminal] F --> H[Dev Server] E --> I[Diff Review] I --> J[Inline Comments] J --> K[Pull Request] ``` 资料来源：[packages/web-core/src/features/workspace-chat/ui/SessionChatBoxContainer.tsx:1-50]() ## Session Chat Box The `SessionChatBox` component is the central hub for agent interaction. It manages the chat interface, editor input, and session state. ### Key Properties | Property | Type | Purpose | |----------|------|---------| | `status` | `idle` \| `running` \| `completed` | Current execution state | | `repoIds` | `string[]` | Associated repository identifiers | | `tokenUsageInfo` | `TokenUsageInfo` | Usage tracking for billing | | `formatExecutorLabel` | `Function` | Formats agent display names | | `formatSessionDate` | `Function` | Formats session timestamps | | `renderAgentIcon` | `Function` | Renders agent-specific icons | ### Session State Management ```typescript session={{ sessions: [], selectedSessionId: undefined, onSelectSession: () => {}, isNewSessionMode: false, onNewSession: undefined, }} ``` The session object tracks the active conversation context, allowing users to switch between multiple agent sessions within a workspace. 资料来源：[packages/web-core/src/features/workspace-chat/ui/SessionChatBoxContainer.tsx:60-100]() ## Conversation Display The `ConversationList` component renders the ongoing interaction with the coding agent. ### Entry Types | Entry Type | Rendering Component | |------------|---------------------| | `STDOUT` | Standard output paragraphs | | `STDERR` | Error output paragraphs | | `NORMALIZED_ENTRY` | Full display with expansion support | | `THINKING` | Aggregated thinking blocks | ```mermaid graph LR A[Agent Output] --> B{Entry Type?} B -->|STDOUT| C[Paragraph Display] B -->|STDERR| D[Error Display] B -->|NORMALIZED| E[DisplayConversationEntry] B -->|THINKING| F[Aggregated Thinking] ``` 资料来源：[packages/web-core/src/features/workspace-chat/ui/ConversationListContainer.tsx:40-70]() ## Process Execution The `ProcessesTab` component provides visibility into running and completed agent processes. ### Process Information Displayed - **Process Status** - Current state (running, completed, failed) - **Started At** - Process initiation timestamp - **Completed At** - Process completion timestamp (when applicable) - **Log Output** - Real-time and archived process logs ### Log Management The ProcessesTab includes functionality to copy logs to clipboard for debugging and audit purposes: ```typescript const handleCopyLogs = () => { // Copies all accumulated logs to clipboard // Updates UI to show "Logs copied" confirmation }; ``` 资料来源：[packages/web-core/src/shared/components/tasks/TaskDetails/ProcessesTab.tsx:1-80]() ## Workspace Shortcuts Agent-related operations can be triggered via keyboard shortcuts defined in `useWorkspaceShortcuts`: | Shortcut | Action | |----------|--------| | `v>d` | Toggle DevTools | | `v>p` | Toggle Preview Mode | | `v>s` | Toggle Left Sidebar | | `v>h` | Toggle Left Main Panel | | `x>p` | Git Create PR | | `x>m` | Git Merge | | `x>r` | Git Rebase | | `x>u` | Git Push | | `r>s` | Run Setup Script | | `r>c` | Run Cleanup Script | 资料来源：[packages/web-core/src/shared/keyboard/useWorkspaceShortcuts.ts:1-30]() ## Workspace Selection When linking an issue to a workspace, users can select from available workspaces or create new ones: ```typescript interface Workspace { id: string; name: string; branch: string; isArchived: boolean; filesChanged: number; linesAdded: number; linesRemoved: number; isRunning: boolean; isPinned: boolean; hasPendingApproval: boolean; hasRunningDevServer: boolean; hasUnseenActivity: boolean; latestProcessCompletedAt: Date | null; latestProcessStatus: string | null; prStatus: string | null; } ``` 资料来源：[packages/web-core/src/shared/dialogs/command-bar/WorkspaceSelectionDialog.tsx:50-90]() ## Executor Profile Configuration Each executor can be configured with specific profiles that define: - **Model Selection** - Which AI model to use (e.g., Claude 3.5 Sonnet, GPT-4) - **System Prompt** - Custom instructions for the agent - **Temperature** - Response randomness setting - **Max Tokens** - Response length limits Profiles are stored in `default_profiles.json` and can be selected per-workspace or globally. ## Workflow Summary ```mermaid graph TD A[Create Kanban Issue] --> B[Open/Create Workspace] B --> C[Select Agent & Profile] C --> D[Start Agent Session] D --> E[Agent Reads Issue Context] E --> F[Agent Executes Tasks] F --> G[Changes Applied to Branch] G --> H[Review Diff in UI] H --> I{Changes Approved?} I -->|Yes| J[Create Pull Request] I -->|No| K[Send Feedback to Agent] K --> F J --> L[Merge PR] ``` ## Related Components | Component | File Path | Role | |-----------|-----------|------| | `SessionChatBoxContainer` | `packages/web-core/src/features/workspace-chat/ui/` | Main agent interaction UI | | `ConversationListContainer` | `packages/web-core/src/features/workspace-chat/ui/` | Conversation message display | | `ProcessesTab` | `packages/web-core/src/shared/components/tasks/TaskDetails/` | Process monitoring | | `WorkspaceSelectionDialog` | `packages/web-core/src/shared/dialogs/command-bar/` | Workspace linking | | `useWorkspaceShortcuts` | `packages/web-core/src/shared/keyboard/` | Keyboard navigation | --- ## MCP Server Integration ### 相关页面 相关主题：[Coding Agent Executors](#page-executors), [Database and Data Models](#page-database-models) The requested MCP-related source files were not included in the provided context. The `
    ` block references these files: - `crates/mcp/src/lib.rs` - `crates/mcp/src/task_server/mod.rs` - `crates/mcp/src/task_server/handler.rs` - `crates/mcp/src/task_server/tools/mod.rs` - `crates/executors/src/mcp_config.rs` - `crates/executors/default_mcp.json` However, **none of these files appear in the retrieved context**. The context only contains files from `packages/web-core`, `packages/ui`, `packages/remote-web`, and `crates/server`. **What I can see from the available context:** The repository is a **TypeScript/JavaScript monorepo** with these visible packages: | Package | Path | Purpose | |---------|------|---------| | `web-core` | `packages/web-core/src/` | Core UI components, dialogs, stores, hooks | | `ui` | `packages/ui/src/` | Shared UI components (CommandBar, WorkspacesSidebar) | | `remote-web` | `packages/remote-web/src/` | HomePage, organization/project views | | `server` | `crates/server/src/` | Rust backend with OAuth routes | The visible files show a **Kanban workspace management system** with: - Git integration dialogs (ForcePushDialog, ResolveConflictsDialog) - Command bar interface - Organization and project management - Process list handling - Workspace diff/comment tracking - Keyboard shortcuts for workspace operations **To generate the MCP Server Integration wiki page**, please provide the actual MCP-related source files from the `crates/mcp/` directory. --- ## Relay and Remote Access ### 相关页面 相关主题：[Crate Reference](#page-crate-reference), [Deployment and Infrastructure](#page-deployment-infrastructure)
    相关源码文件 以下源码文件用于生成本页说明： - [crates/server/src/middleware/origin.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/server/src/middleware/origin.rs) - [packages/remote-web/src/app/layout/RemoteAppShell.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/remote-web/src/app/layout/RemoteAppShell.tsx) - [packages/web-core/src/shared/stores/useUiPreferencesStore.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/stores/useUiPreferencesStore.ts) - [packages/web-core/src/shared/hooks/useAzureAttachments.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/hooks/useAzureAttachments.ts) - [crates/server/src/error.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/server/src/error.rs)
    # Relay and Remote Access ## Overview The Relay and Remote Access system in Vibe Kanban enables secure, low-latency communication between local development environments and remote hosts. This system allows users to access their coding workspaces and development servers from anywhere while maintaining proper authentication and origin verification. The relay architecture consists of multiple layers: - **Relay Tunnel** - Handles encrypted tunneled connections - **Relay WebRTC** - Provides peer-to-peer communication channels - **Relay Hosts** - Manages the registry and lifecycle of remote hosts - **Relay Protocol** - Defines the communication protocol between clients and hosts - **Relay Client** - Implements the client-side connection logic ## Architecture ### System Components | Component | Purpose | Location | |-----------|---------|----------| | Relay Tunnel | Encrypted tunnel establishment | `crates/relay-tunnel/src/lib.rs` | | Relay WebRTC | Peer-to-peer communication | `crates/relay-webrtc/src/lib.rs` | | Relay Hosts | Host registry and management | `crates/relay-hosts/src/lib.rs` | | Relay Protocol | Communication protocol definition | `crates/relay-protocol/src/lib.rs` | | Relay Client | Client-side connection logic | `crates/relay-client/src/lib.rs` | | Origin Middleware | Request origin verification | `crates/server/src/middleware/origin.rs` | ### Connection Flow ```mermaid graph TD A[Client Browser] -->|HTTPS + Relay Header| B[Server Middleware] B -->|Verify Origin| C{Origin Valid?} C -->|Yes| D[Relay Host Lookup] C -->|No| E[403 Forbidden Response] D -->|Host Online| F[Establish WebSocket] D -->|Host Unpaired| G[Pairing Flow] F -->|Tunnel Established| H[Remote Workspace Access] G -->|Paired Successfully| F ``` ## Origin Verification Middleware The server implements an `origin.rs` middleware that validates all incoming requests to ensure they originate from legitimate sources. ### Key Components **RELAY_HEADER Constant** The relay header (`x-vibe-relay`) identifies requests coming through the relay system. When present with value `"1"`, the request is flagged as a relay request. 资料来源：[crates/server/src/middleware/origin.rs:1-5]() **Header Retrieval Functions** | Function | Purpose | |----------|---------| | `get_host_header` | Extracts the `Host` header from a request | | `get_header` | Retrieves any specified header by name | | `is_relay_request` | Checks if request contains relay header | ```rust fn is_relay_request(req: &Request) -> bool { req.headers() .get(RELAY_HEADER) .and_then(|v| v.to_str().ok()) .is_some_and(|v| v.trim() == "1") } ``` 资料来源：[crates/server/src/middleware/origin.rs:15-21]() **Host Normalization** The `normalize_host` function standardizes host strings for consistent comparison: 1. Trims whitespace and IPv6 brackets 2. Converts to lowercase 3. Converts `localhost` aliases to `"localhost"` 4. Converts loopback IPs to `"localhost"` 5. Returns normalized IP or hostname ```rust fn normalize_host(host: &str) -> String { let trimmed = host.trim().trim_start_matches('[').trim_end_matches(']'); let lower = trimmed.to_ascii_lowercase(); if lower == "localhost" { return "localhost".to_string(); } if let Ok(ip) = lower.parse::() { if ip.is_loopback() { return "localhost".to_string(); } return ip.to_string(); } lower } ``` 资料来源：[crates/server/src/middleware/origin.rs:31-45]() **Origin Matching** The `origin_matches_host` function validates that the request origin corresponds to the host header: ```rust fn origin_matches_host(origin: &str, host: &str) -> bool { origin .strip_prefix("http://") .or_else(|| origin.strip_prefix("https://")) .is_some_and(|rest| rest.eq_ignore_ascii_case(host)) } ``` 资料来源：[crates/server/src/middleware/origin.rs:26-29]() ### Forbidden Response When origin verification fails, the middleware returns a `403 Forbidden` response: ```rust fn forbidden() -> Response { Response::builder() .status(StatusCode::FORBIDDEN) .body(Body::empty()) .unwrap_or_else(|_| Response::new(Body::empty())) } ``` 资料来源：[crates/server/src/middleware/origin.rs:23-25]() ## Remote Host Management ### Host Status Types | Status | Description | UI Behavior | |--------|-------------|-------------| | `online` | Host is connected and ready | Clickable, allows connection | | `unpaired` | Host exists but not authenticated | Clickable, triggers pairing | | Other | Host is offline or unavailable | Disabled, grayed out | The UI displays host status with visual indicators: ```tsx const isOnline = host.status === "online"; const isUnpaired = host.status === "unpaired"; const isClickable = isOnline || isUnpaired; ``` 资料来源：[packages/remote-web/src/app/layout/RemoteAppShell.tsx:1-50]() ### Host Display Hosts are rendered with status indicators using color coding: ```tsx { handleHostClick(host.id, host.status); setIsDrawerOpen(false); }} ``` 资料来源：[packages/remote-web/src/app/layout/RemoteAppShell.tsx:38-41]() ## Relay Pairing System ### Pairing Errors The error handling system maps various pairing errors to appropriate HTTP responses: | Error Type | HTTP Status | Condition | |------------|-------------|-----------| | Authentication Failed | `401 Unauthorized` | Invalid credentials | | Pairing Failed | `400 Bad Request` | General pairing issue | | Serialization Error | `502 Bad Gateway` | Store serialization failure | | Storage Error | `502 Bad Gateway` | Persistence failure | ```rust RelayPairingClientError::RemoteClient(ref inner) => { tracing::warn!(%inner, "Relay host pairing authentication failed"); ApiError::Unauthorized } RelayPairingClientError::Pairing(ref detail) => { tracing::warn!(%detail, "Relay host pairing failed"); ApiError::BadRequest(err.to_string()) } ``` 资料来源：[crates/server/src/error.rs:1-30]() ### Unconfigured Relay When the relay API is not configured, the system returns: ```rust from(_: RelayHostsNotConfigured) -> Self { ApiError::BadRequest("Remote relay API is not configured".to_string()) } ``` 资料来源：[crates/server/src/error.rs:45-48]() ## Attachment Upload via Relay The relay system also handles file attachments when working remotely. The upload process involves: 1. Initialize upload with Azure blob storage 2. Upload chunks with progress tracking 3. Confirm upload completion ```typescript const result = await confirmAttachmentUpload({ project_id: projectId, upload_id: initResult.upload_id, filename: file.name, content_type: file.type, size_bytes: file.size, hash, issue_id: issueIdRef.current, comment_id: commentIdRef.current, }); ``` 资料来源：[packages/web-core/src/shared/hooks/useAzureAttachments.ts:1-50]() ## Workspace Panel States The relay system integrates with the workspace panel state management: ```typescript toggleLeftMainPanel: (workspaceId) => { if (!workspaceId) return; const state = get(); const wsState = state.workspacePanelStates[workspaceId] ?? DEFAULT_WORKSPACE_PANEL_STATE; if (wsState.isLeftMainPanelVisible && wsState.rightMainPanelMode === null) return; set({ workspacePanelStates: { ...state.workspacePanelStates, [workspaceId]: { ...wsState, isLeftMainPanelVisible: !wsState.isLeftMainPanelVisible, }, }, }); }, ``` 资料来源：[packages/web-core/src/shared/stores/useUiPreferencesStore.ts:1-40]() ## Security Considerations ### CORS and Origin Validation All relay requests undergo strict origin validation: 1. Requests must include a valid `Origin` header 2. The origin must match the `Host` header (with protocol prefix stripped) 3. Relay requests are identified via the `x-vibe-relay` header 4. Loopback addresses and `localhost` are normalized for consistent comparison ### Authentication Flow ```mermaid sequenceDiagram participant C as Client participant S as Server participant R as Relay Host C->>S: Request with x-vibe-relay: 1 S->>S: Validate Origin matches Host alt Valid Request S->>R: Relay connection R-->>C: Authenticated tunnel else Invalid Origin S-->>C: 403 Forbidden end ``` ## Configuration ### Environment Variables | Variable | Purpose | |----------|---------| | `RELAY_API_URL` | Base URL for relay API | | `RELAY_API_KEY` | Authentication key for relay | | `ALLOWED_ORIGINS` | Comma-separated list of allowed origins | ### Default Port Resolution The system includes logic for determining default ports based on HTTPS configuration: ```rust fn default_port(https: bool) ``` 资料来源：[crates/server/src/middleware/origin.rs:50]() ## Troubleshooting ### Common Issues | Issue | Cause | Resolution | |-------|-------|------------| | 403 Forbidden on relay requests | Origin mismatch | Check `Origin` and `Host` headers | | Host shows as "offline" | Network connectivity | Verify host is running and connected | | Pairing fails | Authentication error | Re-authenticate the relay host | | Slow connection | High latency | Check network conditions, consider WebRTC fallback | ### Diagnostic Steps 1. Verify the `x-vibe-relay` header is present in requests 2. Check server logs for relay-related warnings and errors 3. Confirm host status in the Remote App Shell UI 4. Validate origin normalization with `normalize_host()` function --- ## Database and Data Models ### 相关页面 相关主题：[Backend Architecture](#page-backend-architecture), [Key Concepts](#page-key-concepts)
    相关源码文件 以下源码文件用于生成本页说明： - [crates/db/src/lib.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/lib.rs) - [crates/db/src/models/mod.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/models/mod.rs) - [crates/db/src/models/workspace.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/models/workspace.rs) - [crates/db/src/models/session.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/models/session.rs) - [crates/db/src/models/task.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/models/task.rs) - [crates/db/src/models/project.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/models/project.rs) - [crates/db/src/models/repo.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/models/repo.rs) - [crates/api-types/src/lib.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/api-types/src/lib.rs)
    # Database and Data Models ## Overview Vibe Kanban uses a Rust-based database layer (`crates/db`) for persistent storage, with shared API types defined in `crates/api-types`. The architecture separates concerns between the database implementation, business logic, and the web frontend, enabling type-safe data flow across the application. ## Architecture Overview ```mermaid graph TD A[Web Frontend
    packages/web-core] --> B[API Types
    crates/api-types] C[Remote Web
    packages/remote-web] --> B B --> D[Database Layer
    crates/db] D --> E[(SQLite
    Database)] F[Server
    crates/server] --> D ``` ## Core Data Models ### Workspace Model The workspace model represents a coding agent execution environment. Each workspace is associated with a specific branch, terminal session, and dev server configuration. | Field | Type | Description | |-------|------|-------------| | `id` | UUID | Unique identifier for the workspace | | `name` | String | Display name of the workspace | | `project_id` | UUID | Associated project reference | | `branch_name` | String | Git branch name | | `is_running` | Boolean | Whether the agent is currently executing | | `is_pinned` | Boolean | Whether the workspace is pinned | | `has_pending_approval` | Boolean | Indicates pending approval state | | `has_running_dev_server` | Boolean | Whether dev server is active | | `has_unseen_activity` | Boolean | New activity since last view | | `files_changed` | Integer | Count of modified files | | `lines_added` | Integer | Lines of code added | | `lines_removed` | Integer | Lines of code removed | | `latest_process_completed_at` | Timestamp | Last process completion time | | `latest_process_status` | Enum | Current process status | 资料来源：[crates/db/src/models/workspace.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/models/workspace.rs) ### Session Model Sessions represent individual coding agent execution runs within a workspace. | Field | Type | Description | |-------|------|-------------| | `id` | UUID | Unique session identifier | | `workspace_id` | UUID | Parent workspace reference | | `started_at` | Timestamp | Session start time | | `completed_at` | Timestamp | Session end time (nullable) | | `status` | Enum | Session state (running, completed, failed) | 资料来源：[crates/db/src/models/session.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/models/session.rs) ### Task Model Tasks (issues) are the fundamental unit of work in the kanban system. | Field | Type | Description | |-------|------|-------------| | `id` | UUID | Unique task identifier | | `simple_id` | String | Human-readable ID (e.g., "PROJ-123") | | `title` | String | Task title | | `description` | Text | Detailed description | | `status_id` | UUID | Current status column | | `priority_id` | UUID | Priority level | | `assignee_id` | UUID | Assigned user (nullable) | | `project_id` | UUID | Parent project | | `created_at` | Timestamp | Creation time | | `updated_at` | Timestamp | Last modification time | 资料来源：[crates/db/src/models/task.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/models/task.rs) ### Project Model Projects organize tasks and workspaces into logical units. | Field | Type | Description | |-------|------|-------------| | `id` | UUID | Unique project identifier | | `name` | String | Project name | | `color` | String | Display color (hex format) | | `organization_id` | UUID | Parent organization | | `created_at` | Timestamp | Creation time | | `updated_at` | Timestamp | Last modification time | 资料来源：[crates/db/src/models/project.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/models/project.rs) ### Repository Model Repository configurations link external Git repositories to the system. | Field | Type | Description | |-------|------|-------------| | `id` | UUID | Unique repository identifier | | `display_name` | String | Repository display name | | `clone_url` | String | Git clone URL | | `default_branch` | String | Primary branch name | | `is_current` | Boolean | Currently checked out | 资料来源：[crates/db/src/models/repo.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/models/repo.rs) ## API Types System The `crates/api-types` crate defines shared TypeScript types used across the frontend packages. These types ensure type safety between the server and client applications. ### Key Type Exports The API types module re-exports types from the database models and extends them with frontend-specific metadata: ```typescript // Shared type definitions for workspace state interface WorkspaceState { workspaceId: string; branchName: string; filesChanged: number; linesAdded: number; linesRemoved: number; isRunning: boolean; isPinned: boolean; hasPendingApproval: boolean; hasRunningDevServer: boolean; hasUnseenActivity: boolean; latestProcessCompletedAt: string | null; latestProcessStatus: ProcessStatus; prStatus: PRStatus | null; } ``` 资料来源：[crates/api-types/src/lib.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/api-types/src/lib.rs) ## State Management Integration ### Workspace Diff Store The frontend uses Zustand stores to manage client-side state that syncs with the database models. ```typescript // From packages/web-core/src/shared/stores/useWorkspaceDiffStore.ts export const useGetGitHubCommentCountForFile = () => useWorkspaceDiffStore((s) => s.getGitHubCommentCountForFile); export const useGetFilesWithGitHubComments = () => useWorkspaceDiffStore((s) => s.getFilesWithGitHubComments); ``` ### UI Preferences Store User interface preferences are persisted and managed through a dedicated store: | Preference | Type | Description | |------------|------|-------------| | `layoutMode` | 'workspaces' \| 'kanban' | Active layout view | | `isLeftSidebarVisible` | Boolean | Left sidebar visibility | | `isRightSidebarVisible` | Boolean | Right sidebar visibility | | `isTerminalVisible` | Boolean | Terminal panel visibility | | `paneSizes` | Record | Customizable panel dimensions | | `collapsedPaths` | Record | Expanded/collapsed tree states | 资料来源：[packages/web-core/src/shared/stores/useUiPreferencesStore.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/stores/useUiPreferencesStore.ts) ## Data Flow Architecture ```mermaid graph LR A[User Action] --> B[React Component] B --> C[Zustand Store] C --> D[API Client] D --> E[Rust Server
    crates/server] E --> F[Database Layer
    crates/db] F --> G[(SQLite)] G --> F F --> E E --> D D --> C C --> B ``` ## Relationships Between Models ```mermaid erDiagram PROJECT ||--o{ TASK : contains PROJECT ||--o{ WORKSPACE : contains PROJECT ||--o{ REPO : links TASK ||--o{ SESSION : executes WORKSPACE ||--o{ SESSION : contains REPO ||--o{ WORKSPACE : checked_out ``` ## Database Module Structure The database crate (`crates/db`) is organized into the following modules: | Module | Purpose | |--------|---------| | `lib.rs` | Main entry point, exports all models and database operations | | `models/mod.rs` | Model aggregation and re-exports | | `models/workspace.rs` | Workspace entity definition | | `models/session.rs` | Session entity definition | | `models/task.rs` | Task/Issue entity definition | | `models/project.rs` | Project entity definition | | `models/repo.rs` | Repository entity definition | 资料来源：[crates/db/src/lib.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/lib.rs), [crates/db/src/models/mod.rs](https://github.com/BloopAI/vibe-kanban/blob/main/crates/db/src/models/mod.rs) ## Attachment Management The system supports file attachments associated with tasks and comments: | Attachment Field | Type | Description | |------------------|------|-------------| | `id` | UUID | Unique attachment identifier | | `filename` | String | Original filename | | `blob_id` | String | Storage reference | | `upload_progress` | Integer | Upload percentage (0-100) | | `pending_status` | Enum | confirming, uploaded, failed | | `content_type` | String | MIME type | | `size_bytes` | Integer | File size | 资料来源：[packages/web-core/src/shared/hooks/useAzureAttachments.ts](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/hooks/useAzureAttachments.ts) ## Process Tracking The system tracks coding agent processes with the following states: | Status | Description | |--------|-------------| | `started` | Process initiated | | `running` | Currently executing | | `completed` | Successfully finished | | `failed` | Execution error | | `cancelled` | User terminated | 资料来源：[packages/web-core/src/shared/components/tasks/TaskDetails/ProcessesTab.tsx](https://github.com/BloopAI/vibe-kanban/blob/main/packages/web-core/src/shared/components/tasks/TaskDetails/ProcessesTab.tsx) ## Summary The Vibe Kanban database layer provides a type-safe, Rust-based persistence system with clear separation between: 1. **Core Entities**: Workspace, Session, Task, Project, and Repository models define the data structure 2. **API Types**: Shared TypeScript types ensure consistency across frontend packages 3. **State Management**: Zustand stores provide reactive client-side state synchronized with server data 4. **Relationships**: Well-defined foreign key relationships enable complex queries and data navigation This architecture enables the application to manage coding agent workflows efficiently while maintaining data integrity and type safety throughout the stack. --- ## Deployment and Infrastructure ### 相关页面 相关主题：[Relay and Remote Access](#page-relay-remote-access), [Development Setup](#page-development-setup)
    Related Source Files 以下源码文件用于生成本页说明： - [Dockerfile](https://github.com/BloopAI/vibe-kanban/blob/main/Dockerfile) - [Caddyfile.example](https://github.com/BloopAI/vibe-kanban/blob/main/Caddyfile.example) - [crates/remote/Dockerfile](https://github.com/BloopAI/vibe-kanban/blob/main/crates/remote/Dockerfile) - [crates/relay-tunnel/Dockerfile](https://github.com/BloopAI/vibe-kanban/blob/main/crates/relay-tunnel/Dockerfile) - [docs/self-hosting/deploy-docker.mdx](https://github.com/BloopAI/vibe-kanban/blob/main/docs/self-hosting/deploy-docker.mdx) - [docs/self-hosting/local-development.mdx](https://github.com/BloopAI/vibe-kanban/blob/main/docs/self-hosting/local-development.mdx)
    # Deployment and Infrastructure ## Overview Vibe Kanban provides flexible deployment options ranging from local development to production-grade Docker-based self-hosting. The infrastructure supports both single-machine deployments and distributed architectures with optional relay tunneling for remote access. 资料来源：[README.md:1-60]() The project uses a monorepo structure with the following key deployment components: | Component | Technology | Purpose | |-----------|------------|---------| | Web UI | React/TypeScript | Frontend application | | API Server | Rust (Axum) | Backend REST API | | Database | PostgreSQL | Primary data store | | Relay Tunnel | Rust | Secure remote access | | TLS Termination | Caddy | HTTPS reverse proxy | ## Architecture Overview Vibe Kanban's deployment architecture consists of multiple Docker containers orchestrated via Docker Compose. The system supports three deployment profiles: default, relay, and attachments. ```mermaid graph TD User([User Browser]) --> Caddy[Caddy Reverse Proxy] Caddy --> RemoteWeb[remote-web:3001] Caddy --> RemoteServer[remote-server:3000] RemoteServer --> Electric[(Electric SQL
    PostgreSQL)] RemoteServer --> Azurite[(Azurite
    Blob Storage)] RemoteWeb -->|WebSocket| RelayTunnel[relay-tunnel:8082] User -->|Secure Tunnel| RelayTunnel subgraph Docker Network Caddy RemoteWeb RemoteServer Electric Azurite RelayTunnel end ``` ### Component Responsibilities | Service | Port | Description | |---------|------|-------------| | `remote-web` | 3001 | Remote web UI and API gateway | | `remote-server` | 3000 | Core API server with business logic | | `electric` | 5433 | PostgreSQL with Electric SQL sync | | `relay-tunnel` | 8082 | WebSocket relay for remote access | | `azurite` | 10000 | Local Azure Blob Storage emulator | ## Docker Deployment ### Prerequisites - Docker Engine 24.0+ - Docker Compose v2.20+ - Minimum 4GB RAM available - 10GB disk space ### Quick Start Clone the repository and navigate to the remote deployment directory: ```bash cd crates/remote docker compose --env-file .env.remote up --build ``` This starts the default stack with web UI, API server, and database. ### Starting the Development Stack From the repository root: ```bash pnpm run remote:dev ``` For full stack with relay and local attachment storage: ```bash pnpm run remote:dev:full ``` Equivalent manual command: ```bash cd crates/remote docker compose --env-file .env.remote --profile relay --profile attachments up --build ``` 资料来源：[crates/remote/README.md:45-70]() ## Environment Configuration ### Required Environment Variables | Variable | Description | Example | |----------|-------------|---------| | `DATABASE_URL` | PostgreSQL connection string | `postgres://remote:remote@localhost:5433/remote` | | `JWT_SECRET` | Secret for JWT token signing | Base64 encoded 48-byte string | | `VK_SHARED_API_BASE` | Internal API base URL | `http://localhost:3000` | | `VK_SHARED_RELAY_API_BASE` | Relay API base URL | `http://relay.localhost:3001` | ### Generating JWT Secret Generate a secure JWT secret using OpenSSL: ```bash openssl rand -base64 48 ``` ### OAuth Configuration Configure OAuth callback URLs for external authentication: | Provider | Callback URL | |----------|--------------| | GitHub | `https://localhost:3001/v1/oauth/github/callback` | | Google | `https://localhost:3001/v1/oauth/google/callback` | 资料来源：[crates/remote/README.md:1-50]() ## Docker Compose Profiles Vibe Kanban uses Docker Compose profiles to enable optional components: ### Default Profile Starts core infrastructure only: ```bash cd crates/remote docker compose --env-file .env.remote up --build ``` Services started: - `remote-db` (PostgreSQL via Electric SQL) - `remote-server` - `remote-web` ### Relay Profile Enables remote access via WebSocket tunnel: ```bash cd crates/remote docker compose --env-file .env.remote --profile relay up --build ``` Additional service: - `relay-tunnel` on port 8082 ### Attachments Profile Enables local file storage using Azurite: ```bash cd crates/remote docker compose --env-file .env.remote --profile attachments up --build ``` Additional service: - `azurite` on ports 10000/10001/10002 ### Combined Profiles Enable both relay and attachments: ```bash cd crates/remote docker compose --env-file .env.remote --profile relay --profile attachments up --build ``` ## Local HTTPS with Caddy For development environments requiring HTTPS, Caddy serves as a reverse proxy with automatic TLS certificate management. ### Install Caddy **macOS:** ```bash brew install caddy ``` **Debian/Ubuntu:** ```bash sudo apt install caddy ``` ### Configuration The repository includes `Caddyfile.example` with the required routing configuration. Start Caddy from the repository root: ```bash caddy run --config Caddyfile.example ``` On first run, Caddy installs a local CA certificate and may prompt for administrator password. ### Endpoint Routing | External URL | Internal Service | |--------------|------------------| | `https://localhost:3001` | Remote web UI/API | | `https://relay.localhost:3001` | Relay API | 资料来源：[crates/remote/README.md:15-45]() ### Health Check Endpoints Verify deployment health: ```bash curl -sk https://localhost:3001/v1/health curl -sk https://relay.localhost:3001/health ``` If the relay health endpoint returns HTML instead of `{"status":"ok"}`, the Caddy host routing configuration is incorrect. ## Database Infrastructure ### Electric SQL with PostgreSQL Vibe Kanban uses Electric SQL for database synchronization, providing: - Real-time data sync across instances - Offline-first capability - PostgreSQL compatibility ### Connection Configuration | Setting | Default Value | |---------|---------------| | Host | `localhost` | | Port | `5433` | | Database | `remote` | | Username | `remote` | | Password | `remote` | ### Container Networking All services communicate through the Docker bridge network, with the database accessible only to internal services. ## Relay Tunnel Service The relay tunnel enables secure remote access to Vibe Kanban when deployed behind NAT or firewalls. ```mermaid sequenceDiagram participant Client as Remote Client participant Relay as relay-tunnel:8082 participant WebUI as remote-web:3001 participant Server as remote-server:3000 Client->>Relay: WebSocket Connection Relay->>WebUI: Forward WebSocket WebUI->>Server: API Request Server-->>WebUI: Response WebUI-->>Relay: WebSocket Response Relay-->>Client: Tunneled Response ``` ### Requirements - `relay` profile enabled in Docker Compose - `VK_SHARED_RELAY_API_BASE` environment variable set - Caddy configured with `relay.localhost:3001` route ## Attachment Storage ### Azure Blob Storage (Production) Production deployments should configure Azure Blob Storage for file attachments: | Setting | Description | |---------|-------------| | Account Name | Azure storage account name | | Account Key | Azure storage access key | | Container | Blob container name | | Endpoint | Azure blob endpoint URL | ### Azurite (Development) Local development uses Azurite, an Azure Storage emulator: ```yaml azurite: image: mcr.microsoft.com/azure-storage/azurite ports: - "10000:10000" # Blob service - "10001:10001" # Queue service - "10002:10002" # Table service ``` 资料来源：[crates/remote/README.md:70-95]() ## API Endpoints Reference ### Health Check Endpoints | Endpoint | Method | Description | |----------|--------|-------------| | `/v1/health` | GET | API server health status | | `/health` | GET | Relay tunnel health status | ### OAuth Endpoints | Endpoint | Provider | |----------|----------| | `/v1/oauth/github/callback` | GitHub | | `/v1/oauth/google/callback` | Google | ## Deployment States ```mermaid stateDiagram-v2 [*] --> Initializing Initializing --> StartingServices: docker compose up StartingServices --> DatabaseReady: PostgreSQL online DatabaseReady --> APIServerReady: Server responding APIServerReady --> WebUIAvailable: UI accessible WebUIAvailable --> RelayEnabled: relay profile active RelayEnabled --> [*]: Services running Initializing --> Failed: Container error StartingServices --> Failed: Port conflict APIServerReady --> Degraded: Health check failing Degraded --> APIServerReady: Auto-recovery Failed --> Initializing: Restart triggered ``` ## Development vs Production ### Development Stack | Aspect | Setting | |--------|---------| | TLS | Self-signed or Caddy | | Storage | Azurite emulator | | Database | Local Electric SQL | | Access | Local network only | | Debugging | Full logging enabled | ### Production Stack | Aspect | Setting | |--------|---------| | TLS | Let's Encrypt or managed certificate | | Storage | Azure Blob Storage | | Database | Managed PostgreSQL or Electric SQL Cloud | | Access | VPN or secure tunnel | | Debugging | Structured logging with levels | ## Troubleshooting ### Container Startup Failures 1. Check port availability: ```bash lsof -i :3000 -i :3001 -i :5433 -i :8082 ``` 2. Verify environment variables are set: ```bash docker compose --env-file .env.remote config ``` 3. Check container logs: ```bash docker compose --env-file .env.remote logs -f ``` ### Database Connection Issues 1. Ensure database container is healthy: ```bash docker compose ps remote-db ``` 2. Test connection manually: ```bash psql "postgres://remote:remote@localhost:5433/remote" ``` ### Relay Tunnel Not Working 1. Verify Caddy routing for `relay.localhost`: ```bash curl -sk https://relay.localhost:3001/health ``` 2. Check relay container logs: ```bash docker compose logs relay-tunnel ``` 3. Ensure firewall allows WebSocket connections on port 8082 ### OAuth Configuration Errors Ensure OAuth callback URLs in your provider settings match exactly: - Protocol: `https://` (not `http://`) - Port: `3001` (unless custom configured) - Path: `/v1/oauth/{provider}/callback` ## Security Considerations ### Network Isolation All internal services communicate within the Docker network without exposure to the host: ```yaml networks: default: driver: bridge internal: false ``` ### Secret Management - Never commit `.env.remote` to version control - Use Docker secrets for production deployments - Rotate `JWT_SECRET` periodically ### TLS Requirements - Use HTTPS in all production deployments - Configure Caddy with valid certificates for OAuth providers - Some OAuth providers require HTTPS callback URLs --- --- ## Doramagic 踩坑日志 项目：BloopAI/vibe-kanban 摘要：发现 19 个潜在踩坑项，其中 3 个为 high/blocking；最高优先级：安装坑 - 来源证据：Deployment(Other(Migration failed: error returned from database: (code: 1) no such column: ep.session_id))。 ## 1. 安装坑 · 来源证据：Deployment(Other(Migration failed: error returned from database: (code: 1) no such column: ep.session_id)) - 严重度：high - 证据强度：source_linked - 发现：GitHub 社区证据显示该项目存在一个安装相关的待验证问题：Deployment(Other(Migration failed: error returned from database: (code: 1) no such column: ep.session_id)) - 对用户的影响：可能影响升级、迁移或版本选择。 - 建议检查：来源问题仍为 open，Pack Agent 需要复核是否仍影响当前版本。 - 防护动作：不得脱离来源链接放大为确定性结论；需要标注适用版本和复核状态。 - 证据：community_evidence:github | cevd_b34b2ea1b35a4dc2a4a0eb0681bdb883 | https://github.com/BloopAI/vibe-kanban/issues/2972 | 来源讨论提到 windows 相关条件，需在安装/试用前复核。 ## 2. 配置坑 · 来源证据：Support for self-hosted projects and better export - 严重度：high - 证据强度：source_linked - 发现：GitHub 社区证据显示该项目存在一个配置相关的待验证问题：Support for self-hosted projects and better export - 对用户的影响：可能阻塞安装或首次运行。 - 建议检查：来源问题仍为 open，Pack Agent 需要复核是否仍影响当前版本。 - 防护动作：不得脱离来源链接放大为确定性结论；需要标注适用版本和复核状态。 - 证据：community_evidence:github | cevd_19d27caa9e34416a9f282869f76624b0 | https://github.com/BloopAI/vibe-kanban/issues/3396 | 来源类型 github_issue 暴露的待验证使用条件。 ## 3. 安全/权限坑 · 来源证据：[Proposal] JIRA Integration for Vibe Kanban - 严重度：high - 证据强度：source_linked - 发现：GitHub 社区证据显示该项目存在一个安全/权限相关的待验证问题：[Proposal] JIRA Integration for Vibe Kanban - 对用户的影响：可能影响授权、密钥配置或安全边界。 - 建议检查：来源问题仍为 open，Pack Agent 需要复核是否仍影响当前版本。 - 防护动作：不得脱离来源链接放大为确定性结论；需要标注适用版本和复核状态。 - 证据：community_evidence:github | cevd_ab38fe97c4574e2da01ddedd71a4fbac | https://github.com/BloopAI/vibe-kanban/issues/2424 | 来源类型 github_issue 暴露的待验证使用条件。 ## 4. 安装坑 · 来源证据：Pre-release v0.1.40-20260401153532 - 严重度：medium - 证据强度：source_linked - 发现：GitHub 社区证据显示该项目存在一个安装相关的待验证问题：Pre-release v0.1.40-20260401153532 - 对用户的影响：可能阻塞安装或首次运行。 - 建议检查：来源显示可能已有修复、规避或版本变化，说明书中必须标注适用版本。 - 防护动作：不得脱离来源链接放大为确定性结论；需要标注适用版本和复核状态。 - 证据：community_evidence:github | cevd_f4b99d437a4f4fd4989d2b3ef036553b | https://github.com/BloopAI/vibe-kanban/releases/tag/v0.1.40-20260401153532 | 来源讨论提到 docker 相关条件，需在安装/试用前复核。 ## 5. 安装坑 · 来源证据：Release v0.1.36 - 严重度：medium - 证据强度：source_linked - 发现：GitHub 社区证据显示该项目存在一个安装相关的待验证问题：Release v0.1.36 - 对用户的影响：可能阻塞安装或首次运行。 - 建议检查：来源显示可能已有修复、规避或版本变化，说明书中必须标注适用版本。 - 防护动作：不得脱离来源链接放大为确定性结论；需要标注适用版本和复核状态。 - 证据：community_evidence:github | cevd_527645be4e3f438e81757ef265a70d79 | https://github.com/BloopAI/vibe-kanban/releases/tag/v0.1.36-20260323174633 | 来源讨论提到 npm 相关条件，需在安装/试用前复核。 ## 6. 安装坑 · 来源证据：Release v0.1.43 - 严重度：medium - 证据强度：source_linked - 发现：GitHub 社区证据显示该项目存在一个安装相关的待验证问题：Release v0.1.43 - 对用户的影响：可能增加新用户试用和生产接入成本。 - 建议检查：来源显示可能已有修复、规避或版本变化，说明书中必须标注适用版本。 - 防护动作：不得脱离来源链接放大为确定性结论；需要标注适用版本和复核状态。 - 证据：community_evidence:github | cevd_53704dc7171446fe86b2017f72212ddc | https://github.com/BloopAI/vibe-kanban/releases/tag/v0.1.43-20260417125614 | 来源讨论提到 node 相关条件，需在安装/试用前复核。 ## 7. 配置坑 · 可能修改宿主 AI 配置 - 严重度：medium - 证据强度：source_linked - 发现：项目面向 Claude/Cursor/Codex/Gemini/OpenCode 等宿主，或安装命令涉及用户配置目录。 - 对用户的影响：安装可能改变本机 AI 工具行为，用户需要知道写入位置和回滚方法。 - 建议检查：列出会写入的配置文件、目录和卸载/回滚步骤。 - 防护动作：涉及宿主配置目录时必须给回滚路径，不能只给安装命令。 - 证据：capability.host_targets | github_repo:1002125012 | https://github.com/BloopAI/vibe-kanban | host_targets=claude, claude_code ## 8. 能力坑 · 能力判断依赖假设 - 严重度：medium - 证据强度：source_linked - 发现：README/documentation is current enough for a first validation pass. - 对用户的影响：假设不成立时，用户拿不到承诺的能力。 - 建议检查：将假设转成下游验证清单。 - 防护动作：假设必须转成验证项；没有验证结果前不能写成事实。 - 证据：capability.assumptions | github_repo:1002125012 | https://github.com/BloopAI/vibe-kanban | README/documentation is current enough for a first validation pass. ## 9. 运行坑 · 来源证据：Pre-release v0.1.39-20260331145823 - 严重度：medium - 证据强度：source_linked - 发现：GitHub 社区证据显示该项目存在一个运行相关的待验证问题：Pre-release v0.1.39-20260331145823 - 对用户的影响：可能阻塞安装或首次运行。 - 建议检查：来源显示可能已有修复、规避或版本变化，说明书中必须标注适用版本。 - 防护动作：不得脱离来源链接放大为确定性结论；需要标注适用版本和复核状态。 - 证据：community_evidence:github | cevd_c005a56959634369929ce33eddbdc103 | https://github.com/BloopAI/vibe-kanban/releases/tag/v0.1.39-20260331145823 | 来源讨论提到 windows 相关条件，需在安装/试用前复核。 ## 10. 维护坑 · 来源证据：[Request] Support RDS for self hosting in AWS - 严重度：medium - 证据强度：source_linked - 发现：GitHub 社区证据显示该项目存在一个维护/版本相关的待验证问题：[Request] Support RDS for self hosting in AWS - 对用户的影响：可能影响升级、迁移或版本选择。 - 建议检查：来源问题仍为 open，Pack Agent 需要复核是否仍影响当前版本。 - 防护动作：不得脱离来源链接放大为确定性结论；需要标注适用版本和复核状态。 - 证据：community_evidence:github | cevd_f613b792c20942519560c0a286a82005 | https://github.com/BloopAI/vibe-kanban/issues/3405 | 来源类型 github_issue 暴露的待验证使用条件。 ## 11. 维护坑 · 维护活跃度未知 - 严重度：medium - 证据强度：source_linked - 发现：未记录 last_activity_observed。 - 对用户的影响：新项目、停更项目和活跃项目会被混在一起，推荐信任度下降。 - 建议检查：补 GitHub 最近 commit、release、issue/PR 响应信号。 - 防护动作：维护活跃度未知时，推荐强度不能标为高信任。 - 证据：evidence.maintainer_signals | github_repo:1002125012 | https://github.com/BloopAI/vibe-kanban | last_activity_observed missing ## 12. 安全/权限坑 · 下游验证发现风险项 - 严重度：medium - 证据强度：source_linked - 发现：no_demo - 对用户的影响：下游已经要求复核，不能在页面中弱化。 - 建议检查：进入安全/权限治理复核队列。 - 防护动作：下游风险存在时必须保持 review/recommendation 降级。 - 证据：downstream_validation.risk_items | github_repo:1002125012 | https://github.com/BloopAI/vibe-kanban | no_demo; severity=medium ## 13. 安全/权限坑 · 存在安全注意事项 - 严重度：medium - 证据强度：source_linked - 发现：No sandbox install has been executed yet; downstream must verify before user use. - 对用户的影响：用户安装前需要知道权限边界和敏感操作。 - 建议检查：转成明确权限清单和安全审查提示。 - 防护动作：安全注意事项必须面向用户前置展示。 - 证据：risks.safety_notes | github_repo:1002125012 | https://github.com/BloopAI/vibe-kanban | No sandbox install has been executed yet; downstream must verify before user use. ## 14. 安全/权限坑 · 存在评分风险 - 严重度：medium - 证据强度：source_linked - 发现：no_demo - 对用户的影响：风险会影响是否适合普通用户安装。 - 建议检查：把风险写入边界卡，并确认是否需要人工复核。 - 防护动作：评分风险必须进入边界卡，不能只作为内部分数。 - 证据：risks.scoring_risks | github_repo:1002125012 | https://github.com/BloopAI/vibe-kanban | no_demo; severity=medium ## 15. 安全/权限坑 · 来源证据：Issue: Unclear Git + Bitbucket Setup for Vibe-Kanban (OpenCode) in Docker - 严重度：medium - 证据强度：source_linked - 发现：GitHub 社区证据显示该项目存在一个安全/权限相关的待验证问题：Issue: Unclear Git + Bitbucket Setup for Vibe-Kanban (OpenCode) in Docker - 对用户的影响：可能影响升级、迁移或版本选择。 - 建议检查：来源问题仍为 open，Pack Agent 需要复核是否仍影响当前版本。 - 防护动作：不得脱离来源链接放大为确定性结论；需要标注适用版本和复核状态。 - 证据：community_evidence:github | cevd_7d289a7b68ee4299ae4a5e54b0e64e35 | https://github.com/BloopAI/vibe-kanban/issues/3410 | 来源讨论提到 docker 相关条件，需在安装/试用前复核。 ## 16. 安全/权限坑 · 来源证据：Pre-release v0.1.37-20260327101540 - 严重度：medium - 证据强度：source_linked - 发现：GitHub 社区证据显示该项目存在一个安全/权限相关的待验证问题：Pre-release v0.1.37-20260327101540 - 对用户的影响：可能影响授权、密钥配置或安全边界。 - 建议检查：来源显示可能已有修复、规避或版本变化，说明书中必须标注适用版本。 - 防护动作：不得脱离来源链接放大为确定性结论；需要标注适用版本和复核状态。 - 证据：community_evidence:github | cevd_d648fba4c94b4791ac2e7683f6cb1361 | https://github.com/BloopAI/vibe-kanban/releases/tag/v0.1.37-20260327101540 | 来源讨论提到 macos 相关条件，需在安装/试用前复核。 ## 17. 安全/权限坑 · 来源证据：remote-v0.1.26 - 严重度：medium - 证据强度：source_linked - 发现：GitHub 社区证据显示该项目存在一个安全/权限相关的待验证问题：remote-v0.1.26 - 对用户的影响：可能影响授权、密钥配置或安全边界。 - 建议检查：来源显示可能已有修复、规避或版本变化，说明书中必须标注适用版本。 - 防护动作：不得脱离来源链接放大为确定性结论；需要标注适用版本和复核状态。 - 证据：community_evidence:github | cevd_3f212752e8c142d68ffe2993ac23dd37 | https://github.com/BloopAI/vibe-kanban/releases/tag/remote-v0.1.26 | 来源讨论提到 macos 相关条件，需在安装/试用前复核。 ## 18. 维护坑 · issue/PR 响应质量未知 - 严重度：low - 证据强度：source_linked - 发现：issue_or_pr_quality=unknown。 - 对用户的影响：用户无法判断遇到问题后是否有人维护。 - 建议检查：抽样最近 issue/PR，判断是否长期无人处理。 - 防护动作：issue/PR 响应未知时，必须提示维护风险。 - 证据：evidence.maintainer_signals | github_repo:1002125012 | https://github.com/BloopAI/vibe-kanban | issue_or_pr_quality=unknown ## 19. 维护坑 · 发布节奏不明确 - 严重度：low - 证据强度：source_linked - 发现：release_recency=unknown。 - 对用户的影响：安装命令和文档可能落后于代码，用户踩坑概率升高。 - 建议检查：确认最近 release/tag 和 README 安装命令是否一致。 - 防护动作：发布节奏未知或过期时，安装说明必须标注可能漂移。 - 证据：evidence.maintainer_signals | github_repo:1002125012 | https://github.com/BloopAI/vibe-kanban | release_recency=unknown