Claude Code Manager UI

Local-first web UI for managing Claude Code CLI sessions, running jobs, agents, profiles, tools, costs, search and configuration.

Claude Code Manager UI là ứng dụng web local để xem lịch sử, tìm kiếm, quản lý và chạy Claude Code CLI trong một giao diện thống nhất.

Claude Code Manager đọc các file session JSONL trong ~/.claude/projects/ ở chế độ read-only. Search index, alias, lifecycle, tag, bookmark, note và profile được lưu riêng trong SQLite.

Tính năng

Session và process

• Xem session theo project, thời gian, tag, bookmark và lifecycle.
• Đặt alias, archive, đưa vào Trash và restore mà không di chuyển hoặc sửa JSONL.
• Backend-owned job registry: reload hoặc đóng tab không dừng Claude job.
• Reconnect job và replay tối đa 1.000 event gần nhất theo đúng thứ tự.
• Gửi tiếp, interrupt lượt hiện tại hoặc stop process.
• Theo dõi PID, trạng thái, CWD, model, effort, permission, token và chi phí reported từ Claude CLI.
• New Chat hỗ trợ model, effort, budget, worktree, resume/fork, allowed tools, disallowed tools, MCP config, plugin directory, agents, hooks và system prompt.
• Permission presets: Safe, Standard, Auto, Plan.
• bypassPermissions luôn yêu cầu xác nhận riêng trước khi tạo job.

Job thông thường sống qua reload/đóng tab nhưng không sống qua restart backend. Khi backend tắt, ứng dụng terminate toàn bộ process do app tạo. Background agent được chạy qua registry của Claude CLI và có thể được app polling/reconnect lại.

Search, inspection và sharing

• SQLite FTS5 kết hợp filter project, ngày, model, tag, lifecycle, bookmark, tool, file path, lỗi và khoảng chi phí.
• Filter-only search, tối đa 500 kết quả và Saved Search trong localStorage.
• Context Inspector có Files, Changes và Tool Audit.
• Change Viewer chỉ hiển thị thay đổi được ghi trong tool input; không dựng diff lịch sử từ file hiện tại.
• Message checkpoint có nhãn và nhảy trực tiếp đến message.
• Tool Audit hiển thị thời gian, target, trạng thái lỗi và permission mode.
• Chi phí session lịch sử được ghi rõ là estimated; chi phí job live là reported.
• Export Markdown, JSON hoặc HTML.
• Share chỉ tải HTML đã redaction; ứng dụng không upload và không tạo cloud link.
• Redaction che credential phổ biến, token, home path và biến môi trường.

Configuration Center

• App-owned launch profiles, không ghi vào ~/.claude/settings.json hoặc config project hiện có.
• Quản lý model, effort, budget, permission, tools, MCP, plugin, setting sources, system prompt và settings JSON.
• Agent Builder tạo payload cho --agents từ tên, mô tả, prompt và model.
• Hook Builder quản lý event, matcher, command, timeout và trạng thái enabled. Validation không thực thi command.
• Settings tạm được tạo khi chạy job và bị xóa khi process kết thúc.
• Health Dashboard kiểm tra Claude version, auth, doctor, MCP, plugins và profile.
• Hiển thị background agents từ claude agents --json --all.
• Import/export profile JSON với schema_version: 1.
• Không lưu API key hoặc credential vào profile SQLite.

Yêu cầu

• Python 3.10+
• Node.js 18+
• Claude Code CLI trong PATH để chạy chat trực tiếp

Ứng dụng đã được kiểm thử với Claude Code CLI 2.1.207.

claude --version

Cài đặt

git clone https://github.com/Rylaispirit/claude-code-manager-ui.git
cd claude-code-manager-ui

cd backend
python -m venv .venv

# Windows
.venv\Scripts\activate

# macOS/Linux
# source .venv/bin/activate

pip install -r requirements.txt

cd ../frontend
npm ci

Chạy

Windows

Bấm đúp start.bat, hoặc chạy:

start.bat

Chạy thủ công

Terminal 1:

cd backend
python -m uvicorn main:app --host 127.0.0.1 --port 8000

Terminal 2:

cd frontend
npm run dev

Mở http://127.0.0.1:5173.

Kiểm tra

cd backend
python -m unittest -v
python -m compileall -q .

cd ../frontend
npm run build
npm audit --omit=dev

Bảo mật

Backend có thể spawn Claude CLI và cho Claude thực thi tool trên máy:

• Chỉ bind backend/frontend vào 127.0.0.1.
• Không expose cổng 8000 hoặc 5173 ra Internet/LAN.
• HTTP CORS và WebSocket Origin chỉ cho phép frontend local.
• Mọi subprocess argument được truyền bằng argument list, không qua shell.
• Kiểm tra kỹ profile trước khi dùng auto hoặc bypassPermissions.
• Không commit backend/data.db; database có thể chứa nội dung đã lập chỉ mục.
• Share HTML dùng redaction nhưng vẫn nên kiểm tra file trước khi gửi ra ngoài.

Dữ liệu local

• Session nguồn: ~/.claude/projects/**/*.jsonl
• Database ứng dụng: backend/data.db
• Saved Search, theme và thư mục chat bổ sung: browser localStorage
• Temporary settings: thư mục temp của hệ điều hành, tự xóa khi job kết thúc

Trash chỉ là metadata. Ứng dụng không có chức năng xóa JSONL vĩnh viễn.

API chính

Method	Endpoint	Mô tả
GET	/api/projects	Danh sách project
GET	/api/sessions?state=active	Session theo lifecycle
GET	/api/sessions/{id}	Chi tiết session
PATCH	/api/sessions/{id}	Alias và lifecycle
GET	/api/search	Search và filter nâng cao
GET	/api/sessions/{id}/changes	Recorded changes
GET	/api/sessions/{id}/tool-audit	Tool audit
GET/POST/DELETE	/api/sessions/{id}/message-bookmarks	Message checkpoint
GET	/api/sessions/{id}/export	Export md/json/html, tùy chọn redaction
GET/POST	/api/chat/jobs	List/tạo backend job
GET/DELETE	/api/chat/jobs/{job_id}	Xem/stop job
WS	/api/chat/jobs/{job_id}/ws	Reconnect, stream và interrupt
GET/POST/PUT/DELETE	/api/chat/profiles	App-owned profiles
GET/POST	/api/chat/background-agents	Claude background agents
GET	/api/health/claude	Claude và profile health

Legacy WebSocket /api/chat/ws vẫn được giữ để tương thích client cũ.

Cấu trúc

claude-code-manager-ui/
|-- backend/
|   |-- main.py          # FastAPI routes, export, health, WebSocket
|   |-- chat.py          # Job registry và Claude CLI subprocess bridge
|   |-- parser.py        # JSONL parser read-only
|   |-- db.py            # SQLite FTS và app-owned metadata
|   |-- pricing.py       # Chi phí estimated
|   |-- test_core.py     # Migration, search, jobs, redaction, Origin tests
|   `-- requirements.txt
|-- frontend/
|   |-- src/             # React + TypeScript UI
|   |-- package.json
|   `-- vite.config.ts
|-- LICENSE
|-- README.md
`-- start.bat

Giấy phép

Phát hành theo MIT License.

Đây là dự án cộng đồng độc lập, không phải sản phẩm chính thức và không liên kết với Anthropic.