claude-task-viewer

by L1AD

Pending

A web-based Kanban board for viewing Claude Code tasks

181stars
21forks
HTML
Added 1/25/2026
CLI Toolsanthropicclaudeclaude-codeclideveloper-toolskanbannodejstask-management
Installation
# Add to your Claude Code skills
git clone https://github.com/L1AD/claude-task-viewer
README.md

Claude Task Viewer

A real-time Kanban board for observing Claude Code tasks. See what Claude is working on, track dependencies between tasks, and manage task cleanup and priority.

Dark mode

Light mode

Why Use This?

When Claude Code breaks down complex work into tasks, you get visibility into its thinking — but only in the terminal. Claude Task Viewer gives you a persistent, visual dashboard to:

  • See the big picture — All your sessions and tasks in one place
  • Know what's happening now — Live Updates show exactly what Claude is doing across all sessions
  • Understand task dependencies — See which tasks are blocked and what's holding them up
  • Clean up completed work — Delete tasks when no longer needed (with dependency checking)

Key Features

Observation-Focused Design

Claude Code controls task state — the viewer shows you what's happening:

  • Real-time status — See tasks move through Pending → In Progress → Completed as Claude works
  • Active session detection — Indicators show which sessions have in-progress tasks
  • Task dependencies — Visualise blockedBy/blocks relationships to understand the critical path
  • Live activity feed — Real-time stream of all in-progress tasks across every session

Cleanup Operations

  • Delete tasks — Remove tasks with the delete button or press D (includes safety checks for dependencies)
  • Bulk delete — Delete all tasks in a session at once

Session Management

View and organize your Claude Code sessions:

  • Session discovery — Automatically finds all sessions in ~/.claude/tasks/ and ~/.claude/projects/
  • View project paths — See the full filesystem path for each project
  • Fuzzy search — Search across session names, task descriptions, and project paths with instant filtering
  • Session limits — Filter to show only active sessions or a specific number of recent sessions

Keyboard Shortcuts

  • ? — Show help with all keyboard shortcuts
  • D — Delete the currently selected task (with confirmation and dependency checking)
  • Esc — Close detail panel or modals

Installation

Quick start

npx claude-task-viewer

Open http://localhost:3456

From source

git clone https://github.com/L1AD/claude-task-viewer.git
cd claude-task-viewer
npm install
npm start

How It Works

Claude Code stores tasks in ~/.claude/tasks/. Each session has its own folder:

~/.claude/tasks/
  └── {session-uuid}/
      ├── 1.json
      ├── 2.json
      └── ...

The viewer watches this directory and pushes updates via Server-Sent Events. Changes appear instantly — no polling, no refresh needed.

Task Structure

{
  "id": "1",
  "subject": "Implement user authentication",
  "description": "Add JWT-based auth with refresh tokens",
  "activeForm": "Setting up auth middleware",
  "status": "in_progress",
  "blocks": ["2", "3"],
  "blockedBy": []
}
  • ...