diff --git a/README.md b/README.md index 7847a3c..4df416a 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,7 @@ **A native desktop GUI for Claude Code** -- chat, code, and manage projects through a polished visual interface instead of the terminal. [![GitHub release](https://img.shields.io/github/v/release/op7418/CodePilot)](https://github.com/op7418/CodePilot/releases) -[![Platform](https://img.shields.io/badge/platform-macOS%20%7C%20Windows-lightgrey)](https://github.com/op7418/CodePilot/releases) +[![Platform](https://img.shields.io/badge/platform-macOS%20%7C%20Windows%20%7C%20Linux-lightgrey)](https://github.com/op7418/CodePilot/releases) [![License](https://img.shields.io/badge/license-MIT-blue)](LICENSE) [中文文档](./README_CN.md) | [日本語](./README_JA.md) @@ -13,19 +13,22 @@ ## Features -- **💬 Conversational coding** -- Stream responses from Claude in real time with full Markdown rendering, syntax-highlighted code blocks, and tool-call visualization. -- **📂 Session management** -- Create, rename, archive, and resume chat sessions. Conversations are persisted locally in SQLite so nothing is lost between restarts. -- **🎯 Project-aware context** -- Pick a working directory per session. The right panel shows a live file tree and file previews so you always know what Claude is looking at. -- **🔒 Permission controls** -- Approve, deny, or auto-allow tool use on a per-action basis. Choose between permission modes to match your comfort level. -- **🎭 Multiple interaction modes** -- Switch between *Code*, *Plan*, and *Ask* modes to control how Claude behaves in each session. -- **🤖 Model selector** -- Switch between Claude models (Opus, Sonnet, Haiku) mid-conversation. -- **🔌 MCP server management** -- Add, configure, and remove Model Context Protocol servers directly from the Extensions page. Supports `stdio`, `sse`, and `http` transport types. -- **⚡ Custom skills** -- Define reusable prompt-based skills (global or per-project) that can be invoked as slash commands during chat. -- **⚙️ Settings editor** -- Visual and JSON editors for your `~/.claude/settings.json`, including permissions and environment variables. -- **📊 Token usage tracking** -- See input/output token counts and estimated cost after every assistant response. -- **🌗 Dark / Light theme** -- One-click theme toggle in the navigation rail. -- **⌨️ Slash commands** -- Built-in commands like `/help`, `/clear`, `/cost`, `/compact`, `/doctor`, `/review`, and more. -- **🖥️ Electron packaging** -- Ships as a native desktop app with a hidden title bar, bundled Next.js server, and automatic port allocation. +- **Conversational coding** -- Stream responses from Claude in real time with full Markdown rendering, syntax-highlighted code blocks, and tool-call visualization. +- **Session management** -- Create, rename, archive, and resume chat sessions. Conversations are persisted locally in SQLite so nothing is lost between restarts. +- **Project-aware context** -- Pick a working directory per session. The right panel shows a live file tree and file previews so you always know what Claude is looking at. +- **Resizable panels** -- Drag the edges of the chat list and right panel to adjust their width. Your preferred sizes are saved across sessions. +- **File & image attachments** -- Attach files and images directly in the chat input. Images are sent as multimodal vision content for Claude to analyze. +- **Permission controls** -- Approve, deny, or auto-allow tool use on a per-action basis. Choose between permission modes to match your comfort level. +- **Multiple interaction modes** -- Switch between *Code*, *Plan*, and *Ask* modes to control how Claude behaves in each session. +- **Model selector** -- Switch between Claude models (Opus, Sonnet, Haiku) mid-conversation. +- **MCP server management** -- Add, configure, and remove Model Context Protocol servers directly from the Extensions page. Supports `stdio`, `sse`, and `http` transport types. +- **Custom skills** -- Define reusable prompt-based skills (global or per-project) that can be invoked as slash commands during chat. +- **Settings editor** -- Visual and JSON editors for your `~/.claude/settings.json`, including permissions and environment variables. +- **Token usage tracking** -- See input/output token counts and estimated cost after every assistant response. +- **Auto update check** -- The app periodically checks for new releases and notifies you when an update is available. +- **Dark / Light theme** -- One-click theme toggle in the navigation rail. +- **Slash commands** -- Built-in commands like `/help`, `/clear`, `/cost`, `/compact`, `/doctor`, `/review`, and more. +- **Electron packaging** -- Ships as a native desktop app with a hidden title bar, bundled Next.js server, graceful shutdown, and automatic port allocation. --- @@ -49,13 +52,13 @@ ## Download -Pre-built releases are available on the [**Releases**](https://github.com/op7418/CodePilot/releases) page. +Pre-built releases are available on the [**Releases**](https://github.com/op7418/CodePilot/releases) page. Releases are built automatically via GitHub Actions for all platforms. ### Supported Platforms -- **macOS**: Universal binary (arm64 + x64) distributed as `.dmg` -- **Windows**: x64 distributed as `.zip` -- **Linux**: x64 and arm64 distributed as `.AppImage`, `.deb`, and `.rpm` +- **macOS** -- arm64 (Apple Silicon) and x64 (Intel) distributed as `.dmg` +- **Windows** -- NSIS installer (`.exe`) bundling x64 + arm64 +- **Linux** -- x64 and arm64 distributed as `.AppImage`, `.deb`, and `.rpm` --- @@ -64,7 +67,7 @@ Pre-built releases are available on the [**Releases**](https://github.com/op7418 ```bash # Clone the repository git clone https://github.com/op7418/CodePilot.git -cd codepilot +cd CodePilot # Install dependencies npm install @@ -140,6 +143,7 @@ Windows SmartScreen will block the installer or executable. | Streaming | [Vercel AI SDK](https://sdk.vercel.ai/) helpers + Server-Sent Events | | Icons | [Hugeicons](https://hugeicons.com/) + [Lucide](https://lucide.dev/) | | Testing | [Playwright](https://playwright.dev/) | +| CI/CD | [GitHub Actions](https://github.com/features/actions) (auto-build + release on tag) | | Build / Pack | electron-builder + esbuild | --- @@ -148,6 +152,7 @@ Windows SmartScreen will block the installer or executable. ``` codepilot/ +├── .github/workflows/ # CI/CD: multi-platform build & auto-release ├── electron/ # Electron main process & preload │ ├── main.ts # Window creation, embedded server lifecycle │ └── preload.ts # Context bridge @@ -166,7 +171,7 @@ codepilot/ │ ├── components/ │ │ ├── ai-elements/ # Message bubbles, code blocks, tool calls, etc. │ │ ├── chat/ # ChatView, MessageList, MessageInput, streaming -│ │ ├── layout/ # AppShell, NavRail, Header, RightPanel +│ │ ├── layout/ # AppShell, NavRail, ResizeHandle, RightPanel │ │ ├── plugins/ # MCP server list & editor │ │ ├── project/ # FileTree, FilePreview, TaskList │ │ ├── skills/ # SkillsManager, SkillEditor @@ -202,10 +207,24 @@ npm run build # Build Electron distributable + Next.js npm run electron:build -# Package macOS DMG (universal binary) -npm run electron:pack +# Package for specific platforms +npm run electron:pack:mac # macOS DMG (arm64 + x64) +npm run electron:pack:win # Windows NSIS installer +npm run electron:pack:linux # Linux AppImage, deb, rpm ``` +### CI/CD + +The project uses GitHub Actions for automated builds. Pushing a `v*` tag triggers a full multi-platform build and automatically creates a GitHub Release with all artifacts: + +```bash +git tag v0.8.1 +git push origin v0.8.1 +# CI builds Windows + macOS + Linux, then publishes the release +``` + +You can also manually trigger builds for individual platforms from the Actions tab. + ### Notes - The Electron main process (`electron/main.ts`) forks the Next.js standalone server and connects to it over `127.0.0.1` with a random free port. diff --git a/README_CN.md b/README_CN.md index b294595..6041e73 100644 --- a/README_CN.md +++ b/README_CN.md @@ -6,34 +6,39 @@ [English](./README.md) | [日本語](./README_JA.md) [![GitHub release](https://img.shields.io/github/v/release/op7418/CodePilot)](https://github.com/op7418/CodePilot/releases) -[![Platform](https://img.shields.io/badge/platform-macOS%20%7C%20Windows-lightgrey)](https://github.com/op7418/CodePilot/releases) +[![Platform](https://img.shields.io/badge/platform-macOS%20%7C%20Windows%20%7C%20Linux-lightgrey)](https://github.com/op7418/CodePilot/releases) [![License](https://img.shields.io/badge/license-MIT-blue)](LICENSE) --- -## ✨ 功能特性 +## 功能特性 -- 💬 **实时对话编码** -- 流式接收 Claude 的响应，支持完整的 Markdown 渲染、语法高亮代码块和工具调用可视化 -- 📂 **会话管理** -- 创建、重命名、归档和恢复聊天会话。所有对话本地持久化存储在 SQLite 中，重启不丢失 -- 🎯 **项目感知上下文** -- 为每个会话选择工作目录。右侧面板实时展示文件树和文件预览，随时了解 Claude 正在查看的内容 -- 🔐 **权限控制** -- 逐项审批、拒绝或自动允许工具使用，可选择不同的权限模式 -- 🎭 **多种交互模式** -- 在 *Code*、*Plan* 和 *Ask* 模式之间切换，控制 Claude 在每个会话中的行为方式 -- 🤖 **模型切换** -- 在对话中随时切换 Claude 模型（Opus、Sonnet、Haiku） -- 🔌 **MCP 服务器管理** -- 直接在扩展页面添加、配置和移除 Model Context Protocol 服务器。支持 `stdio`、`sse` 和 `http` 传输类型 -- ⚡ **自定义技能** -- 定义可复用的提示词技能（全局或项目级别），在聊天中作为斜杠命令调用 -- ⚙️ **设置编辑器** -- 可视化和 JSON 编辑器管理 `~/.claude/settings.json`，包括权限和环境变量配置 -- 📊 **Token 用量追踪** -- 每次助手回复后查看输入/输出 Token 数量和预估费用 -- 🌓 **深色/浅色主题** -- 导航栏一键切换主题 -- 💻 **斜杠命令** -- 内置 `/help`、`/clear`、`/cost`、`/compact`、`/doctor`、`/review` 等命令 -- 📦 **Electron 打包** -- 原生桌面应用，隐藏标题栏，内置 Next.js 服务器，自动端口分配 +- **实时对话编码** -- 流式接收 Claude 的响应，支持完整的 Markdown 渲染、语法高亮代码块和工具调用可视化 +- **会话管理** -- 创建、重命名、归档和恢复聊天会话。所有对话本地持久化存储在 SQLite 中，重启不丢失 +- **项目感知上下文** -- 为每个会话选择工作目录。右侧面板实时展示文件树和文件预览，随时了解 Claude 正在查看的内容 +- **可调节面板宽度** -- 拖拽聊天列表和右侧面板的边缘调整宽度，偏好设置跨会话保存 +- **文件和图片附件** -- 在聊天输入框直接附加文件和图片。图片以多模态视觉内容发送给 Claude 进行分析 +- **权限控制** -- 逐项审批、拒绝或自动允许工具使用，可选择不同的权限模式 +- **多种交互模式** -- 在 *Code*、*Plan* 和 *Ask* 模式之间切换，控制 Claude 在每个会话中的行为方式 +- **模型切换** -- 在对话中随时切换 Claude 模型（Opus、Sonnet、Haiku） +- **MCP 服务器管理** -- 直接在扩展页面添加、配置和移除 Model Context Protocol 服务器。支持 `stdio`、`sse` 和 `http` 传输类型 +- **自定义技能** -- 定义可复用的提示词技能（全局或项目级别），在聊天中作为斜杠命令调用 +- **设置编辑器** -- 可视化和 JSON 编辑器管理 `~/.claude/settings.json`，包括权限和环境变量配置 +- **Token 用量追踪** -- 每次助手回复后查看输入/输出 Token 数量和预估费用 +- **自动更新检查** -- 应用定期检查新版本并在有更新时通知你 +- **深色/浅色主题** -- 导航栏一键切换主题 +- **斜杠命令** -- 内置 `/help`、`/clear`、`/cost`、`/compact`、`/doctor`、`/review` 等命令 +- **Electron 打包** -- 原生桌面应用，隐藏标题栏，内置 Next.js 服务器，优雅关闭进程，自动端口分配 -## 📸 截图 +--- + +## 截图 ![CodePilot](docs/screenshot.png) --- -## 📋 环境要求 +## 环境要求 | 要求 | 最低版本 | |------|---------| @@ -45,7 +50,7 @@ --- -## 🚀 快速开始 +## 快速开始 ```bash # 克隆仓库 @@ -66,19 +71,19 @@ npm run electron:dev --- -## 📥 下载 +## 下载 -预编译版本可在 [Releases](https://github.com/op7418/CodePilot/releases) 页面下载。 +预编译版本可在 [Releases](https://github.com/op7418/CodePilot/releases) 页面下载。所有平台的安装包均由 GitHub Actions 自动构建发布。 ### 支持平台 - **macOS** -- 支持 arm64（Apple Silicon）和 x64（Intel）架构的 `.dmg` 安装包 -- **Windows** -- 提供 `.zip` 压缩包，解压即用 +- **Windows** -- NSIS 安装程序（`.exe`），包含 x64 + arm64 - **Linux** -- 支持 x64 和 arm64 架构，提供 `.AppImage`、`.deb` 和 `.rpm` 格式 --- -## 🔧 安装问题排查 +## 安装问题排查 CodePilot 尚未进行代码签名，因此操作系统在首次打开时会显示安全警告。 @@ -123,7 +128,7 @@ Windows SmartScreen 会阻止安装程序或可执行文件。 --- -## 🛠 技术栈 +## 技术栈 | 层级 | 技术 | |------|------| @@ -138,14 +143,16 @@ Windows SmartScreen 会阻止安装程序或可执行文件。 | 流式传输 | [Vercel AI SDK](https://sdk.vercel.ai/) + Server-Sent Events | | 图标 | [Hugeicons](https://hugeicons.com/) + [Lucide](https://lucide.dev/) | | 测试 | [Playwright](https://playwright.dev/) | +| CI/CD | [GitHub Actions](https://github.com/features/actions)（自动构建 + tag 发版） | | 构建打包 | electron-builder + esbuild | --- -## 📂 项目结构 +## 项目结构 ``` codepilot/ +├── .github/workflows/ # CI/CD：多平台构建和自动发版 ├── electron/ # Electron 主进程和预加载脚本 │ ├── main.ts # 窗口创建、内嵌服务器生命周期管理 │ └── preload.ts # Context bridge @@ -164,7 +171,7 @@ codepilot/ │ ├── components/ │ │ ├── ai-elements/ # 消息气泡、代码块、工具调用等 │ │ ├── chat/ # ChatView、MessageList、MessageInput、流式消息 -│ │ ├── layout/ # AppShell、NavRail、Header、RightPanel +│ │ ├── layout/ # AppShell、NavRail、ResizeHandle、RightPanel │ │ ├── plugins/ # MCP 服务器列表和编辑器 │ │ ├── project/ # FileTree、FilePreview、TaskList │ │ ├── skills/ # SkillsManager、SkillEditor @@ -184,7 +191,7 @@ codepilot/ --- -## 💻 开发 +## 开发 ```bash # 仅运行 Next.js 开发服务器（在浏览器中打开） @@ -200,10 +207,24 @@ npm run build # 构建 Electron 可分发包 + Next.js npm run electron:build -# 打包 macOS DMG -npm run electron:pack +# 打包特定平台 +npm run electron:pack:mac # macOS DMG（arm64 + x64） +npm run electron:pack:win # Windows NSIS 安装包 +npm run electron:pack:linux # Linux AppImage、deb、rpm ``` +### CI/CD + +项目使用 GitHub Actions 自动构建。推送 `v*` tag 会自动触发全平台构建并创建 GitHub Release： + +```bash +git tag v0.8.1 +git push origin v0.8.1 +# CI 自动构建 Windows + macOS + Linux，然后发布 Release +``` + +也可以在 Actions 页面手动触发单个平台的构建。 + ### 说明 - Electron 主进程（`electron/main.ts`）会 fork Next.js standalone 服务器，通过 `127.0.0.1` 上的随机可用端口进行连接 @@ -212,7 +233,7 @@ npm run electron:pack --- -## 🤝 贡献 +## 贡献 欢迎贡献代码。开始之前： @@ -226,6 +247,6 @@ npm run electron:pack --- -## 📄 许可证 +## 许可证 MIT