mirror of
https://github.com/cline/cline.git
synced 2026-09-02 07:42:19 +08:00
Compare commits
10 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 9485c05839 | |||
| 28152c6d06 | |||
| 7a97ce57ba | |||
| 70c602ebb7 | |||
| 023162611d | |||
| acb32ef95e | |||
| e94c4727a2 | |||
| 54d136df5d | |||
| bef543c37c | |||
| 484a98a8a5 |
@@ -332,6 +332,21 @@
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"tab": "Kanban",
|
||||
"icon": "table-columns",
|
||||
"groups": [
|
||||
{
|
||||
"group": "Cline Kanban",
|
||||
"pages": [
|
||||
"kanban/overview",
|
||||
"kanban/getting-started",
|
||||
"kanban/core-workflow",
|
||||
"kanban/features"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"tab": "Learn",
|
||||
"icon": "graduation-cap",
|
||||
|
||||
@@ -0,0 +1,81 @@
|
||||
---
|
||||
title: "Core Workflow"
|
||||
description: "The end-to-end workflow for using Cline Kanban: create tasks, run agents, review changes, and ship"
|
||||
---
|
||||
|
||||
This guide walks through the typical Kanban workflow from start to finish.
|
||||
|
||||
## 1. Create Tasks
|
||||
|
||||
There are two ways to add tasks to the board:
|
||||
|
||||
- **Manually** — click the add button and write a task description
|
||||
- **Via sidebar chat** — open the sidebar chat and ask the agent to break down a piece of work into tasks. The agent can create cards, link them together, and start work directly on the board.
|
||||
|
||||
Each card on the board represents a discrete unit of work for an agent to complete.
|
||||
|
||||
## 2. Link Tasks
|
||||
|
||||
Link cards together to create dependency chains:
|
||||
|
||||
- **⌘ + click** (Mac) / **Ctrl + click** (Windows/Linux) a card to link it to another task
|
||||
- When a linked card completes and is moved to trash, the next linked task **automatically starts**
|
||||
|
||||
Combined with auto-commit, this enables fully autonomous chains where one task's output feeds into the next without manual intervention.
|
||||
|
||||
## 3. Start Tasks
|
||||
|
||||
Hit the **play button** on a card to start it. Here's what happens:
|
||||
|
||||
1. Kanban creates an **ephemeral git worktree** for the task — an isolated copy of your repo where the agent can make changes without affecting your main working directory or other tasks
|
||||
2. Gitignored files like `node_modules` are **symlinked** from your main repo into the worktree, avoiding slow reinstalls for each task
|
||||
3. The agent starts working in its own terminal within that worktree
|
||||
4. The card displays the agent's **latest message or tool call** so you can monitor progress from the board
|
||||
|
||||
Multiple tasks run in parallel, each in their own worktree, so agents never create merge conflicts with each other.
|
||||
|
||||
<Warning>
|
||||
Symlinks work well for gitignored files that agents don't need to modify (like `node_modules`). If your workflow requires agents to modify gitignored files, be aware that changes will affect the symlink target (your main repo's copy).
|
||||
</Warning>
|
||||
|
||||
## 4. Review Changes
|
||||
|
||||
Click a card to open the detail view, which shows:
|
||||
|
||||
- **The agent's TUI** — the full text interface showing the agent's conversation and actions
|
||||
- **A diff of all changes** in that worktree compared to your base branch
|
||||
|
||||
The diff viewer includes a **checkpoint system** — you can see diffs scoped to specific message ranges, not just the full cumulative diff. This makes it easier to understand what changed and when.
|
||||
|
||||
### Inline Comments
|
||||
|
||||
Click on any line in the diff to leave a comment. Comments are sent back to the agent as feedback, letting you steer its work without rewriting the task description. This is useful for corrections like "use a different approach here" or "this edge case isn't handled."
|
||||
|
||||
## 5. Ship It
|
||||
|
||||
When you're satisfied with the changes, you have two options:
|
||||
|
||||
- **Commit** — merges the worktree changes into a commit on your base branch
|
||||
- **Open PR** — creates a new branch and opens a pull request
|
||||
|
||||
In both cases, Kanban sends a dynamic prompt to the agent to handle the operation. The agent converts the worktree into the appropriate git action and **intelligently handles merge conflicts** if the base branch has moved since the worktree was created.
|
||||
|
||||
## 6. Clean Up
|
||||
|
||||
After shipping, move the card to **trash** to clean up the ephemeral worktree and free disk space.
|
||||
|
||||
<Tip>
|
||||
If you need to resume work on a trashed card later, Kanban provides a **resume ID** for each task. You can use this to pick up where you left off.
|
||||
</Tip>
|
||||
|
||||
## Workflow Summary
|
||||
|
||||
| Step | Action | What Happens |
|
||||
|------|--------|-------------|
|
||||
| Create | Add card or use sidebar chat | Task card appears on the board |
|
||||
| Link | ⌘ + click to connect cards | Dependency chain is established |
|
||||
| Start | Hit play on a card | Ephemeral worktree is created, agent begins work |
|
||||
| Monitor | Watch card status on board | Latest agent message/tool call shown on card |
|
||||
| Review | Click card to see diff | Full diff with checkpoints and inline commenting |
|
||||
| Ship | Click Commit or Open PR | Agent handles merge into base branch or creates PR |
|
||||
| Clean up | Move to trash | Worktree is removed, resume ID saved |
|
||||
@@ -0,0 +1,120 @@
|
||||
---
|
||||
title: "Features"
|
||||
description: "Detailed overview of Cline Kanban features: worktrees, auto-commit, task linking, diff viewer, git interface, and more"
|
||||
---
|
||||
|
||||
<Warning>
|
||||
Kanban is a **research preview**. Some features described here use experimental capabilities. Expect changes.
|
||||
</Warning>
|
||||
|
||||
## Ephemeral Worktrees
|
||||
|
||||
Every task card runs in its own [git worktree](https://git-scm.com/docs/git-worktree) — an isolated checkout of your repository. This is the foundation that enables parallel agent execution:
|
||||
|
||||
- Each agent works in its own directory with its own terminal
|
||||
- Changes in one worktree don't affect other worktrees or your main working directory
|
||||
- No merge conflicts between agents running simultaneously
|
||||
- Worktrees are cleaned up when you move a card to trash
|
||||
|
||||
### Symlinked Dependencies
|
||||
|
||||
When creating a worktree, Kanban symlinks gitignored files (like `node_modules`) from your main repo rather than copying or reinstalling them. This avoids the overhead of running `npm install` for every task.
|
||||
|
||||
<Warning>
|
||||
Symlinks point back to the original files in your main repo. This works well for dependencies that agents don't modify, but if an agent does modify a symlinked file, the change affects the original too.
|
||||
</Warning>
|
||||
|
||||
## Auto-Commit
|
||||
|
||||
When enabled, agents automatically commit their changes to the worktree branch as they work. This creates a trail of incremental commits rather than one large diff at the end.
|
||||
|
||||
Auto-commit can be toggled in the Kanban settings.
|
||||
|
||||
## Auto-PR
|
||||
|
||||
When enabled alongside auto-commit, agents can automatically create pull requests when they finish their work. The agent generates a PR with the changes from its worktree branch.
|
||||
|
||||
Auto-PR can be toggled in the Kanban settings.
|
||||
|
||||
## Task Linking & Dependency Chains
|
||||
|
||||
Task linking lets you create sequential workflows where completing one task triggers the next:
|
||||
|
||||
1. **⌘ + click** a card to link it to another card
|
||||
2. When the first card is completed and moved to trash, the linked card **starts automatically**
|
||||
3. Chain multiple cards together for multi-step workflows
|
||||
|
||||
When combined with auto-commit, this creates fully autonomous pipelines — one agent finishes, its work is committed, and the next agent picks up where it left off.
|
||||
|
||||
## Diff Viewer & Checkpoints
|
||||
|
||||
Clicking a card opens a detail view with a full diff of all changes in that worktree. The diff viewer includes:
|
||||
|
||||
- **Checkpoint-scoped diffs** — rather than showing only the cumulative diff, you can view changes from specific message ranges. This is useful for understanding what changed at each step.
|
||||
- **Inline commenting** — click any line in the diff to leave a comment that gets sent back to the agent. Use this to give targeted feedback like "handle this edge case" or "use a different pattern here."
|
||||
|
||||
## Sidebar Chat & Board Management
|
||||
|
||||
The sidebar chat gives you a conversational interface for managing the board. Instead of manually creating and configuring cards, you can ask the agent to:
|
||||
|
||||
- Break down a piece of work into multiple task cards
|
||||
- Link cards together into dependency chains
|
||||
- Start tasks on the board
|
||||
|
||||
The agent manipulates the board directly based on your instructions.
|
||||
|
||||
## Keyboard Shortcuts
|
||||
|
||||
Kanban includes keyboard shortcuts for common actions:
|
||||
|
||||
| Shortcut | Action |
|
||||
|----------|--------|
|
||||
| **C** | Create a new task card |
|
||||
| **⌘ + click** | Link a card to another card |
|
||||
|
||||
<Tip>
|
||||
The "C" shortcut works from the main board view. You need at least one project open to create a task.
|
||||
</Tip>
|
||||
|
||||
## Settings
|
||||
|
||||
Open the settings dialog to configure how Kanban behaves. Available settings include:
|
||||
|
||||
- **Auto-commit** — toggle whether agents automatically commit changes as they work
|
||||
- **Auto-PR** — toggle whether agents automatically create pull requests on completion (requires auto-commit)
|
||||
- **Script shortcuts** — define frequently-used commands that appear as buttons on task cards
|
||||
- **Project paths** — displayed with `~` instead of full home directory paths for readability
|
||||
|
||||
## Script Shortcuts
|
||||
|
||||
Define frequently-used commands (like `npm run dev` or `npm test`) in the Kanban settings. These appear as play buttons on task cards, giving you quick access to run, test, or debug the application within a worktree without switching to a separate terminal.
|
||||
|
||||
## Git Interface
|
||||
|
||||
Click the **branch name** in the navbar to open a full git interface. From here you can:
|
||||
|
||||
- Browse commit history
|
||||
- Switch branches
|
||||
- Fetch, pull, and push
|
||||
- Visualize the git graph
|
||||
|
||||
This lets you manage your repository without leaving Kanban or opening a separate git client.
|
||||
|
||||
## Agent Compatibility
|
||||
|
||||
Kanban works with CLI-based coding agents. It uses experimental features that bypass permissions and runtime hooks, giving agents more autonomy to work without interruption. Agents currently compatible with Kanban include:
|
||||
|
||||
- **Cline CLI**
|
||||
- **Claude Code**
|
||||
- **Codex**
|
||||
- **OpenCode**
|
||||
|
||||
and more. Check settings for all available agent runtimes
|
||||
|
||||
## Resume Tasks
|
||||
|
||||
When you move a card to trash, the worktree is cleaned up but Kanban saves a **resume ID**. If you need to continue work on a trashed task, you can use this ID to pick up where you left off without starting from scratch.
|
||||
|
||||
## Remote Config Gating
|
||||
|
||||
For teams and organizations, Kanban access can be gated via Cline remote config. This allows administrators to control who can access the Kanban board within their organization, enabling phased rollouts or restricting access to specific teams.
|
||||
@@ -0,0 +1,67 @@
|
||||
---
|
||||
title: "Getting Started"
|
||||
description: "Install Cline Kanban and launch your first board"
|
||||
---
|
||||
|
||||
## Prerequisites
|
||||
|
||||
- **Node.js 18 or higher** — check with `node --version`
|
||||
- **A git repository** — Kanban must be run from the root of a git repo
|
||||
|
||||
## Installation
|
||||
|
||||
Install Cline CLI globally via npm:
|
||||
|
||||
```bash
|
||||
npm i -g cline
|
||||
```
|
||||
|
||||
Then launch Kanban:
|
||||
|
||||
```bash
|
||||
cline --kanban
|
||||
```
|
||||
|
||||
<Tip>
|
||||
This launches a local web server and opens the Kanban board in your default browser.
|
||||
</Tip>
|
||||
|
||||
## First Launch
|
||||
|
||||
1. Open your terminal and `cd` to the root of any git repository
|
||||
2. Run `cline --kanban`
|
||||
3. Your browser opens to the Kanban board
|
||||
|
||||
### Onboarding
|
||||
|
||||
On your first launch, Kanban walks you through a short setup:
|
||||
|
||||
1. **Pick a project directory** — a directory picker opens so you can select (or confirm) the repository you want to work in
|
||||
2. **Choose your agent** — select which coding agent to use for tasks (Cline, Claude Code, or Codex)
|
||||
|
||||
After onboarding, you land on the board and can start creating tasks immediately. No account creation, API keys, or configuration files required.
|
||||
|
||||
## Creating Your First Task
|
||||
|
||||
Once the board is open:
|
||||
|
||||
1. **Create a card** — click the add button to create a new task card
|
||||
2. **Write a task description** — describe what you want the agent to do
|
||||
3. **Hit play** — Kanban creates an ephemeral git worktree for the task and starts an agent in its own terminal
|
||||
|
||||
The card updates in real time, showing the agent's latest message or tool call so you can monitor progress from the board.
|
||||
|
||||
<Tip>
|
||||
You can also use the **sidebar chat** to create tasks. Open the chat and ask the agent to break down work into multiple task cards — it can create, link, and start tasks directly on the board.
|
||||
</Tip>
|
||||
|
||||
## Next Steps
|
||||
|
||||
<Columns cols={2}>
|
||||
<Card title="Core Workflow" icon="arrows-spin" href="/kanban/core-workflow">
|
||||
Learn the full workflow: create → link → start → review → ship.
|
||||
</Card>
|
||||
<Card title="Features" icon="list-check" href="/kanban/features">
|
||||
Explore worktrees, auto-commit, task linking, the diff viewer, and more.
|
||||
</Card>
|
||||
</Columns>
|
||||
@@ -0,0 +1,64 @@
|
||||
---
|
||||
title: "Cline Kanban"
|
||||
sidebarTitle: "Overview"
|
||||
description: "A kanban board for orchestrating coding agents in parallel using git worktrees"
|
||||
---
|
||||
|
||||
<Warning>
|
||||
Kanban is a **research preview**. Share feedback in [#kanban on Discord](https://discord.gg/cline).
|
||||
</Warning>
|
||||
|
||||
## What is Cline Kanban?
|
||||
|
||||
Cline Kanban is a terminal-launched kanban board that runs in your browser. Each task card gets its own git worktree and terminal, so you can run multiple coding agents in parallel without merge conflicts. You create tasks, assign them to agents, review diffs, leave inline comments, and ship commits or PRs — all from one interface.
|
||||
|
||||
It runs locally, requires no account or setup, and works out of the box from any git repository.
|
||||
|
||||
```bash
|
||||
npm i -g cline
|
||||
cline --kanban
|
||||
```
|
||||
|
||||
## How It Works
|
||||
|
||||
1. **Run `cline --kanban`** from the root of any git repo — a local web server opens in your browser
|
||||
2. **Create task cards** manually or ask the sidebar chat agent to break work into tasks
|
||||
3. **Hit play** on a card — Kanban creates an ephemeral worktree and starts an agent
|
||||
4. **Monitor progress** — each card shows the agent's latest message or tool call
|
||||
5. **Review diffs** — click a card to see all changes, leave inline comments to steer the agent
|
||||
6. **Ship it** — hit Commit or Open PR, then trash the card to clean up the worktree
|
||||
|
||||
## Key Capabilities
|
||||
|
||||
<CardGroup cols={3}>
|
||||
<Card title="Parallel Execution" icon="clone">
|
||||
Each task runs in its own git worktree with its own terminal. Multiple agents work simultaneously without stepping on each other.
|
||||
</Card>
|
||||
<Card title="Unified Task Board" icon="table-columns">
|
||||
Create, triage, link, and monitor all agent tasks from a single browser-based kanban board.
|
||||
</Card>
|
||||
<Card title="Works With Existing Agents" icon="plug">
|
||||
Compatible with CLI agents you already use — Cline, Claude Code, and Codex. Kanban uses experimental features that bypass permissions and runtime hooks for more agent autonomy.
|
||||
</Card>
|
||||
</CardGroup>
|
||||
|
||||
## Links
|
||||
|
||||
- [GitHub Repository](https://github.com/cline/kanban) — source code, issues, and feature requests
|
||||
- [npm Package](https://www.npmjs.com/package/kanban) — version history and package details
|
||||
- [Cline App](https://app.cline.bot) — account management
|
||||
- [Discord #kanban](https://discord.gg/cline) — feedback and discussion
|
||||
|
||||
## Next Steps
|
||||
|
||||
<Columns cols={2}>
|
||||
<Card title="Getting Started" icon="rocket" href="/kanban/getting-started">
|
||||
Install Kanban and launch your first board.
|
||||
</Card>
|
||||
<Card title="Core Workflow" icon="arrows-spin" href="/kanban/core-workflow">
|
||||
The full workflow from creating tasks to shipping PRs.
|
||||
- [npm Package](https://www.npmjs.com/package/cline) — version history and package details
|
||||
<Card title="Features" icon="list-check" href="/kanban/features">
|
||||
Worktrees, auto-commit, task linking, diff viewer, git interface, and more.
|
||||
</Card>
|
||||
</Columns>
|
||||
@@ -342,7 +342,11 @@ console.log(JSON.stringify({
|
||||
result.contextModification?.should.equal("STALE_TASK: Long conversation paused for extended time")
|
||||
})
|
||||
|
||||
it("should combine context deletion with other state", async () => {
|
||||
it("should combine context deletion with other state", async function () {
|
||||
if (process.platform === "win32") {
|
||||
this.timeout(WINDOWS_HOOK_TEST_TIMEOUT_MS)
|
||||
}
|
||||
|
||||
const hookPath = path.join(tempDir, ".clinerules", "hooks", "TaskResume")
|
||||
const hookScript = `#!/usr/bin/env node
|
||||
const input = JSON.parse(require('fs').readFileSync(0, 'utf-8'));
|
||||
|
||||
@@ -12,6 +12,7 @@ describe("TaskStart Hook", () => {
|
||||
let sandbox: sinon.SinonSandbox
|
||||
let getEnv: () => { tempDir: string }
|
||||
let hookTestEnv: HookTestEnv
|
||||
const WINDOWS_HOOK_TEST_TIMEOUT_MS = 15000
|
||||
const getErrorMessage = (error: unknown): string => (error instanceof Error ? error.message : String(error))
|
||||
|
||||
const writeHookScript = async (hookPath: string, nodeScript: string): Promise<void> => {
|
||||
@@ -31,7 +32,11 @@ describe("TaskStart Hook", () => {
|
||||
})
|
||||
|
||||
describe("Hook Input Format", () => {
|
||||
it("should receive task metadata from startTask", async () => {
|
||||
it("should receive task metadata from startTask", async function () {
|
||||
if (process.platform === "win32") {
|
||||
this.timeout(WINDOWS_HOOK_TEST_TIMEOUT_MS)
|
||||
}
|
||||
|
||||
const hookPath = path.join(tempDir, ".clinerules", "hooks", "TaskStart")
|
||||
const hookScript = `#!/usr/bin/env node
|
||||
const input = JSON.parse(require('fs').readFileSync(0, 'utf-8'));
|
||||
|
||||
@@ -71,15 +71,19 @@ describe("Hostbridge - Window - getOpenTabs", () => {
|
||||
await createAndOpenTestDocument("open-tabs-1", vscode.ViewColumn.One)
|
||||
await createAndOpenTestDocument("open-tabs-2", vscode.ViewColumn.Two)
|
||||
|
||||
// Wait for tabs to be fully created
|
||||
// Wait for both expected tabs to appear.
|
||||
// On Windows, opening in a different ViewColumn can sometimes create
|
||||
// duplicate tab entries, so we check for unique paths containing both files
|
||||
// rather than an exact count.
|
||||
await pWaitFor(
|
||||
async () => {
|
||||
const request = GetOpenTabsRequest.create({})
|
||||
const response = await getOpenTabs(request)
|
||||
const uniquePaths = [...new Set(response.paths)]
|
||||
console.log(
|
||||
`[DEBUG] Waiting for 2 tabs, currently found ${response.paths.length}: ${JSON.stringify(response.paths)}`,
|
||||
`[DEBUG] Waiting for 2 unique tabs, currently found ${uniquePaths.length}: ${JSON.stringify(uniquePaths)}`,
|
||||
)
|
||||
return response.paths.length === 2
|
||||
return uniquePaths.some((p) => p.includes("open-tabs-1")) && uniquePaths.some((p) => p.includes("open-tabs-2"))
|
||||
},
|
||||
{
|
||||
timeout: 8000,
|
||||
@@ -89,12 +93,13 @@ describe("Hostbridge - Window - getOpenTabs", () => {
|
||||
|
||||
const request = GetOpenTabsRequest.create({})
|
||||
const response = await getOpenTabs(request)
|
||||
const uniquePaths = [...new Set(response.paths)]
|
||||
|
||||
// Should have 2 tabs open
|
||||
// Should have both tabs open (deduplicated for Windows ViewColumn quirk)
|
||||
assert.strictEqual(
|
||||
response.paths.length,
|
||||
uniquePaths.length,
|
||||
2,
|
||||
`Expected 2 tabs, got ${response.paths.length}. Found tabs: ${JSON.stringify(response.paths)}`,
|
||||
`Expected 2 unique tabs, got ${uniquePaths.length}. Found tabs: ${JSON.stringify(response.paths)}`,
|
||||
)
|
||||
})
|
||||
|
||||
|
||||
Reference in New Issue
Block a user