claude-kanban 0.4.0 → 0.5.1

package/dist/bin/cli.js

@@ -5,7 +5,7 @@ import { Command } from "commander";
 import chalk from "chalk";
 import open from "open";
 import { existsSync as existsSync4 } from "fs";
-import { execSync as execSync2 } from "child_process";
+import { execSync } from "child_process";
 import { createInterface } from "readline";
 import { join as join6 } from "path";
 
@@ -18,9 +18,9 @@ import { fileURLToPath } from "url";
 import { existsSync as existsSync3 } from "fs";
 
 // src/server/services/executor.ts
-import { spawn, execSync } from "child_process";
+import { spawn } from "child_process";
 import { join as join4 } from "path";
-import { writeFileSync as writeFileSync4, unlinkSync, mkdirSync as mkdirSync2, existsSync as existsSync2, appendFileSync as appendFileSync2, readFileSync as readFileSync4, rmSync } from "fs";
+import { writeFileSync as writeFileSync4, unlinkSync, mkdirSync as mkdirSync2, existsSync as existsSync2, appendFileSync as appendFileSync2, readFileSync as readFileSync4 } from "fs";
 import { EventEmitter } from "events";
 
 // src/server/services/project.ts
@@ -458,7 +458,6 @@ function getTaskCounts(projectPath) {
     draft: 0,
     ready: 0,
     in_progress: 0,
-    in_review: 0,
     completed: 0,
     failed: 0
   };
@@ -531,11 +530,10 @@ function getRecentProgress(projectPath, lines = 100) {
 // src/server/services/executor.ts
 var KANBAN_DIR4 = ".claude-kanban";
 var LOGS_DIR = "logs";
-var WORKTREES_DIR = "worktrees";
 var TaskExecutor = class extends EventEmitter {
   projectPath;
-  runningTasks = /* @__PURE__ */ new Map();
-  reviewingTasks = /* @__PURE__ */ new Map();
+  runningTask = null;
+  planningSession = null;
   afkMode = false;
   afkIteration = 0;
   afkMaxIterations = 0;
@@ -641,186 +639,71 @@ ${summary}
     }
   }
   /**
-   * Check if project is a git repository
+   * Check if a task is currently running
    */
-  isGitRepo() {
-    try {
-      execSync("git rev-parse --is-inside-work-tree", {
-        cwd: this.projectPath,
-        stdio: "pipe"
-      });
-      return true;
-    } catch {
-      return false;
-    }
+  isRunning() {
+    return this.runningTask !== null;
   }
   /**
-   * Get worktrees directory path
+   * Get the currently running task ID
    */
-  getWorktreesDir() {
-    return join4(this.projectPath, KANBAN_DIR4, WORKTREES_DIR);
-  }
-  /**
-   * Get worktree path for a task
-   */
-  getWorktreePath(taskId) {
-    return join4(this.getWorktreesDir(), taskId);
-  }
-  /**
-   * Get branch name for a task
-   */
-  getBranchName(taskId) {
-    return `task/${taskId}`;
-  }
-  /**
-   * Create a git worktree for isolated task execution
-   */
-  createWorktree(taskId) {
-    if (!this.isGitRepo()) {
-      console.log("[executor] Not a git repo, skipping worktree creation");
-      return null;
-    }
-    const worktreePath = this.getWorktreePath(taskId);
-    const branchName = this.getBranchName(taskId);
-    try {
-      const worktreesDir = this.getWorktreesDir();
-      if (!existsSync2(worktreesDir)) {
-        mkdirSync2(worktreesDir, { recursive: true });
-      }
-      if (existsSync2(worktreePath)) {
-        this.removeWorktree(taskId);
-      }
-      try {
-        execSync(`git rev-parse --verify ${branchName}`, {
-          cwd: this.projectPath,
-          stdio: "pipe"
-        });
-        execSync(`git branch -D ${branchName}`, {
-          cwd: this.projectPath,
-          stdio: "pipe"
-        });
-      } catch {
-      }
-      execSync(`git worktree add -b ${branchName} "${worktreePath}"`, {
-        cwd: this.projectPath,
-        stdio: "pipe"
-      });
-      console.log(`[executor] Created worktree at ${worktreePath} on branch ${branchName}`);
-      return { worktreePath, branchName };
-    } catch (error) {
-      console.error("[executor] Failed to create worktree:", error);
-      return null;
-    }
+  getRunningTaskId() {
+    return this.runningTask?.taskId || null;
   }
   /**
-   * Remove a git worktree
-   */
-  removeWorktree(taskId) {
-    const worktreePath = this.getWorktreePath(taskId);
-    const branchName = this.getBranchName(taskId);
-    try {
-      if (existsSync2(worktreePath)) {
-        execSync(`git worktree remove "${worktreePath}" --force`, {
-          cwd: this.projectPath,
-          stdio: "pipe"
-        });
-        console.log(`[executor] Removed worktree at ${worktreePath}`);
-      }
-    } catch (error) {
-      console.error("[executor] Failed to remove worktree via git:", error);
-      try {
-        if (existsSync2(worktreePath)) {
-          rmSync(worktreePath, { recursive: true, force: true });
-          execSync("git worktree prune", {
-            cwd: this.projectPath,
-            stdio: "pipe"
-          });
-        }
-      } catch {
-        console.error("[executor] Failed to force remove worktree directory");
-      }
-    }
-    try {
-      execSync(`git branch -D ${branchName}`, {
-        cwd: this.projectPath,
-        stdio: "pipe"
-      });
-      console.log(`[executor] Deleted branch ${branchName}`);
-    } catch {
-    }
-  }
-  /**
-   * Merge worktree branch back to main branch
+   * Get running task output
    */
-  mergeWorktreeBranch(taskId) {
-    const branchName = this.getBranchName(taskId);
-    try {
-      const currentBranch = execSync("git rev-parse --abbrev-ref HEAD", {
-        cwd: this.projectPath,
-        encoding: "utf-8"
-      }).trim();
-      execSync(`git merge ${branchName} --no-edit`, {
-        cwd: this.projectPath,
-        stdio: "pipe"
-      });
-      console.log(`[executor] Merged ${branchName} into ${currentBranch}`);
-      return true;
-    } catch (error) {
-      console.error("[executor] Failed to merge branch:", error);
-      return false;
+  getTaskOutput(taskId) {
+    if (this.runningTask?.taskId === taskId) {
+      return this.runningTask.output;
     }
+    return void 0;
   }
   /**
-   * Get number of currently running tasks
+   * Check if a planning session is running
    */
-  getRunningCount() {
-    return this.runningTasks.size;
+  isPlanning() {
+    return this.planningSession !== null;
   }
   /**
-   * Check if a task is running
+   * Check if executor is busy (task or planning running)
    */
-  isTaskRunning(taskId) {
-    return this.runningTasks.has(taskId);
+  isBusy() {
+    return this.runningTask !== null || this.planningSession !== null;
   }
   /**
-   * Get all running task IDs
+   * Get planning session output
    */
-  getRunningTaskIds() {
-    return Array.from(this.runningTasks.keys());
+  getPlanningOutput() {
+    return this.planningSession?.output;
   }
   /**
-   * Get running task output
+   * Get planning session goal
    */
-  getTaskOutput(taskId) {
-    return this.runningTasks.get(taskId)?.output;
+  getPlanningGoal() {
+    return this.planningSession?.goal;
   }
   /**
-   * Build the prompt for a specific task
+   * Build the prompt for a task - simplified Ralph-style
    */
-  buildTaskPrompt(task, config, worktreeInfo) {
+  buildTaskPrompt(task, config) {
     const kanbanDir = join4(this.projectPath, KANBAN_DIR4);
     const prdPath = join4(kanbanDir, "prd.json");
     const progressPath = join4(kanbanDir, "progress.txt");
     const stepsText = task.steps.length > 0 ? `
 Verification steps:
 ${task.steps.map((s, i) => `${i + 1}. ${s}`).join("\n")}` : "";
-    const verifySteps = [];
+    const verifyCommands = [];
     if (config.project.typecheckCommand) {
-      verifySteps.push(`Run typecheck: ${config.project.typecheckCommand}`);
+      verifyCommands.push(config.project.typecheckCommand);
     }
     if (config.project.testCommand) {
-      verifySteps.push(`Run tests: ${config.project.testCommand}`);
+      verifyCommands.push(config.project.testCommand);
     }
-    const verifySection = verifySteps.length > 0 ? `3. Verify your work:
-${verifySteps.map((s) => `   - ${s}`).join("\n")}
-
-` : "";
-    const worktreeSection = worktreeInfo ? `## ENVIRONMENT
-You are running in an isolated git worktree on branch "${worktreeInfo.branchName}".
-This is a fresh checkout - dependencies (node_modules, vendor, etc.) are NOT installed.
-Before running any build/test commands, install dependencies first (e.g., npm install, composer install, pip install).
+    const verifySection = verifyCommands.length > 0 ? `3. Run quality checks:
+${verifyCommands.map((cmd) => `   - ${cmd}`).join("\n")}
 
-` : "";
+4.` : "3.";
     return `You are an AI coding agent. Complete the following task:
 
 ## TASK
@@ -831,48 +714,254 @@ Priority: ${task.priority}
 ${task.description}
 ${stepsText}
 
-${worktreeSection}## INSTRUCTIONS
-1. If dependencies are not installed, install them first.
+## INSTRUCTIONS
 
-2. Implement this task as described above.
+1. Implement this task as described above.
 
-${verifySection}${verifySteps.length > 0 ? "4" : "3"}. When complete, update the task in ${prdPath}:
+2. Make sure your changes work correctly.
+
+${verifySection} When complete, update the PRD file at ${prdPath}:
    - Find the task with id "${task.id}"
    - Set "passes": true
-   (Note: Do NOT change the status - the system will move it to review)
+   - Set "status": "completed"
 
-${verifySteps.length > 0 ? "5" : "4"}. Document your work in ${progressPath}:
-   - What you implemented and files changed
-   - Key decisions made and why
-   - Gotchas, edge cases, or tricky parts discovered
-   - Useful patterns or approaches that worked well
-   - Anything a future agent should know about this area of the codebase
+${verifyCommands.length > 0 ? "5" : "4"}. Document your work in ${progressPath}:
+   - What you implemented
+   - Key decisions made
+   - Any gotchas or important notes for future work
 
-${verifySteps.length > 0 ? "6" : "5"}. Make a git commit with a descriptive message.
+${verifyCommands.length > 0 ? "6" : "5"}. Commit your changes with a descriptive message.
 
-Focus only on this task. When successfully complete, output: <promise>COMPLETE</promise>`;
+Focus only on this task. When done, output: <promise>COMPLETE</promise>`;
+  }
+  /**
+   * Build the prompt for a planning session
+   */
+  buildPlanningPrompt(goal) {
+    const kanbanDir = join4(this.projectPath, KANBAN_DIR4);
+    const prdPath = join4(kanbanDir, "prd.json");
+    return `You are an AI coding planner. Your job is to analyze a codebase and break down a user's goal into concrete, actionable tasks.
+
+## GOAL
+${goal}
+
+## INSTRUCTIONS
+
+1. Explore the codebase to understand:
+   - Project structure and architecture
+   - Existing patterns and conventions
+   - Related existing code that you'll build upon
+   - What technologies and frameworks are being used
+
+2. Break down the goal into 3-8 specific, actionable tasks that can each be completed in a single coding session.
+
+3. For each task, determine:
+   - Clear, action-oriented title (start with a verb: Add, Create, Implement, Fix, etc.)
+   - Detailed description with implementation guidance
+   - Category: functional, ui, bug, enhancement, testing, or refactor
+   - Priority: low, medium, high, or critical
+   - 3-7 verification steps to confirm the task is complete
+
+4. Read the current PRD file at ${prdPath}, then update it:
+   - Add your new tasks to the "tasks" array
+   - Each task must have this structure:
+     {
+       "id": "task_" + 8 random alphanumeric characters,
+       "title": "...",
+       "description": "...",
+       "category": "functional|ui|bug|enhancement|testing|refactor",
+       "priority": "low|medium|high|critical",
+       "status": "draft",
+       "steps": ["Step 1", "Step 2", ...],
+       "passes": false,
+       "createdAt": ISO timestamp,
+       "updatedAt": ISO timestamp,
+       "executionHistory": []
+     }
+
+5. Commit your changes with message: "Plan: ${goal}"
+
+IMPORTANT:
+- Tasks should be ordered logically (dependencies first)
+- Each task should be completable independently
+- Be specific about implementation details
+- Consider edge cases and error handling
+
+When done, output: <promise>PLANNING_COMPLETE</promise>`;
   }
   /**
-   * Run a specific task
+   * Run a planning session to break down a goal into tasks
+   */
+  async runPlanningSession(goal) {
+    if (this.isBusy()) {
+      throw new Error("Another operation is in progress. Wait for it to complete or cancel it first.");
+    }
+    const config = getConfig(this.projectPath);
+    const startedAt = /* @__PURE__ */ new Date();
+    const prompt = this.buildPlanningPrompt(goal);
+    const kanbanDir = join4(this.projectPath, KANBAN_DIR4);
+    const promptFile = join4(kanbanDir, "prompt-planning.txt");
+    writeFileSync4(promptFile, prompt);
+    const args = [];
+    if (config.agent.model) {
+      args.push("--model", config.agent.model);
+    }
+    args.push("--permission-mode", config.agent.permissionMode);
+    args.push("-p");
+    args.push("--verbose");
+    args.push("--output-format", "stream-json");
+    args.push(`@${promptFile}`);
+    const commandDisplay = `${config.agent.command} ${args.join(" ")}`;
+    const fullCommand = `${config.agent.command} ${args.join(" ")}`;
+    console.log("[executor] Planning command:", fullCommand);
+    console.log("[executor] CWD:", this.projectPath);
+    const childProcess = spawn("bash", ["-c", fullCommand], {
+      cwd: this.projectPath,
+      env: {
+        ...process.env,
+        TERM: "xterm-256color",
+        FORCE_COLOR: "0",
+        NO_COLOR: "1"
+      },
+      stdio: ["ignore", "pipe", "pipe"]
+    });
+    this.planningSession = {
+      goal,
+      process: childProcess,
+      startedAt,
+      output: []
+    };
+    const logOutput = (line) => {
+      this.planningSession?.output.push(line);
+      this.emit("planning:output", { line, lineType: "stdout" });
+    };
+    this.emit("planning:started", { goal, timestamp: startedAt.toISOString() });
+    logOutput(`[claude-kanban] Starting planning session
+`);
+    logOutput(`[claude-kanban] Goal: ${goal}
+`);
+    logOutput(`[claude-kanban] Command: ${commandDisplay}
+`);
+    let stdoutBuffer = "";
+    childProcess.stdout?.on("data", (data) => {
+      stdoutBuffer += data.toString();
+      const lines = stdoutBuffer.split("\n");
+      stdoutBuffer = lines.pop() || "";
+      for (const line of lines) {
+        if (!line.trim()) continue;
+        try {
+          const json = JSON.parse(line);
+          let text = "";
+          if (json.type === "assistant" && json.message?.content) {
+            for (const block of json.message.content) {
+              if (block.type === "text") {
+                text += block.text;
+              } else if (block.type === "tool_use") {
+                text += this.formatToolUse(block.name, block.input);
+              }
+            }
+          } else if (json.type === "content_block_delta" && json.delta?.text) {
+            text = json.delta.text;
+          } else if (json.type === "result" && json.result) {
+            text = `
+[Result: ${json.result}]
+`;
+          }
+          if (text) {
+            logOutput(text);
+          }
+        } catch {
+          const cleanText = line.replace(/\x1B\[[0-9;]*[A-Za-z]/g, "");
+          if (cleanText.trim()) {
+            logOutput(cleanText + "\n");
+          }
+        }
+      }
+    });
+    childProcess.stderr?.on("data", (data) => {
+      const text = data.toString();
+      logOutput(`[stderr] ${text}`);
+    });
+    childProcess.on("error", (error) => {
+      console.log("[executor] Planning spawn error:", error.message);
+      this.emit("planning:output", { line: `[claude-kanban] Error: ${error.message}
+`, lineType: "stderr" });
+      try {
+        unlinkSync(promptFile);
+      } catch {
+      }
+      this.emit("planning:failed", { error: error.message });
+      this.planningSession = null;
+    });
+    childProcess.on("close", (code, signal) => {
+      console.log("[executor] Planning process closed with code:", code, "signal:", signal);
+      try {
+        unlinkSync(promptFile);
+      } catch {
+      }
+      logOutput(`[claude-kanban] Planning process exited with code ${code}
+`);
+      this.handlePlanningComplete(code);
+    });
+    const timeoutMs = 15 * 60 * 1e3;
+    setTimeout(() => {
+      if (this.planningSession) {
+        this.cancelPlanning("Planning timeout exceeded");
+      }
+    }, timeoutMs);
+  }
+  /**
+   * Handle planning session completion
+   */
+  handlePlanningComplete(exitCode) {
+    if (!this.planningSession) return;
+    const output = this.planningSession.output.join("");
+    const isComplete = output.includes("<promise>PLANNING_COMPLETE</promise>");
+    if (isComplete || exitCode === 0) {
+      this.emit("planning:completed", { success: true });
+    } else {
+      const error = `Planning process exited with code ${exitCode}`;
+      this.emit("planning:failed", { error });
+    }
+    this.planningSession = null;
+  }
+  /**
+   * Cancel the planning session
+   */
+  cancelPlanning(reason = "Cancelled by user") {
+    if (!this.planningSession) return false;
+    const { process: childProcess } = this.planningSession;
+    try {
+      childProcess.kill("SIGTERM");
+      setTimeout(() => {
+        try {
+          if (!childProcess.killed) {
+            childProcess.kill("SIGKILL");
+          }
+        } catch {
+        }
+      }, 2e3);
+    } catch {
+    }
+    this.emit("planning:cancelled", { reason });
+    this.planningSession = null;
+    return true;
+  }
+  /**
+   * Run a task
    */
   async runTask(taskId) {
+    if (this.isBusy()) {
+      throw new Error("Another operation is in progress. Wait for it to complete or cancel it first.");
+    }
     const config = getConfig(this.projectPath);
     const task = getTaskById(this.projectPath, taskId);
     if (!task) {
       throw new Error(`Task not found: ${taskId}`);
     }
-    if (this.isTaskRunning(taskId)) {
-      throw new Error(`Task already running: ${taskId}`);
-    }
-    const maxConcurrent = config.execution.maxConcurrent || 3;
-    if (this.getRunningCount() >= maxConcurrent) {
-      throw new Error(`Maximum concurrent tasks (${maxConcurrent}) reached`);
-    }
     updateTask(this.projectPath, taskId, { status: "in_progress" });
     const startedAt = /* @__PURE__ */ new Date();
-    const worktreeInfo = this.createWorktree(taskId);
-    const executionPath = worktreeInfo?.worktreePath || this.projectPath;
-    const prompt = this.buildTaskPrompt(task, config, worktreeInfo);
+    const prompt = this.buildTaskPrompt(task, config);
     const kanbanDir = join4(this.projectPath, KANBAN_DIR4);
     const promptFile = join4(kanbanDir, `prompt-${taskId}.txt`);
     writeFileSync4(promptFile, prompt);
@@ -888,48 +977,32 @@ Focus only on this task. When successfully complete, output: <promise>COMPLETE</
     const commandDisplay = `${config.agent.command} ${args.join(" ")}`;
     const fullCommand = `${config.agent.command} ${args.join(" ")}`;
     console.log("[executor] Command:", fullCommand);
-    console.log("[executor] CWD:", executionPath);
-    if (worktreeInfo) {
-      console.log("[executor] Using worktree:", worktreeInfo.worktreePath);
-      console.log("[executor] Branch:", worktreeInfo.branchName);
-    }
+    console.log("[executor] CWD:", this.projectPath);
     const childProcess = spawn("bash", ["-c", fullCommand], {
-      cwd: executionPath,
+      cwd: this.projectPath,
       env: {
         ...process.env,
         TERM: "xterm-256color",
         FORCE_COLOR: "0",
-        // Disable colors to avoid escape codes
         NO_COLOR: "1"
-        // Standard way to disable colors
       },
       stdio: ["ignore", "pipe", "pipe"]
-      // Close stdin since we don't need interactive input
     });
-    const runningTask = {
+    this.runningTask = {
       taskId,
       process: childProcess,
       startedAt,
-      output: [],
-      worktreePath: worktreeInfo?.worktreePath,
-      branchName: worktreeInfo?.branchName
+      output: []
     };
-    this.runningTasks.set(taskId, runningTask);
     this.initLogFile(taskId);
     const logOutput = (line) => {
       this.appendToLog(taskId, line);
-      runningTask.output.push(line);
+      this.runningTask?.output.push(line);
       this.emit("task:output", { taskId, line, lineType: "stdout" });
     };
     this.emit("task:started", { taskId, timestamp: startedAt.toISOString() });
     logOutput(`[claude-kanban] Starting task: ${task.title}
 `);
-    if (worktreeInfo) {
-      logOutput(`[claude-kanban] Worktree: ${worktreeInfo.worktreePath}
-`);
-      logOutput(`[claude-kanban] Branch: ${worktreeInfo.branchName}
-`);
-    }
     logOutput(`[claude-kanban] Command: ${commandDisplay}
 `);
     logOutput(`[claude-kanban] Process spawned (PID: ${childProcess.pid})
@@ -974,9 +1047,6 @@ Focus only on this task. When successfully complete, output: <promise>COMPLETE</
       const text = data.toString();
       logOutput(`[stderr] ${text}`);
     });
-    childProcess.on("spawn", () => {
-      console.log("[executor] Process spawned successfully");
-    });
     childProcess.on("error", (error) => {
       console.log("[executor] Spawn error:", error.message);
       this.emit("task:output", { taskId, line: `[claude-kanban] Error: ${error.message}
@@ -985,9 +1055,6 @@ Focus only on this task. When successfully complete, output: <promise>COMPLETE</
         unlinkSync(promptFile);
       } catch {
       }
-      if (worktreeInfo) {
-        this.removeWorktree(taskId);
-      }
       updateTask(this.projectPath, taskId, { status: "failed", passes: false });
       const endedAt = /* @__PURE__ */ new Date();
       addExecutionEntry(this.projectPath, taskId, {
@@ -998,7 +1065,7 @@ Focus only on this task. When successfully complete, output: <promise>COMPLETE</
         error: error.message
       });
       this.emit("task:failed", { taskId, error: error.message });
-      this.runningTasks.delete(taskId);
+      this.runningTask = null;
     });
     childProcess.on("close", (code, signal) => {
       console.log("[executor] Process closed with code:", code, "signal:", signal);
@@ -1012,48 +1079,41 @@ Focus only on this task. When successfully complete, output: <promise>COMPLETE</
     });
     const timeoutMs = (config.execution.timeout || 30) * 60 * 1e3;
     setTimeout(() => {
-      if (this.isTaskRunning(taskId)) {
-        this.cancelTask(taskId, "Timeout exceeded");
+      if (this.runningTask?.taskId === taskId) {
+        this.cancelTask("Timeout exceeded");
       }
     }, timeoutMs);
   }
   /**
-   * Handle task completion - moves to in_review, keeps worktree alive
+   * Handle task completion
    */
   handleTaskComplete(taskId, exitCode, startedAt) {
-    const runningTask = this.runningTasks.get(taskId);
-    if (!runningTask) return;
+    if (!this.runningTask || this.runningTask.taskId !== taskId) return;
     const endedAt = /* @__PURE__ */ new Date();
     const duration = endedAt.getTime() - startedAt.getTime();
-    const output = runningTask.output.join("");
+    const output = this.runningTask.output.join("");
     const isComplete = output.includes("<promise>COMPLETE</promise>");
     const task = getTaskById(this.projectPath, taskId);
     if (isComplete || exitCode === 0) {
-      if (runningTask.worktreePath && runningTask.branchName) {
-        this.reviewingTasks.set(taskId, {
-          worktreePath: runningTask.worktreePath,
-          branchName: runningTask.branchName,
-          startedAt,
-          endedAt
-        });
-        console.log(`[executor] Task ${taskId} ready for review at ${runningTask.worktreePath}`);
-      }
       updateTask(this.projectPath, taskId, {
-        status: "in_review",
+        status: "completed",
         passes: true
       });
+      addExecutionEntry(this.projectPath, taskId, {
+        startedAt: startedAt.toISOString(),
+        endedAt: endedAt.toISOString(),
+        status: "completed",
+        duration
+      });
       logTaskExecution(this.projectPath, {
         taskId,
         taskTitle: task?.title || "Unknown",
-        status: "in_review",
+        status: "completed",
         duration
       });
-      this.emit("task:completed", { taskId, duration, status: "in_review" });
+      this.emit("task:completed", { taskId, duration });
       this.afkTasksCompleted++;
     } else {
-      if (runningTask.worktreePath) {
-        this.removeWorktree(taskId);
-      }
       updateTask(this.projectPath, taskId, {
         status: "failed",
         passes: false
@@ -1075,184 +1135,33 @@ Focus only on this task. When successfully complete, output: <promise>COMPLETE</
       });
       this.emit("task:failed", { taskId, error });
     }
-    this.runningTasks.delete(taskId);
+    this.runningTask = null;
     if (this.afkMode) {
       this.continueAFKMode();
     }
   }
   /**
-   * Get info about a task in review
-   */
-  getReviewingTask(taskId) {
-    return this.reviewingTasks.get(taskId);
-  }
-  /**
-   * Merge a reviewed task into the base branch
-   */
-  mergeTask(taskId) {
-    const reviewInfo = this.reviewingTasks.get(taskId);
-    if (!reviewInfo) {
-      return { success: false, error: "Task not in review or no worktree found" };
-    }
-    const merged = this.mergeWorktreeBranch(taskId);
-    if (!merged) {
-      return { success: false, error: "Merge failed - may have conflicts" };
-    }
-    this.removeWorktree(taskId);
-    this.reviewingTasks.delete(taskId);
-    updateTask(this.projectPath, taskId, {
-      status: "completed"
-    });
-    addExecutionEntry(this.projectPath, taskId, {
-      startedAt: reviewInfo.startedAt.toISOString(),
-      endedAt: (/* @__PURE__ */ new Date()).toISOString(),
-      status: "completed",
-      duration: (/* @__PURE__ */ new Date()).getTime() - reviewInfo.startedAt.getTime()
-    });
-    console.log(`[executor] Task ${taskId} merged successfully`);
-    return { success: true };
-  }
-  /**
-   * Create a PR for a reviewed task
-   */
-  createPR(taskId) {
-    const reviewInfo = this.reviewingTasks.get(taskId);
-    const task = getTaskById(this.projectPath, taskId);
-    if (!reviewInfo) {
-      return { success: false, error: "Task not in review or no worktree found" };
-    }
-    try {
-      execSync(`git push -u origin ${reviewInfo.branchName}`, {
-        cwd: this.projectPath,
-        stdio: "pipe"
-      });
-      const prTitle = task?.title || `Task ${taskId}`;
-      const prBody = task?.description || "";
-      const result = execSync(
-        `gh pr create --title "${prTitle.replace(/"/g, '\\"')}" --body "${prBody.replace(/"/g, '\\"')}" --head ${reviewInfo.branchName}`,
-        {
-          cwd: this.projectPath,
-          encoding: "utf-8"
-        }
-      );
-      const prUrl = result.trim();
-      try {
-        execSync(`git worktree remove "${reviewInfo.worktreePath}" --force`, {
-          cwd: this.projectPath,
-          stdio: "pipe"
-        });
-      } catch {
-      }
-      this.reviewingTasks.delete(taskId);
-      updateTask(this.projectPath, taskId, {
-        status: "completed"
-      });
-      addExecutionEntry(this.projectPath, taskId, {
-        startedAt: reviewInfo.startedAt.toISOString(),
-        endedAt: (/* @__PURE__ */ new Date()).toISOString(),
-        status: "completed",
-        duration: (/* @__PURE__ */ new Date()).getTime() - reviewInfo.startedAt.getTime()
-      });
-      console.log(`[executor] PR created for task ${taskId}: ${prUrl}`);
-      return { success: true, prUrl };
-    } catch (error) {
-      const errorMsg = error instanceof Error ? error.message : String(error);
-      console.error(`[executor] Failed to create PR:`, errorMsg);
-      return { success: false, error: errorMsg };
-    }
-  }
-  /**
-   * Discard a reviewed task - delete worktree and return to ready
+   * Cancel the running task
    */
-  discardTask(taskId) {
-    const reviewInfo = this.reviewingTasks.get(taskId);
-    if (!reviewInfo) {
-      return { success: false, error: "Task not in review or no worktree found" };
-    }
-    this.removeWorktree(taskId);
-    this.reviewingTasks.delete(taskId);
-    updateTask(this.projectPath, taskId, {
-      status: "ready",
-      passes: false
-    });
-    addExecutionEntry(this.projectPath, taskId, {
-      startedAt: reviewInfo.startedAt.toISOString(),
-      endedAt: (/* @__PURE__ */ new Date()).toISOString(),
-      status: "discarded",
-      duration: (/* @__PURE__ */ new Date()).getTime() - reviewInfo.startedAt.getTime()
-    });
-    console.log(`[executor] Task ${taskId} discarded, returned to ready`);
-    return { success: true };
-  }
-  /**
-   * Get diff for a task in review
-   */
-  getTaskDiff(taskId) {
-    const reviewInfo = this.reviewingTasks.get(taskId);
-    if (!reviewInfo) {
-      return { success: false, error: "Task not in review or no worktree found" };
-    }
-    try {
-      const diff = execSync(`git diff main...${reviewInfo.branchName}`, {
-        cwd: this.projectPath,
-        encoding: "utf-8",
-        maxBuffer: 10 * 1024 * 1024
-        // 10MB buffer for large diffs
-      });
-      return { success: true, diff };
-    } catch (error) {
-      const errorMsg = error instanceof Error ? error.message : String(error);
-      return { success: false, error: errorMsg };
-    }
-  }
-  /**
-   * Get list of changed files for a task in review
-   */
-  getTaskChangedFiles(taskId) {
-    const reviewInfo = this.reviewingTasks.get(taskId);
-    if (!reviewInfo) {
-      return { success: false, error: "Task not in review or no worktree found" };
-    }
-    try {
-      const result = execSync(`git diff --name-only main...${reviewInfo.branchName}`, {
-        cwd: this.projectPath,
-        encoding: "utf-8"
-      });
-      const files = result.trim().split("\n").filter((f) => f);
-      return { success: true, files };
-    } catch (error) {
-      const errorMsg = error instanceof Error ? error.message : String(error);
-      return { success: false, error: errorMsg };
-    }
-  }
-  /**
-   * Cancel a running task
-   */
-  cancelTask(taskId, reason = "Cancelled by user") {
-    const runningTask = this.runningTasks.get(taskId);
-    if (!runningTask) return false;
-    const startedAt = runningTask.startedAt;
+  cancelTask(reason = "Cancelled by user") {
+    if (!this.runningTask) return false;
+    const { taskId, process: childProcess, startedAt } = this.runningTask;
     const endedAt = /* @__PURE__ */ new Date();
     const duration = endedAt.getTime() - startedAt.getTime();
     const task = getTaskById(this.projectPath, taskId);
     try {
-      runningTask.process.kill("SIGTERM");
+      childProcess.kill("SIGTERM");
       setTimeout(() => {
         try {
-          if (!runningTask.process.killed) {
-            runningTask.process.kill("SIGKILL");
+          if (!childProcess.killed) {
+            childProcess.kill("SIGKILL");
           }
         } catch {
         }
       }, 2e3);
     } catch {
     }
-    if (runningTask.worktreePath) {
-      this.removeWorktree(taskId);
-    }
-    updateTask(this.projectPath, taskId, {
-      status: "ready"
-    });
+    updateTask(this.projectPath, taskId, { status: "ready" });
     addExecutionEntry(this.projectPath, taskId, {
       startedAt: startedAt.toISOString(),
       endedAt: endedAt.toISOString(),
@@ -1268,48 +1177,46 @@ Focus only on this task. When successfully complete, output: <promise>COMPLETE</
       error: reason
     });
     this.emit("task:cancelled", { taskId });
-    this.runningTasks.delete(taskId);
+    this.runningTask = null;
     return true;
   }
   /**
-   * Start AFK mode
+   * Start AFK mode - run tasks sequentially until done
    */
-  startAFKMode(maxIterations, concurrent) {
+  startAFKMode(maxIterations) {
     if (this.afkMode) {
       throw new Error("AFK mode already running");
     }
+    if (this.isBusy()) {
+      throw new Error("Cannot start AFK mode while another operation is in progress");
+    }
     this.afkMode = true;
     this.afkIteration = 0;
     this.afkMaxIterations = maxIterations;
     this.afkTasksCompleted = 0;
     this.emitAFKStatus();
-    this.continueAFKMode(concurrent);
+    this.continueAFKMode();
   }
   /**
-   * Continue AFK mode - pick up next tasks
+   * Continue AFK mode - pick next task
    */
-  continueAFKMode(concurrent = 1) {
+  continueAFKMode() {
     if (!this.afkMode) return;
     if (this.afkIteration >= this.afkMaxIterations) {
       this.stopAFKMode();
       return;
     }
-    const config = getConfig(this.projectPath);
-    const maxConcurrent = Math.min(concurrent, config.execution.maxConcurrent || 3);
-    while (this.getRunningCount() < maxConcurrent) {
-      const nextTask = getNextReadyTask(this.projectPath);
-      if (!nextTask) {
-        if (this.getRunningCount() === 0) {
-          this.stopAFKMode();
-        }
-        break;
-      }
-      this.afkIteration++;
-      this.runTask(nextTask.id).catch((error) => {
-        console.error("AFK task error:", error);
-      });
-      this.emitAFKStatus();
+    if (this.isBusy()) return;
+    const nextTask = getNextReadyTask(this.projectPath);
+    if (!nextTask) {
+      this.stopAFKMode();
+      return;
     }
+    this.afkIteration++;
+    this.runTask(nextTask.id).catch((error) => {
+      console.error("AFK task error:", error);
+    });
+    this.emitAFKStatus();
   }
   /**
    * Stop AFK mode
@@ -1341,18 +1248,22 @@ Focus only on this task. When successfully complete, output: <promise>COMPLETE</
     };
   }
   /**
-   * Cancel all running tasks
+   * Cancel running task/planning and stop AFK mode
    */
   cancelAll() {
-    for (const [taskId, runningTask] of this.runningTasks.entries()) {
+    if (this.runningTask) {
       try {
-        runningTask.process.kill("SIGKILL");
+        this.runningTask.process.kill("SIGKILL");
       } catch {
       }
-      if (runningTask.worktreePath) {
-        this.removeWorktree(taskId);
+      this.runningTask = null;
+    }
+    if (this.planningSession) {
+      try {
+        this.planningSession.process.kill("SIGKILL");
+      } catch {
       }
-      this.runningTasks.delete(taskId);
+      this.planningSession = null;
     }
     this.stopAFKMode();
   }
@@ -1778,6 +1689,11 @@ async function createServer(projectPath, port) {
   executor.on("task:failed", (data) => io.emit("task:failed", data));
   executor.on("task:cancelled", (data) => io.emit("task:cancelled", data));
   executor.on("afk:status", (data) => io.emit("afk:status", data));
+  executor.on("planning:started", (data) => io.emit("planning:started", data));
+  executor.on("planning:output", (data) => io.emit("planning:output", data));
+  executor.on("planning:completed", (data) => io.emit("planning:completed", data));
+  executor.on("planning:failed", (data) => io.emit("planning:failed", data));
+  executor.on("planning:cancelled", (data) => io.emit("planning:cancelled", data));
   app.get("/api/tasks", (_req, res) => {
     try {
       const tasks = getAllTasks(projectPath);
@@ -1862,7 +1778,12 @@ async function createServer(projectPath, port) {
   });
   app.post("/api/tasks/:id/cancel", (req, res) => {
     try {
-      const cancelled = executor.cancelTask(req.params.id);
+      const runningId = executor.getRunningTaskId();
+      if (runningId !== req.params.id) {
+        res.status(404).json({ error: "Task not running" });
+        return;
+      }
+      const cancelled = executor.cancelTask();
       if (!cancelled) {
         res.status(404).json({ error: "Task not running" });
         return;
@@ -1891,90 +1812,6 @@ async function createServer(projectPath, port) {
       res.status(500).json({ error: String(error) });
     }
   });
-  app.post("/api/tasks/:id/merge", (req, res) => {
-    try {
-      const result = executor.mergeTask(req.params.id);
-      if (!result.success) {
-        res.status(400).json({ error: result.error });
-        return;
-      }
-      const task = getTaskById(projectPath, req.params.id);
-      if (task) {
-        io.emit("task:updated", task);
-      }
-      res.json({ success: true });
-    } catch (error) {
-      res.status(500).json({ error: String(error) });
-    }
-  });
-  app.post("/api/tasks/:id/create-pr", (req, res) => {
-    try {
-      const result = executor.createPR(req.params.id);
-      if (!result.success) {
-        res.status(400).json({ error: result.error });
-        return;
-      }
-      const task = getTaskById(projectPath, req.params.id);
-      if (task) {
-        io.emit("task:updated", task);
-      }
-      res.json({ success: true, prUrl: result.prUrl });
-    } catch (error) {
-      res.status(500).json({ error: String(error) });
-    }
-  });
-  app.post("/api/tasks/:id/discard", (req, res) => {
-    try {
-      const result = executor.discardTask(req.params.id);
-      if (!result.success) {
-        res.status(400).json({ error: result.error });
-        return;
-      }
-      const task = getTaskById(projectPath, req.params.id);
-      if (task) {
-        io.emit("task:updated", task);
-      }
-      res.json({ success: true });
-    } catch (error) {
-      res.status(500).json({ error: String(error) });
-    }
-  });
-  app.get("/api/tasks/:id/diff", (req, res) => {
-    try {
-      const result = executor.getTaskDiff(req.params.id);
-      if (!result.success) {
-        res.status(400).json({ error: result.error });
-        return;
-      }
-      res.json({ diff: result.diff });
-    } catch (error) {
-      res.status(500).json({ error: String(error) });
-    }
-  });
-  app.get("/api/tasks/:id/changed-files", (req, res) => {
-    try {
-      const result = executor.getTaskChangedFiles(req.params.id);
-      if (!result.success) {
-        res.status(400).json({ error: result.error });
-        return;
-      }
-      res.json({ files: result.files });
-    } catch (error) {
-      res.status(500).json({ error: String(error) });
-    }
-  });
-  app.get("/api/tasks/:id/review-info", (req, res) => {
-    try {
-      const info = executor.getReviewingTask(req.params.id);
-      if (!info) {
-        res.status(404).json({ error: "Task not in review" });
-        return;
-      }
-      res.json(info);
-    } catch (error) {
-      res.status(500).json({ error: String(error) });
-    }
-  });
   app.get("/api/tasks/:id/logs", (req, res) => {
     try {
       const logs = executor.getTaskLog(req.params.id);
@@ -2048,8 +1885,8 @@ async function createServer(projectPath, port) {
   });
   app.post("/api/afk/start", (req, res) => {
     try {
-      const { maxIterations, concurrent } = req.body;
-      executor.startAFKMode(maxIterations || 10, concurrent || 1);
+      const { maxIterations } = req.body;
+      executor.startAFKMode(maxIterations || 10);
       res.json({ success: true, status: executor.getAFKStatus() });
     } catch (error) {
       res.status(400).json({ error: String(error) });
@@ -2071,10 +1908,44 @@ async function createServer(projectPath, port) {
       res.status(500).json({ error: String(error) });
     }
   });
+  app.post("/api/plan", async (req, res) => {
+    try {
+      const { goal } = req.body;
+      if (!goal) {
+        res.status(400).json({ error: "Goal is required" });
+        return;
+      }
+      await executor.runPlanningSession(goal);
+      res.json({ success: true });
+    } catch (error) {
+      res.status(400).json({ error: String(error) });
+    }
+  });
+  app.post("/api/plan/cancel", (_req, res) => {
+    try {
+      const cancelled = executor.cancelPlanning();
+      if (!cancelled) {
+        res.status(404).json({ error: "No planning session running" });
+        return;
+      }
+      res.json({ success: true });
+    } catch (error) {
+      res.status(500).json({ error: String(error) });
+    }
+  });
+  app.get("/api/plan/status", (_req, res) => {
+    try {
+      const planning = executor.isPlanning();
+      const goal = executor.getPlanningGoal();
+      res.json({ planning, goal: goal || null });
+    } catch (error) {
+      res.status(500).json({ error: String(error) });
+    }
+  });
   app.get("/api/running", (_req, res) => {
     try {
-      const taskIds = executor.getRunningTaskIds();
-      res.json({ running: taskIds, count: taskIds.length });
+      const taskId = executor.getRunningTaskId();
+      res.json({ running: taskId ? [taskId] : [], count: taskId ? 1 : 0 });
     } catch (error) {
       res.status(500).json({ error: String(error) });
     }
@@ -2082,9 +1953,10 @@ async function createServer(projectPath, port) {
   app.get("/api/stats", (_req, res) => {
     try {
       const counts = getTaskCounts(projectPath);
-      const running = executor.getRunningCount();
+      const running = executor.isRunning() ? 1 : 0;
       const afk = executor.getAFKStatus();
-      res.json({ counts, running, afk });
+      const planning = executor.isPlanning();
+      res.json({ counts, running, afk, planning });
     } catch (error) {
       res.status(500).json({ error: String(error) });
     }
@@ -2098,20 +1970,24 @@ async function createServer(projectPath, port) {
   });
   io.on("connection", (socket) => {
     console.log("Client connected");
-    const runningIds = executor.getRunningTaskIds();
+    const runningId = executor.getRunningTaskId();
+    const runningIds = runningId ? [runningId] : [];
     const taskLogs = {};
-    for (const taskId of runningIds) {
-      const logs = executor.getTaskLog(taskId);
+    if (runningId) {
+      const logs = executor.getTaskLog(runningId);
       if (logs) {
-        taskLogs[taskId] = logs;
+        taskLogs[runningId] = logs;
       }
     }
     socket.emit("init", {
       tasks: getAllTasks(projectPath),
       running: runningIds,
       afk: executor.getAFKStatus(),
-      taskLogs
-      // Include logs for running tasks
+      taskLogs,
+      // Include logs for running task
+      planning: executor.isPlanning(),
+      planningGoal: executor.getPlanningGoal() || null,
+      planningOutput: executor.getPlanningOutput() || []
     });
     socket.on("get-logs", (taskId) => {
       const logs = executor.getTaskLog(taskId);
@@ -2284,7 +2160,6 @@ function getClientHTML() {
     .status-dot-draft { background: #a3a3a3; }
     .status-dot-ready { background: #3b82f6; }
     .status-dot-in_progress { background: #f97316; }
-    .status-dot-in_review { background: #8b5cf6; }
     .status-dot-completed { background: #22c55e; }
     .status-dot-failed { background: #ef4444; }
 
@@ -2342,7 +2217,7 @@ function getClientHTML() {
       transition: all 0.2s var(--ease-out-expo);
     }
     .side-panel-header {
-      padding: 16px 20px;
+      padding: 12px 16px;
       border-bottom: 1px solid #e5e5e5;
       flex-shrink: 0;
     }
@@ -2360,7 +2235,8 @@ function getClientHTML() {
       flex-shrink: 0;
     }
     .side-panel-tab {
-      padding: 12px 16px;
+      padding: 10px 14px;
+      font-size: 13px;
       color: #737373;
       cursor: pointer;
       border-bottom: 2px solid transparent;
@@ -2494,7 +2370,6 @@ function getClientHTML() {
     .status-badge-draft { background: #f5f5f5; color: #737373; }
     .status-badge-ready { background: #eff6ff; color: #3b82f6; }
     .status-badge-in_progress { background: #fff7ed; color: #f97316; }
-    .status-badge-in_review { background: #f5f3ff; color: #8b5cf6; }
     .status-badge-completed { background: #f0fdf4; color: #22c55e; }
     .status-badge-failed { background: #fef2f2; color: #ef4444; }
 
@@ -2654,6 +2529,10 @@ let state = {
   logFullscreen: false,
   closedTabs: new Set(),
   sidePanel: null, // task id for side panel
+  // Planning state
+  planning: false,
+  planningGoal: '',
+  planningOutput: [],
   sidePanelTab: 'logs', // 'logs' or 'details'
   darkMode: localStorage.getItem('darkMode') === 'true', // Add dark mode state
 };
@@ -2748,6 +2627,14 @@ socket.on('init', (data) => {
   state.running = data.running;
   state.afk = data.afk;
 
+  // Planning state
+  state.planning = data.planning || false;
+  state.planningGoal = data.planningGoal || '';
+  state.planningOutput = (data.planningOutput || []).map(text => ({
+    text: text,
+    timestamp: new Date().toISOString()
+  }));
+
   // Load persisted logs for running tasks
   if (data.taskLogs) {
     for (const [taskId, logs] of Object.entries(data.taskLogs)) {
@@ -2820,16 +2707,14 @@ socket.on('task:output', ({ taskId, line }) => {
   }
 });
 
-socket.on('task:completed', ({ taskId, status }) => {
+socket.on('task:completed', ({ taskId }) => {
   state.running = state.running.filter(id => id !== taskId);
   const task = state.tasks.find(t => t.id === taskId);
   if (task) {
-    // Use status from server (could be 'in_review' or 'completed')
-    task.status = status || 'in_review';
+    task.status = 'completed';
     task.passes = true;
   }
-  const statusMsg = (status === 'in_review') ? 'ready for review' : 'completed';
-  showToast('Task ' + statusMsg + ': ' + (task?.title || taskId), 'success');
+  showToast('Task completed: ' + (task?.title || taskId), 'success');
   render();
 });
 
@@ -2854,6 +2739,48 @@ socket.on('afk:status', (status) => {
   render();
 });
 
+// Planning socket handlers
+socket.on('planning:started', ({ goal, timestamp }) => {
+  state.planning = true;
+  state.planningGoal = goal;
+  state.planningOutput = [];
+  state.showModal = 'planning';
+  showToast('Planning started: ' + goal.substring(0, 50) + (goal.length > 50 ? '...' : ''), 'info');
+  render();
+});
+
+socket.on('planning:output', ({ line }) => {
+  state.planningOutput.push({
+    text: line,
+    timestamp: new Date().toISOString()
+  });
+  render();
+});
+
+socket.on('planning:completed', () => {
+  state.planning = false;
+  showToast('Planning complete! New tasks added to board.', 'success');
+  // Refresh tasks from server
+  fetch('/api/tasks').then(r => r.json()).then(data => {
+    state.tasks = data.tasks;
+    state.showModal = null;
+    render();
+  });
+});
+
+socket.on('planning:failed', ({ error }) => {
+  state.planning = false;
+  showToast('Planning failed: ' + error, 'error');
+  render();
+});
+
+socket.on('planning:cancelled', () => {
+  state.planning = false;
+  state.showModal = null;
+  showToast('Planning cancelled', 'warning');
+  render();
+});
+
 // Load templates
 fetch('/api/templates').then(r => r.json()).then(data => {
   state.templates = data.templates;
@@ -2903,53 +2830,6 @@ async function retryTask(id) {
   });
 }
 
-async function mergeTask(id) {
-  const res = await fetch('/api/tasks/' + id + '/merge', { method: 'POST' });
-  const data = await res.json();
-  if (!res.ok) {
-    throw new Error(data.error || 'Merge failed');
-  }
-  return data;
-}
-
-async function createPR(id) {
-  const res = await fetch('/api/tasks/' + id + '/create-pr', { method: 'POST' });
-  const data = await res.json();
-  if (!res.ok) {
-    throw new Error(data.error || 'PR creation failed');
-  }
-  return data;
-}
-
-async function discardTask(id) {
-  const res = await fetch('/api/tasks/' + id + '/discard', { method: 'POST' });
-  const data = await res.json();
-  if (!res.ok) {
-    throw new Error(data.error || 'Discard failed');
-  }
-  return data;
-}
-
-async function getReviewInfo(id) {
-  const res = await fetch('/api/tasks/' + id + '/review-info');
-  const data = await res.json();
-  if (!res.ok) {
-    throw new Error(data.error || 'Failed to get review info');
-  }
-  return data;
-}
-
-async function openInVSCode(id) {
-  try {
-    const info = await getReviewInfo(id);
-    // Open VS Code at the worktree path
-    window.open('vscode://file/' + encodeURIComponent(info.worktreePath), '_blank');
-    showToast('Opening in VS Code...', 'info');
-  } catch (e) {
-    showToast('Failed to open in VS Code: ' + e.message, 'error');
-  }
-}
-
 async function generateTask(prompt) {
   state.aiGenerating = true;
   render();
@@ -2968,11 +2848,11 @@ async function generateTask(prompt) {
   }
 }
 
-async function startAFK(maxIterations, concurrent) {
+async function startAFK(maxIterations) {
   await fetch('/api/afk/start', {
     method: 'POST',
     headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify({ maxIterations, concurrent })
+    body: JSON.stringify({ maxIterations })
   });
 }
 
@@ -2980,6 +2860,18 @@ async function stopAFK() {
   await fetch('/api/afk/stop', { method: 'POST' });
 }
 
+async function startPlanning(goal) {
+  await fetch('/api/plan', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ goal })
+  });
+}
+
+async function cancelPlanning() {
+  await fetch('/api/plan/cancel', { method: 'POST' });
+}
+
 // Enhanced Drag and drop
 let draggedTask = null;
 let draggedElement = null;
@@ -3124,6 +3016,11 @@ function openSidePanel(taskId) {
   state.activeTab = taskId;
   state.closedTabs.delete(taskId);
 
+  // Auto-switch to logs tab if task is running
+  if (state.running.includes(taskId)) {
+    state.sidePanelTab = 'logs';
+  }
+
   // Request logs from server if not already loaded
   if (!state.taskOutput[taskId] || state.taskOutput[taskId].length === 0) {
     socket.emit('get-logs', taskId);
@@ -3153,7 +3050,6 @@ function renderColumn(status, title, tasks) {
     draft: 'To Do',
     ready: 'Ready',
     in_progress: 'In Progress',
-    in_review: 'In Review',
     completed: 'Done',
     failed: 'Failed'
   };
@@ -3406,21 +3302,13 @@ function renderModal() {
             <button onclick="state.showModal = null; render();" class="btn btn-ghost p-1.5 text-canvas-500 hover:text-canvas-700">\u2715</button>
           </div>
           <div class="p-6">
-            <p class="text-sm text-canvas-600 mb-5">Run the agent in a loop, automatically picking up tasks from the "Ready" column until complete.</p>
+            <p class="text-sm text-canvas-600 mb-5">Run the agent in a loop, automatically picking up tasks from the "Ready" column one at a time until complete.</p>
             <div class="space-y-4">
               <div>
                 <label class="block text-sm font-medium text-canvas-700 mb-2">Maximum Iterations</label>
                 <input type="number" id="afk-iterations" value="10" min="1" max="100"
                        class="input w-full">
               </div>
-              <div>
-                <label class="block text-sm font-medium text-canvas-700 mb-2">Concurrent Tasks</label>
-                <select id="afk-concurrent" class="input w-full">
-                  <option value="1">1 (Sequential)</option>
-                  <option value="2">2</option>
-                  <option value="3">3 (Max)</option>
-                </select>
-              </div>
               <div class="bg-status-running/10 border border-status-running/20 rounded-lg p-3">
                 <p class="text-xs text-status-running">\u26A0\uFE0F You can close this tab - the agent will continue running. Check back later or watch the terminal output.</p>
               </div>
@@ -3437,6 +3325,71 @@ function renderModal() {
     \`;
   }
 
+  // Planning input modal
+  if (state.showModal === 'plan-input') {
+    return \`
+      <div class="modal-backdrop fixed inset-0 flex items-center justify-center z-50" onclick="if(event.target === event.currentTarget) { state.showModal = null; render(); }">
+        <div class="modal-content card rounded-xl w-full max-w-lg mx-4">
+          <div class="px-6 py-4 border-b border-white/5 flex justify-between items-center">
+            <h3 class="font-display font-semibold text-canvas-800 text-lg">\u{1F3AF} AI Task Planner</h3>
+            <button onclick="state.showModal = null; render();" class="btn btn-ghost p-1.5 text-canvas-500 hover:text-canvas-700">\u2715</button>
+          </div>
+          <div class="p-6">
+            <p class="text-sm text-canvas-600 mb-4">Describe your goal and the AI will analyze the codebase and break it down into concrete tasks.</p>
+            <div class="space-y-4">
+              <div>
+                <label class="block text-sm font-medium text-canvas-700 mb-2">What do you want to build?</label>
+                <textarea id="planning-goal" rows="4" placeholder="e.g., Add user authentication with JWT tokens, login/logout functionality, and protected routes..."
+                          class="input w-full resize-none"></textarea>
+              </div>
+              <div class="bg-blue-50 border border-blue-200 rounded-lg p-3">
+                <p class="text-xs text-blue-700">\u{1F4A1} Be specific about what you want. The AI will explore your codebase and create 3-8 tasks with implementation guidance.</p>
+              </div>
+            </div>
+            <div class="flex justify-end gap-3 mt-6">
+              <button onclick="state.showModal = null; render();"
+                      class="btn btn-ghost px-4 py-2.5">Cancel</button>
+              <button onclick="handleStartPlanning()"
+                      class="btn px-5 py-2.5 bg-blue-500 hover:bg-blue-600 text-white font-medium">\u{1F680} Start Planning</button>
+            </div>
+          </div>
+        </div>
+      </div>
+    \`;
+  }
+
+  // Planning progress modal
+  if (state.showModal === 'planning') {
+    const outputHtml = state.planningOutput.length > 0
+      ? state.planningOutput.map(l => \`<div class="log-line">\${highlightLog(l.text || l)}</div>\`).join('')
+      : '<div class="text-canvas-400 text-sm">Analyzing codebase and generating tasks...</div>';
+
+    return \`
+      <div class="modal-backdrop fixed inset-0 flex items-center justify-center z-50">
+        <div class="modal-content card rounded-xl w-full max-w-3xl mx-4 max-h-[80vh] flex flex-col">
+          <div class="px-6 py-4 border-b border-white/5 flex justify-between items-center flex-shrink-0">
+            <div class="flex items-center gap-3">
+              <span class="text-xl animate-pulse">\u{1F3AF}</span>
+              <div>
+                <h3 class="font-display font-semibold text-canvas-800 text-lg">Planning in Progress</h3>
+                <p class="text-xs text-canvas-500 truncate max-w-[400px]">\${escapeHtml(state.planningGoal)}</p>
+              </div>
+            </div>
+            <button onclick="if(confirm('Cancel planning?')) cancelPlanning();"
+                    class="btn btn-ghost px-3 py-1.5 text-sm text-status-failed hover:bg-status-failed/10">
+              \u23F9 Cancel
+            </button>
+          </div>
+          <div class="flex-1 overflow-hidden p-4">
+            <div class="log-container h-full overflow-y-auto" id="planning-log">
+              \${outputHtml}
+            </div>
+          </div>
+        </div>
+      </div>
+    \`;
+  }
+
   return '';
 }
 
@@ -3450,114 +3403,55 @@ function renderSidePanel() {
   const output = state.taskOutput[task.id] || [];
   const startTime = state.taskStartTime[task.id];
   const lastExec = task.executionHistory?.[task.executionHistory.length - 1];
+  const elapsed = isRunning && startTime ? formatElapsed(startTime) : null;
 
   return \`
     <div class="side-panel">
-      <!-- Header -->
-      <div class="side-panel-header">
-        <div class="flex justify-between items-start">
-          <div class="flex-1 pr-4">
-            <h2 class="font-semibold text-canvas-900 text-lg leading-tight">\${escapeHtml(task.title)}</h2>
-            <div class="flex items-center gap-2 mt-2">
-              <span class="status-badge status-badge-\${task.status}">
+      <!-- Compact Header -->
+      <div class="side-panel-header" style="padding: 12px 16px;">
+        <div class="flex justify-between items-start gap-2">
+          <div class="flex-1 min-w-0">
+            <h2 class="font-semibold text-canvas-900 text-base leading-tight truncate" title="\${escapeHtml(task.title)}">\${escapeHtml(task.title)}</h2>
+            <div class="flex items-center gap-2 mt-1.5 flex-wrap">
+              <span class="status-badge status-badge-\${task.status}" style="font-size: 11px; padding: 2px 8px;">
                 <span class="w-1.5 h-1.5 rounded-full bg-current \${isRunning ? 'animate-pulse' : ''}"></span>
                 \${task.status.replace('_', ' ')}
               </span>
+              \${elapsed ? \`<span class="text-xs text-canvas-500">\u23F1 \${elapsed}</span>\` : ''}
+              <span class="text-xs text-canvas-400">\${task.priority} \xB7 \${task.category}</span>
             </div>
           </div>
-          <div class="flex items-center gap-1">
+          <div class="flex items-center gap-0.5 flex-shrink-0">
+            \${task.status === 'in_progress' ? \`
+              <button onclick="cancelTask('\${task.id}')" class="btn btn-ghost p-1.5 text-status-failed hover:bg-status-failed/10" title="Stop">
+                \u23F9
+              </button>
+            \` : task.status === 'ready' ? \`
+              <button onclick="runTask('\${task.id}')" class="btn btn-ghost p-1.5 text-status-success hover:bg-status-success/10" title="Run">
+                \u25B6
+              </button>
+            \` : task.status === 'draft' ? \`
+              <button onclick="updateTask('\${task.id}', { status: 'ready' })" class="btn btn-ghost p-1.5 text-blue-500 hover:bg-blue-50" title="Move to Ready">
+                \u2192
+              </button>
+            \` : task.status === 'failed' ? \`
+              <button onclick="retryTask('\${task.id}')" class="btn btn-ghost p-1.5 text-canvas-500 hover:bg-canvas-100" title="Retry">
+                \u21BB
+              </button>
+            \` : ''}
             <button onclick="state.editingTask = state.tasks.find(t => t.id === '\${task.id}'); state.showModal = 'edit'; render();"
-                    class="btn btn-ghost p-2 text-canvas-500 hover:text-canvas-700" title="Edit">
+                    class="btn btn-ghost p-1.5 text-canvas-400 hover:text-canvas-600" title="Edit">
               \u270F\uFE0F
             </button>
-            <button onclick="if(confirm('Delete this task?')) { deleteTask('\${task.id}'); closeSidePanel(); }"
-                    class="btn btn-ghost p-2 text-canvas-500 hover:text-status-failed" title="Delete">
-              \u{1F5D1}\uFE0F
-            </button>
-            <button onclick="closeSidePanel()" class="btn btn-ghost p-2 text-canvas-500 hover:text-canvas-700" title="Close">
+            <button onclick="closeSidePanel()" class="btn btn-ghost p-1.5 text-canvas-400 hover:text-canvas-600" title="Close">
               \u2715
             </button>
           </div>
         </div>
       </div>
 
-      <!-- Description -->
-      <div class="px-5 py-4 border-b border-canvas-200 flex-shrink-0">
-        <p class="text-sm text-canvas-600 leading-relaxed">\${escapeHtml(task.description)}</p>
-        \${task.steps && task.steps.length > 0 ? \`
-          <div class="mt-3">
-            <div class="text-xs font-medium text-canvas-500 mb-2">Steps:</div>
-            <ul class="text-sm text-canvas-600 space-y-1">
-              \${task.steps.map(s => \`<li class="flex gap-2"><span class="text-canvas-400">\u2022</span>\${escapeHtml(s)}</li>\`).join('')}
-            </ul>
-          </div>
-        \` : ''}
-      </div>
-
-      <!-- Task Details Grid -->
-      <div class="details-grid">
-        <div class="details-item">
-          <span class="details-label">Priority</span>
-          <span class="details-value capitalize">\${task.priority}</span>
-        </div>
-        <div class="details-item">
-          <span class="details-label">Category</span>
-          <span class="details-value">\${categoryIcons[task.category] || ''} \${task.category}</span>
-        </div>
-        \${startTime || lastExec ? \`
-          <div class="details-item">
-            <span class="details-label">Started</span>
-            <span class="details-value">\${new Date(startTime || lastExec?.startedAt).toLocaleString()}</span>
-          </div>
-        \` : ''}
-        \${lastExec?.duration ? \`
-          <div class="details-item">
-            <span class="details-label">Duration</span>
-            <span class="details-value">\${Math.round(lastExec.duration / 1000)}s</span>
-          </div>
-        \` : ''}
-      </div>
-
-      <!-- Action Buttons -->
-      <div class="px-5 py-4 border-b border-canvas-200 flex flex-wrap gap-2 flex-shrink-0">
-        \${task.status === 'draft' ? \`
-          <button onclick="updateTask('\${task.id}', { status: 'ready' })" class="btn btn-primary px-4 py-2 text-sm">
-            \u2192 Move to Ready
-          </button>
-        \` : ''}
-        \${task.status === 'ready' ? \`
-          <button onclick="runTask('\${task.id}')" class="btn btn-primary px-4 py-2 text-sm">
-            \u25B6 Run Task
-          </button>
-        \` : ''}
-        \${task.status === 'in_progress' ? \`
-          <button onclick="cancelTask('\${task.id}')" class="btn btn-danger px-4 py-2 text-sm">
-            \u23F9 Stop Attempt
-          </button>
-        \` : ''}
-        \${task.status === 'in_review' ? \`
-          <button onclick="handleMerge('\${task.id}')" class="btn btn-primary px-4 py-2 text-sm">
-            \u2713 Merge
-          </button>
-          <button onclick="handleCreatePR('\${task.id}')" class="btn btn-ghost px-4 py-2 text-sm">
-            \u21E1 Create PR
-          </button>
-          <button onclick="openInVSCode('\${task.id}')" class="btn btn-ghost px-4 py-2 text-sm">
-            \u{1F4C2} Open in VS Code
-          </button>
-          <button onclick="handleDiscard('\${task.id}')" class="btn btn-danger px-4 py-2 text-sm">
-            \u2715 Discard
-          </button>
-        \` : ''}
-        \${task.status === 'failed' ? \`
-          <button onclick="retryTask('\${task.id}')" class="btn btn-primary px-4 py-2 text-sm">
-            \u21BB Retry
-          </button>
-        \` : ''}
-      </div>
-
-      <!-- Tabs -->
-      <div class="side-panel-tabs">
+      <!-- Tabs (moved up, right after header) -->
+      <div class="side-panel-tabs" style="padding: 0 12px;">
         <div class="side-panel-tab \${state.sidePanelTab === 'logs' ? 'active' : ''}" onclick="state.sidePanelTab = 'logs'; render();">
           \u{1F4CB} Logs
         </div>
@@ -3567,9 +3461,9 @@ function renderSidePanel() {
       </div>
 
       <!-- Tab Content -->
-      <div class="side-panel-body">
+      <div class="side-panel-body" style="flex: 1; overflow: hidden; display: flex; flex-direction: column;">
         \${state.sidePanelTab === 'logs' ? \`
-          <div class="log-container" id="side-panel-log">
+          <div class="log-container" id="side-panel-log" style="flex: 1; overflow-y: auto;">
             \${output.length > 0
               ? output.map((l, i) => {
                   const text = l.text || l;
@@ -3579,34 +3473,62 @@ function renderSidePanel() {
             }
           </div>
         \` : \`
-          <div class="p-5">
-            <div class="text-sm text-canvas-600">
-              <div class="mb-4">
-                <div class="text-xs font-medium text-canvas-500 mb-1">Created</div>
-                <div>\${new Date(task.createdAt).toLocaleString()}</div>
+          <div style="flex: 1; overflow-y: auto; padding: 16px;">
+            <!-- Description -->
+            <div class="mb-5">
+              <div class="text-xs font-semibold text-canvas-500 uppercase tracking-wide mb-2">Description</div>
+              <div class="text-sm text-canvas-700 leading-relaxed bg-canvas-50 rounded-lg p-3 border border-canvas-200">
+                \${escapeHtml(task.description || 'No description provided.')}
               </div>
-              <div class="mb-4">
-                <div class="text-xs font-medium text-canvas-500 mb-1">Last Updated</div>
-                <div>\${new Date(task.updatedAt).toLocaleString()}</div>
+            </div>
+
+            <!-- Steps -->
+            \${task.steps && task.steps.length > 0 ? \`
+              <div class="mb-5">
+                <div class="text-xs font-semibold text-canvas-500 uppercase tracking-wide mb-2">Steps (\${task.steps.length})</div>
+                <div class="bg-canvas-50 rounded-lg border border-canvas-200 divide-y divide-canvas-200">
+                  \${task.steps.map((step, i) => \`
+                    <div class="flex gap-3 p-3 text-sm">
+                      <span class="flex-shrink-0 w-5 h-5 rounded-full bg-canvas-200 text-canvas-500 flex items-center justify-center text-xs font-medium">\${i + 1}</span>
+                      <span class="text-canvas-700">\${escapeHtml(step)}</span>
+                    </div>
+                  \`).join('')}
+                </div>
               </div>
-              \${task.executionHistory && task.executionHistory.length > 0 ? \`
-                <div>
-                  <div class="text-xs font-medium text-canvas-500 mb-2">Execution History</div>
-                  <div class="space-y-2">
-                    \${task.executionHistory.slice(-5).reverse().map(exec => \`
-                      <div class="bg-canvas-100 rounded p-2 text-xs">
-                        <div class="flex justify-between">
-                          <span class="\${exec.status === 'completed' ? 'text-status-success' : 'text-status-failed'}">\${exec.status}</span>
-                          <span class="text-canvas-500">\${Math.round(exec.duration / 1000)}s</span>
-                        </div>
-                        <div class="text-canvas-500 mt-1">\${new Date(exec.startedAt).toLocaleString()}</div>
-                        \${exec.error ? \`<div class="text-status-failed mt-1">\${escapeHtml(exec.error)}</div>\` : ''}
+            \` : ''}
+
+            <!-- Metadata -->
+            <div class="mb-5 grid grid-cols-2 gap-3">
+              <div class="bg-canvas-50 rounded-lg p-3 border border-canvas-200">
+                <div class="text-xs text-canvas-500 mb-1">Created</div>
+                <div class="text-sm text-canvas-700">\${new Date(task.createdAt).toLocaleDateString()}</div>
+              </div>
+              <div class="bg-canvas-50 rounded-lg p-3 border border-canvas-200">
+                <div class="text-xs text-canvas-500 mb-1">Updated</div>
+                <div class="text-sm text-canvas-700">\${new Date(task.updatedAt).toLocaleDateString()}</div>
+              </div>
+            </div>
+
+            <!-- Execution History -->
+            \${task.executionHistory && task.executionHistory.length > 0 ? \`
+              <div>
+                <div class="text-xs font-semibold text-canvas-500 uppercase tracking-wide mb-2">Execution History</div>
+                <div class="space-y-2">
+                  \${task.executionHistory.slice(-5).reverse().map(exec => \`
+                    <div class="bg-canvas-50 rounded-lg p-3 border border-canvas-200">
+                      <div class="flex justify-between items-center">
+                        <span class="text-sm font-medium \${exec.status === 'completed' ? 'text-status-success' : 'text-status-failed'}">
+                          \${exec.status === 'completed' ? '\u2713' : '\u2717'} \${exec.status}
+                        </span>
+                        <span class="text-xs text-canvas-500">\${Math.round(exec.duration / 1000)}s</span>
                       </div>
-                    \`).join('')}
-                  </div>
+                      <div class="text-xs text-canvas-500 mt-1">\${new Date(exec.startedAt).toLocaleString()}</div>
+                      \${exec.error ? \`<div class="text-xs text-status-failed mt-2 bg-status-failed/5 rounded p-2">\${escapeHtml(exec.error)}</div>\` : ''}
+                    </div>
+                  \`).join('')}
                 </div>
-              \` : ''}
-            </div>
+              </div>
+            \` : ''}
           </div>
         \`}
       </div>
@@ -3743,45 +3665,28 @@ function applyTemplate(templateId) {
 
 function handleStartAFK() {
   const iterations = parseInt(document.getElementById('afk-iterations').value) || 10;
-  const concurrent = parseInt(document.getElementById('afk-concurrent').value) || 1;
-  startAFK(iterations, concurrent);
+  startAFK(iterations);
   state.showModal = null;
   render();
 }
 
-async function handleMerge(taskId) {
-  if (!confirm('Merge this task into the main branch?')) return;
-  try {
-    await mergeTask(taskId);
-    showToast('Task merged successfully!', 'success');
-    closeSidePanel();
-  } catch (e) {
-    showToast('Merge failed: ' + e.message, 'error');
+async function handleStartPlanning() {
+  const goal = document.getElementById('planning-goal').value;
+  if (!goal.trim()) {
+    showToast('Please enter a goal', 'warning');
+    return;
   }
-}
-
-async function handleCreatePR(taskId) {
   try {
-    const result = await createPR(taskId);
-    showToast('PR created successfully!', 'success');
-    if (result.prUrl) {
-      window.open(result.prUrl, '_blank');
-    }
-    closeSidePanel();
+    await startPlanning(goal);
+    // Modal will be shown when planning:started event is received
   } catch (e) {
-    showToast('PR creation failed: ' + e.message, 'error');
+    showToast('Failed to start planning: ' + e.message, 'error');
   }
 }
 
-async function handleDiscard(taskId) {
-  if (!confirm('Discard this work? The task will return to Ready status.')) return;
-  try {
-    await discardTask(taskId);
-    showToast('Task discarded, returned to Ready', 'warning');
-    closeSidePanel();
-  } catch (e) {
-    showToast('Discard failed: ' + e.message, 'error');
-  }
+function openPlanningModal() {
+  state.showModal = 'plan-input';
+  render();
 }
 
 // Filter tasks based on search query
@@ -3822,6 +3727,12 @@ function render() {
             </div>
           </div>
           <div class="flex items-center gap-2">
+            <button onclick="openPlanningModal();"
+                    class="btn px-4 py-2 text-sm bg-blue-500 hover:bg-blue-600 text-white \${state.planning ? 'opacity-50 cursor-not-allowed' : ''}"
+                    \${state.planning ? 'disabled' : ''}
+                    title="AI Task Planner">
+              \u{1F3AF} \${state.planning ? 'Planning...' : 'Plan'}
+            </button>
             <button onclick="state.showModal = 'new'; render();"
                     class="btn btn-primary px-4 py-2 text-sm">
               + Add Task
@@ -3845,7 +3756,6 @@ function render() {
             \${renderColumn('draft', 'To Do', filterTasks(state.tasks))}
             \${renderColumn('ready', 'Ready', filterTasks(state.tasks))}
             \${renderColumn('in_progress', 'In Progress', filterTasks(state.tasks))}
-            \${renderColumn('in_review', 'In Review', filterTasks(state.tasks))}
             \${renderColumn('completed', 'Done', filterTasks(state.tasks))}
             \${renderColumn('failed', 'Failed', filterTasks(state.tasks))}
           </div>
@@ -3889,6 +3799,10 @@ window.retryTask = retryTask;
 window.generateTask = generateTask;
 window.startAFK = startAFK;
 window.stopAFK = stopAFK;
+window.startPlanning = startPlanning;
+window.cancelPlanning = cancelPlanning;
+window.handleStartPlanning = handleStartPlanning;
+window.openPlanningModal = openPlanningModal;
 window.handleDragStart = handleDragStart;
 window.handleDragEnd = handleDragEnd;
 window.handleDragOver = handleDragOver;
@@ -3910,14 +3824,6 @@ window.closeSidePanel = closeSidePanel;
 window.showTaskMenu = showTaskMenu;
 window.filterTasks = filterTasks;
 window.scrollSidePanelLog = scrollSidePanelLog;
-window.mergeTask = mergeTask;
-window.createPR = createPR;
-window.discardTask = discardTask;
-window.handleMerge = handleMerge;
-window.handleCreatePR = handleCreatePR;
-window.handleDiscard = handleDiscard;
-window.openInVSCode = openInVSCode;
-window.getReviewInfo = getReviewInfo;
 
 // Keyboard shortcuts
 document.addEventListener('keydown', (e) => {
@@ -3997,7 +3903,7 @@ function isGitRepo(dir) {
 }
 function hasGitRemote(dir) {
   try {
-    const result = execSync2("git remote -v", { cwd: dir, stdio: "pipe" }).toString();
+    const result = execSync("git remote -v", { cwd: dir, stdio: "pipe" }).toString();
     return result.trim().length > 0;
   } catch {
     return false;
@@ -4005,7 +3911,7 @@ function hasGitRemote(dir) {
 }
 function detectRemoteType(dir) {
   try {
-    const result = execSync2("git remote get-url origin", { cwd: dir, stdio: "pipe" }).toString().toLowerCase();
+    const result = execSync("git remote get-url origin", { cwd: dir, stdio: "pipe" }).toString().toLowerCase();
     if (result.includes("github.com")) return "github";
     if (result.includes("gitlab.com") || result.includes("gitlab")) return "gitlab";
     if (result.includes("bitbucket.org") || result.includes("bitbucket")) return "bitbucket";
@@ -4016,10 +3922,10 @@ function detectRemoteType(dir) {
   }
 }
 function initializeGit(dir) {
-  execSync2("git init", { cwd: dir, stdio: "pipe" });
+  execSync("git init", { cwd: dir, stdio: "pipe" });
   try {
-    execSync2("git add -A", { cwd: dir, stdio: "pipe" });
-    execSync2('git commit -m "Initial commit"', { cwd: dir, stdio: "pipe" });
+    execSync("git add -A", { cwd: dir, stdio: "pipe" });
+    execSync('git commit -m "Initial commit"', { cwd: dir, stdio: "pipe" });
   } catch {
   }
 }