diff --git a/.coderabbit.yaml b/.coderabbit.yaml new file mode 100644 index 00000000..a3932ae0 --- /dev/null +++ b/.coderabbit.yaml @@ -0,0 +1,16 @@ +# yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json + +reviews: + auto_review: + enabled: true + drafts: false + auto_title_instructions: | + Follow Conventional Commits format: ': ' + Types: feat, fix, docs, style, refactor, perf, test, build, ci, chore, revert + Keep description under 72 characters + Use imperative mood: "add" not "added", "fix" not "fixed" + Be concise but descriptive + Examples: + - "feat: add team kanban board with drag-and-drop" + - "fix: resolve CI lint errors in team services" + - "refactor: extract tooltip into separate component" diff --git a/README.md b/README.md index 4c3bb632..32936bd9 100644 --- a/README.md +++ b/README.md @@ -18,84 +18,38 @@


- -## Table of Contents - -- [What is this](#what-is-this) -- [Quick start](#quick-start) -- [Installation](#installation) -- [FAQ](#faq) -- [Development](#development) -- [Roadmap](#roadmap) -- [Links](#links) -- [Contributing](#contributing) -- [Security](#security) -- [License](#license) - ---- - ## What is this -**Claude Agent Teams UI** is a desktop app that turns Claude Code's "Orchestrate Teams" feature into a full task management experience. Create agent teams, watch them work on a kanban board, review their code changes, and stay in control — all running locally on your machine. +A new approach to task management with AI agents. -### Who is this for - -- **Developers** who want AI agents to handle tasks in parallel while they oversee progress -- **Teams** using Claude Code and needing a shared task board, code review workflow, and team messaging -- **Anyone** who wants to browse and analyze Claude Code session history without running agents - -### How it works - -1. **Create a team** — Define roles (e.g. lead, frontend, backend) and a provisioning prompt. The app spawns Claude Code sessions as autonomous team members. -2. **Tasks flow automatically** — Agents create tasks, assign each other, move cards, leave comments, and send messages. You see everything on the kanban board in real time. -3. **Review like in Cursor** — When a task is done, you see the diff, approve, reject, or request changes. Agents get notified and can fix issues. -4. **Stay in control** — Send a direct message to any agent, add a comment on a task, or use quick actions on cards whenever you need to clarify or add work. - -### Key features - -| Feature | Description | -|---------|-------------| -| **Kanban board** | Tasks move through columns as agents work. Drag-and-drop, filters, quick actions. | -| **Code review** | Full diff view per task. Approve, reject, or request changes. Agents get notified. | -| **Team messaging** | Agents send direct messages. Inbox, notifications, clarification flags. | -| **Tool visibility** | See exactly which tools agents used (Bash, Read, Edit, etc.) for each task. | -| **Live processes** | See which agents are running. Open URLs directly in the browser. | -| **Session analysis** | Deep breakdown of each Claude session: commands, reasoning, subprocesses. | +- **Assemble your team** — create agent teams with different roles that work autonomously in parallel +- **Agents talk to each other** — they communicate, create and manage their own tasks, and leave comments +- **Sit back and watch** — tasks change status on the kanban board while agents handle everything on their own +- **Review changes like in Cursor** — see what code each task changed, then approve, reject, or comment +- **Full tool visibility** — inspect exactly which tools an agent used to complete each task +- **Live process section** — see which agents are running processes and open URLs directly in the browser +- **Stay in control** — send a direct message to any agent, drop a comment on a task, or pick a quick action right on the kanban card whenever you want to clarify something or add new work
More features
-- **Recent tasks across projects** — Browse the latest completed tasks from all your projects in one place -- **Solo mode** — One-member team: a single agent that creates its own tasks and shows live progress. Saves tokens; can expand to a full team anytime -- **Advanced context monitoring** — Token breakdown: user messages, CLAUDE.md, tool outputs, thinking text, team coordination. See usage, context window %, and cost per category -- **Smart task-to-log matching** — Links Claude session logs to tasks by status change timestamps, even when tasks move back and forth -- **Zero-setup onboarding** — Built-in Claude Code installation and authentication -- **Built-in code editor** — Edit project files with Git support without leaving the app -- **Branch strategy** — Choose via prompt: single branch or git worktree per agent -- **Team member stats** — Global performance statistics per member -- **Attach code context** — Reference files or snippets in messages, like in Cursor -- **Notification system** — Configurable alerts when tasks complete, agents need attention, or errors occur -- **MCP integration** — Built-in [mcp-server](./mcp-server) for Cursor, Claude Desktop, and other MCP clients. 13 tools for task CRUD, kanban, reviews, and messaging — see [mcp-server/README.md](./mcp-server/README.md) +- **Deep session analysis** — detailed breakdown of what happened in each Claude session: bash commands, reasoning, subprocesses +- **Solo mode** — one-member team: a single agent that creates its own tasks and shows live progress. Saves tokens; can expand to a full team anytime +- **Smart task-to-log/changes matching** — automatically links Claude session logs/changes to specific tasks +- **Advanced context monitoring system** — comprehensive breakdown of what consumes tokens at every step: user messages, Claude.md instructions, tool outputs, thinking text, and team coordination. Token usage, percentage of context window, and session cost are displayed for each category, with detailed views by category or size. +- **Recent tasks across projects** — browse the latest completed tasks from all your projects in one place +- **Zero-setup onboarding** — built-in Claude Code installation and authentication +- **Built-in code editor** — edit project files with Git support without leaving the app +- **Branch strategy** — choose via prompt: single branch or git worktree per agent +- **Team member stats** — global performance statistics per member +- **Attach code context** — reference files or snippets in messages, like in Cursor +- **Notification system** — configurable alerts when tasks complete, agents need attention, or errors occur +- **MCP integration** — supports the built-in `mcp-server` (see [mcp-server folder](./mcp-server)) for integrating external tools and extensible agent plugins out of the box
-### Tech stack - -Electron, React 18, TypeScript 5, Tailwind CSS 3, Zustand 4. Data from `~/.claude/` (session logs, todos, tasks). No cloud backend — everything runs locally. - ---- - -## Quick start - -1. **Download** the app for your platform (see [Installation](#installation)) -2. **Launch** — On first run, the setup wizard will install and authenticate Claude Code -3. **Create a team** — Pick a project, define roles, write a provisioning prompt -4. **Watch** — Agents spawn, create tasks, and work. You see it all on the kanban board - ---- - ## Installation No prerequisites — Claude Code can be installed and configured directly from the app. @@ -136,7 +90,20 @@ No prerequisites — Claude Code can be installed and configured directly from t -**System requirements:** macOS 10.15+, Windows 10+, or Linux (glibc 2.28+). Node.js is not required for the desktop app. + +### Tech stack + +Electron, React 18, TypeScript 5, Tailwind CSS 3, Zustand 4. Data from `~/.claude/` (session logs, todos, tasks). No cloud backend — everything runs locally. + +--- + +## Quick start + +1. **Download** the app for your platform (see [Installation](#installation)) +2. **Launch** — On first run, the setup wizard will install and authenticate Claude Code +3. **Create a team** — Pick a project, define roles, write a provisioning prompt +4. **Watch** — Agents spawn, create tasks, and work. You see it all on the kanban board + --- @@ -242,9 +209,10 @@ pnpm dist # macOS + Windows + Linux --- -## Roadmap +## TODO -- [ ] CLI runtime: Run in headless/console environments (web UI), e.g. VPS, remote server +- [ ] CLI runtime: Run not only on a local PC but in any headless/console environment (web UI), e.g. VPS, remote server, etc. +- [ ] 2 modes: current (agent teams), and a new mode: regular subagents (no communication between them) - [ ] Visual workflow editor ([@xyflow/react](https://github.com/xyflow/xyflow)) for building and orchestrating agent pipelines with drag & drop - [ ] Install skills, MCP, and integrations via an intuitive UI, and only for selected agents - [ ] Planning mode to organize agent plans before execution @@ -253,15 +221,6 @@ pnpm dist # macOS + Windows + Linux --- -## Links - -- [Homepage](https://github.com/777genius/claude_agent_teams_ui) -- [Releases](https://github.com/777genius/claude_agent_teams_ui/releases) -- [Issues](https://github.com/777genius/claude_agent_teams_ui/issues) -- [MCP Server](./mcp-server) — Use Claude Agent Teams UI tools from Cursor, Claude Desktop, and other MCP clients - ---- - ## Contributing See [CONTRIBUTING.md](.github/CONTRIBUTING.md) for development guidelines. Please read our [Code of Conduct](.github/CODE_OF_CONDUCT.md). diff --git a/src/renderer/components/team/members/MemberLogsTab.tsx b/src/renderer/components/team/members/MemberLogsTab.tsx index 3cf05dbf..3701a851 100644 --- a/src/renderer/components/team/members/MemberLogsTab.tsx +++ b/src/renderer/components/team/members/MemberLogsTab.tsx @@ -7,6 +7,7 @@ import { SubagentRecentMessagesPreview, } from '@renderer/components/team/members/SubagentRecentMessagesPreview'; import { Tooltip, TooltipContent, TooltipTrigger } from '@renderer/components/ui/tooltip'; +import { asEnhancedChunkArray } from '@renderer/types/data'; import { enhanceAIGroup } from '@renderer/utils/aiGroupEnhancer'; import { formatDuration } from '@renderer/utils/formatters'; import { transformChunksToConversation } from '@renderer/utils/groupTransformer'; @@ -306,7 +307,7 @@ export const MemberLogsTab = ({ return d?.chunks ?? null; } const d = await api.getSessionDetail(log.projectId, log.sessionId, options); - return (d?.chunks ?? null) as unknown as EnhancedChunk[] | null; + return d ? asEnhancedChunkArray(d.chunks) : null; }, [] );