@37chengshan/ompweb 0.3.5

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 agegr
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.ja.md

@@ -0,0 +1,139 @@
+# ompweb
+
+[English](./README.md) | [简体中文](./README.zh-CN.md)
+
+コミュニティ：[OMPWEB Discord に参加](https://discord.gg/evqgGzRfM5)
+
+[oh-my-pi (omp) コーディングエージェント](https://github.com/can1357/oh-my-pi)のローカル Web UI です。ompweb はローカルの omp セッションファイルを読み込み、セッションの閲覧、リアルタイムチャット、モデル設定、スキル管理、プロジェクトファイルのプレビューを行えるブラウザワークスペースを提供します。
+
+![ompweb — デモ](docs/demo.gif)
+
+<details>
+<summary>スクリーンショット（ライト / ダークテーマ）</summary>
+
+![ompweb — ライトテーマ](docs/screenshot-light.png)
+
+![ompweb — ダークテーマ](docs/screenshot-dark.png)
+
+</details>
+
+## 必要条件
+
+- [omp](https://github.com/can1357/oh-my-pi) がインストールされ、`PATH` に含まれていること（または `OMP_WEB_OMP_BIN` でバイナリの場所を指定）
+- Node.js 22.19.0 以降（`node --version`）
+
+## クイックスタート
+
+**インストールせずに実行:**
+
+```bash
+npx @kahme247/ompweb@latest
+```
+
+**またはグローバルにインストール:**
+
+```bash
+npm install -g @kahme247/ompweb
+ompweb
+```
+
+続いて [http://127.0.0.1:30177](http://127.0.0.1:30177) を開きます。サーバーの準備が整うと、CLI はブラウザを自動的に開こうとします。ompweb はデフォルトで `127.0.0.1` で待ち受けます。
+
+**オプション:**
+
+```bash
+ompweb --port 8080              # カスタムポート
+ompweb --hostname 0.0.0.0       # 信頼できるネットワークに公開
+ompweb -p 8080 -H 0.0.0.0       # オプションを組み合わせる
+ompweb --no-open                # ブラウザを自動的に開かない
+
+ompweb --password "a-long-random-password" # パスワードのみのサインインを有効化（Windows でも同様）
+
+PORT=8080 ompweb                # 環境変数にも対応
+OMP_WEB_HOSTNAME=0.0.0.0 ompweb # ネットワーク公開を明示的に有効化
+OMP_WEB_PASSWORD='a-long-random-password' ompweb # 環境変数でも同様（POSIX）
+# Windows: $env:OMP_WEB_PASSWORD="secret"; ompweb
+OMP_WEB_NO_OPEN=1 ompweb        # バックグラウンドサービスとして実行する場合に便利
+```
+
+`OMP_WEB_PASSWORD` を設定すると、テーマに統合されたパスワードのみのサインイン画面で UI とすべての API エンドポイントを保護できます。サインイン後は HTTP-only の署名付きセッションクッキーが 30 日間有効です。未設定なら認証は無効です。リモート利用では、パスワードとセッションクッキーを守るため、信頼できるリバースプロキシまたは VPN 経由の HTTPS が必要です。ompweb をインターネットへ直接公開しないでください。
+
+## 機能
+
+- **作業をすぐに再開**: ターミナル履歴やセッションパスを探し回らずに、プロジェクトごとに過去の omp の会話を閲覧できます。
+- **別の方向性を安全に試す**: 以前のメッセージから続行するか、セッションをフォークして別ルートに分岐できます。
+- **サイドバーを整理**: 非アクティブなセッションはネイティブな記録を残してアーカイブし、不要になったものは明示的に削除できます。
+- **ブランチをまたいで作業**: サイドバーから Git ワークツリーを切り替えると、新しいセッションとエクスプローラーが選択したチェックアウトに追従します。
+- **プロジェクトを見ながらチャット**: エージェントの作業中に、左側でファイルを閲覧し、右側でソース、ドキュメント、画像、音声、PDF をプレビューできます。
+- **セッション状態をひと目で把握**: コンテキスト使用量、コスト、コンパクション状態、システムプロンプトの詳細をトップバーで確認できます。
+- **ターミナルに頼らない設定**: モデル、ログイン/APIキー、モデルテスト、ネイティブ OMP 制御（アドバイザー、承認、Bash ポリシー、思考、コンパクション、メモリ、自動学習、リトライ/フォールバック）、スキル、プラグイン、プロジェクト MCP サーバーを Web UI から管理できます。
+- **Settings で MCP を管理**: 専用の MCP タブでプロジェクトサーバーの状態（有効 / 無効 / 無効な設定）を表示し、追加、編集、名前変更、検証、削除を行えます。設定エラーはトーストで通知されます。
+- **OMP を最新に保つ**: Settings からインストール済みランタイムを確認・更新し、必要に応じてアクティブなセッションを再起動できます。
+- **完了を見逃さない**: エージェント完了時のブラウザー通知を有効にし、インストール済みスキルの更新を確認できます。
+- **⌘K でどこへでもジャンプ**: セッションの切り替え、新規作成、テーマ切替ができるコマンドパレット（⌘K / Ctrl+K）。
+- **温かみのある紙のようなデザイン**: ライト/ダークの2テーマ、セリフ体のディスプレイ書体、WCAG AA 検証済みのコントラスト。トークン駆動の UI キット（Base UI プリミティブ、cmdk、lucide アイコン）で構築。
+
+## 設定
+
+| 変数 | 意味 |
+| --- | --- |
+| `PORT` | サーバーポート（デフォルト `30177`。`-p/--port` が優先） |
+| `OMP_WEB_HOSTNAME` | バインドするホスト名（デフォルト `127.0.0.1`。`-H/--hostname` が優先） |
+| `OMP_WEB_PASSWORD` | サインイン画面用の任意のパスワード |
+| `OMP_WEB_NO_OPEN` | `1`/`true` を設定するとブラウザの自動起動をスキップ |
+| `OMP_WEB_OMP_BIN` | `omp` バイナリが `PATH` にない場合の絶対パス |
+| `PI_CODING_AGENT_DIR` | 別の omp エージェントディレクトリを指定（デフォルト `~/.omp/agent`） |
+| `HTTP_PROXY` / `HTTPS_PROXY` / `NO_PROXY` | サーバーサイドリクエスト用の標準プロキシ変数 |
+
+## アーキテクチャ
+
+ompweb は Node 上でホストされる Next.js アプリで、インストール済みの `omp` バイナリを操作します。エージェント自体は同梱していません:
+
+- **ライブセッション**: `omp --mode rpc-ui`（stdio 上の NDJSON）を、アクティブなセッションごとに 1 つの子プロセスとして起動します。そのため、エージェントのバージョンは常にインストールされているものと完全に一致します。
+- **セッション閲覧**: omp のセッションファイル（`~/.omp/agent/sessions/<encoded-cwd>/<timestamp>_<uuid>.jsonl`）を直接読み込みます。タイトル変更、アーカイブ、削除は、OMP のライブ書き込みと競合しないよう保護されたネイティブファイルのメンテナンス操作です。
+- **モデルと認証**: omp 子プロセスに対する RPC コマンドを使用します。モデルパネルは omp エージェントディレクトリ内の `models.yml` を編集します。
+- **スキルとプラグイン**: omp のスキルディレクトリ（`~/.omp/agent/skills`、プロジェクトの `.omp/skills`、互換ディレクトリ）をスキャンし、プラグイン管理には `omp plugin` を呼び出します。
+- **ファイルアクセス**: ファイルの閲覧とプレビューは、選択したプロジェクトディレクトリとセッションに現れる作業ディレクトリに限定されます。
+- **フォークとセッション内ブランチの違い**: フォークは新しい `.jsonl` ファイルを作成します。「ここから編集」は同じセッションファイル内に別のブランチを作成します。
+
+## 開発
+
+```bash
+npm install
+npm run dev
+```
+
+ローカル開発サーバーは [http://127.0.0.1:30177](http://127.0.0.1:30177) で動作します。
+
+よく使うチェック:
+
+```bash
+npx tsc --noEmit       # 型チェック
+npm run lint           # ESLint（警告ゼロを強制）
+node --test lib/*.test.mjs components/*.test.mjs   # テスト実行
+```
+
+ローカル開発中は `next build` / `npm run build` の実行を避けてください。`.next/` への書き込みが行われ、開発サーバーに干渉することがあります。ビルドはリリース作業のときだけにしてください。
+
+## 国際化
+
+ompweb は英語、簡体字中国語（简体中文）、日本語をサポートし、3 言語で UI 全体の翻訳文字列を提供しています。言語は `navigator.language` から自動検出され、トップバーの言語メニューから実行時に切り替えできます。選択はセッション間で永続化されます。
+
+- 辞書ファイル: `lib/i18n/locales/{en,zh-CN,ja}.json`
+- フレームワーク: `lib/i18n/index.tsx` — `useSyncExternalStore` ベースの軽量ストア、`{var}` 補間と複数形サポート（`.one`/`.other`）
+- API エラーメッセージは安定したエラーコード（`errors.<code>`）でクライアント側で翻訳
+
+## 品質
+
+- **アクセシビリティ**: WCAG AA 準拠 — Lighthouse アクセシビリティスコア 100/100、キーボードナビゲーション全面対応、フォーカス可視リング、ARIA ロール
+- **パフォーマンス**: リストコンポーネントのメモ化、RAF によるスクロール/マウスハンドラのスロットリング、デバウンス検索、ストリーミング JSONL リーダー、ETag キャッシュによるセッションリスト
+- **堅牢性**: omp 子プロセスのグレースフルシャットダウン（プロセスグループキル）、エラーバウンダリ、アトミックなセッションファイル書き換え
+- **テスト**: セッション解析、ターミナル入力、Markdown レンダリング、メッセージ表示、ネイティブ設定、MCP 設定をカバーする焦点を絞ったテストスイート
+
+## クレジット
+
+ompweb は [agegr/pi-web](https://github.com/agegr/pi-web)（MIT）のフォークです。pi-web は [badlogic/pi-mono](https://github.com/badlogic/pi-mono) の pi コーディングエージェント向け Web UI で、これを [can1357/oh-my-pi](https://github.com/can1357/oh-my-pi) 向けに適合させたものです。
+
+## ライセンス
+
+MIT

package/README.md

@@ -0,0 +1,194 @@
+# ompweb
+
+[English](./README.md) | [简体中文](./README.zh-CN.md) | [日本語](./README.ja.md)
+
+Community: [Join the OMPWEB Discord](https://discord.gg/evqgGzRfM5)
+
+Local web UI for the [oh-my-pi (omp) coding agent](https://github.com/can1357/oh-my-pi). ompweb reads your local omp session files and gives you a browser workspace for session browsing, real-time chat, model configuration, skill management, and project file preview.
+
+![ompweb — live session demo](docs/demo.gif)
+
+<details>
+<summary>Screenshots (light / dark)</summary>
+
+![ompweb — light theme](docs/screenshot-light.png)
+
+![ompweb — dark theme](docs/screenshot-dark.png)
+
+</details>
+
+## 🌟 Enhancements & Optimizations over Upstream (相比上游仓库的优化与增强)
+
+This repository ([37chengshan/ompweb](https://github.com/37chengshan/ompweb)) is a feature-rich, hardened fork of [kahme247/ompweb](https://github.com/kahme247/ompweb). Based on actual code implementations, the following key features, architectural upgrades, and performance optimizations have been added:
+
+### 1. 🖥️ Interactive Web Terminal (内置交互式终端)
+- **Real PTY Shell Integration (`app/api/terminal/route.ts`, `components/EmbeddedTerminal.tsx`)**: Spawns true pseudo-terminals (`python3 -c "import pty; pty.spawn(...)"`) with ANSI color decoding, bidirectional SSE streaming, serialized inputs, and dynamic window resize (`cols`/`rows`).
+- **Dockable Bottom Panel**: Run Git commands, build scripts, tests, and CLI tools directly within ompweb without leaving the browser. Includes auto session reaping and bounded output ring buffers.
+
+### 2. 📂 Native File Manager Integration & Workspace Ordering (文件管理与工作区排序)
+- **Always-Visible Reveal Action (`components/FileExplorer.tsx`, `app/api/files/open/route.ts`)**: Permanent "Reveal in Finder / Explorer / File Manager" quick-actions on workspace headers and file tree nodes (not hover-gated) with cross-platform support (macOS `open`, Windows `explorer.exe`, Linux `xdg-open`).
+- **Workspace Aliases & Custom Ordering (`lib/project-registry.ts`, `lib/project-ordering.ts`)**: Rename workspace display labels (aliases) and customize project sidebar ordering persistently without mutating repository paths on disk.
+
+### 3. 🎨 Visual Theme Studio & Motion Controls (主题工作室与动效偏好)
+- **Theme Studio (`components/ThemeStudio.tsx`, `hooks/useTheme.ts`)**: Live preview and customize paper/ember design tokens with WCAG AA contrast verification, instant light/dark/system cycling, and custom color accents.
+- **Motion Accessibility (`hooks/useMotionPrefs.ts`)**: OS `prefers-reduced-motion` integration that instantly disables heavy SVG SMIL animations and replaces smooth-scrolling with instant jumps for users sensitive to motion.
+
+### 4. 🧭 Plan Mode Surface & History Traceability (计划看板与压缩前历史追溯)
+- **Interactive Plan Panel (`components/PlanPanel.tsx`, `lib/plan-reader.ts`)**: Live plan document rendering from `<session>/local/*-plan.md`, one-click plan execution, and a dedicated critique/feedback modal (`onRejectPlan`).
+- **Pre-Compaction History Browsing (`lib/session-reader.ts`)**: Toggle and inspect full pre-compaction message history without polluting the active agent context.
+
+### 5. ⚡ Frontend Rendering & Viewport Safety (前端渲染极致优化)
+- **Streaming Markdown AST Bypass (`components/MarkdownBody.tsx`)**: Bypasses expensive math regex scans (`normalizeDisplayMath`) and dynamic KaTeX imports during streaming, compiling AST only once on message commit for a smooth 60fps experience.
+- **LRU Memory Caches (`lib/markdown.ts`, `lib/patch.ts`)**: 200-slot LRU cache for display math normalization and 20-slot LRU cache for unified diff parsing (`parseUnifiedPatch`).
+- **DOM Explosion Protection (`components/MessageView.tsx`)**: 800-row limit (`MAX_ROWS = 800`) on Git diff views and 100KB safety caps on thinking/tool outputs.
+- **Component Memoization (`components/PlanPanel.tsx`, `components/MessageView.tsx`)**: `React.memo` wrappers prevent cascading re-renders during active streaming.
+
+### 6. 🛡️ Backend Node.js, RPC & File I/O Hardening (后端 RPC 内存安全加固)
+- **Git ProjectRoot Dedup & 5-minute Cache (`lib/worktree.ts`)**: `__piProjectPendingCache` coalesces concurrent `resolveProject` calls into a single Promise and caches results for 5 minutes.
+- **SSE Socket & Memory Leak Prevention (`app/api/agent/[id]/events/route.ts`, `lib/rpc-manager.ts`)**: Emits `session_destroyed` upon session termination to immediately close SSE streams and unregister listeners.
+- **Child Process Dispose Failsafe (`lib/omp/rpc-process.ts`)**: `Promise.race` timeout fallback prevents hanging promises on un-reaped processes; `crlfDelay: Infinity` standardizes NDJSON parsing.
+- **Context Payload Shrinking (`lib/session-reader.ts`, `lib/types.ts`)**: Completely strips deferred `thinking` fields from JSON payloads rather than sending empty strings.
+
+### 7. ⚙️ Redesigned MCP Manager & Built-in Agent MCP (MCP 管理器重构与 Agent MCP 集成)
+- **Dual-Mode Visual Form Editor (`components/McpConfig.tsx`)**: Form-based editing (Transport, Command, Args, URL, Enabled switch) + JSON mode with quick templates (`Python stdio`, `NPX stdio`, `Remote HTTP`) and project/global configuration support.
+- **Categorized Accordion & Filter (`components/McpConfig.tsx`)**: Accordion grouping with real-time search for multi-client discovered MCP servers.
+- **Built-in Agent MCP Integration (`vendor/agent-mcp/`)**: Vendored `agent-mcp` (v3.0.0) multi-agent orchestration tools with SQLite tuning (`PRAGMA temp_store=MEMORY`, autocommit mode) and lock-free SSE broadcaster queues.
+
+## Requirements
+
+- [omp](https://github.com/can1357/oh-my-pi) installed and on your `PATH` (or point `OMP_WEB_OMP_BIN` at the binary)
+- Node.js 22.19.0 (`nvm use`; `node --version`)
+
+## Quick Start
+
+**Run without installing:**
+
+```bash
+npx @kahme247/ompweb@latest
+```
+
+**Or install globally:**
+
+```bash
+npm install -g @kahme247/ompweb
+ompweb
+```
+
+Then open [http://127.0.0.1:30177](http://127.0.0.1:30177). The CLI will try to open the browser automatically after the server is ready. ompweb listens on `127.0.0.1` by default.
+
+**Options:**
+
+```bash
+ompweb --port 8080              # custom port
+ompweb --hostname 0.0.0.0       # expose on a trusted network
+ompweb -p 8080 -H 0.0.0.0       # combine options
+ompweb --no-open                # do not open the browser automatically
+ompweb --password "a-long-random-password" # password-only sign-in without POSIX inline-env syntax
+
+PORT=8080 ompweb                # environment variable is also supported
+OMP_WEB_HOSTNAME=0.0.0.0 ompweb # explicit network exposure
+OMP_WEB_PASSWORD='a-long-random-password' ompweb # env-variable form (POSIX: inline or exported)
+OMP_WEB_NO_OPEN=1 ompweb        # useful when running as a background service
+
+# Windows (PowerShell / CMD)
+# $env:OMP_WEB_PASSWORD="a-long-random-password"; ompweb
+# or
+# ompweb --password "a-long-random-password"
+```
+
+Set `OMP_WEB_PASSWORD` (or pass `--password`) to protect the interface and every API endpoint with a themed, password-only sign-in screen. A successful sign-in creates an HTTP-only signed session cookie for 30 days; changing the configured password invalidates existing sessions. Leaving the variable unset disables authentication. Remote use still requires HTTPS through a trusted reverse proxy or VPN so the password and session cookie cannot be intercepted. On Windows the env-variable syntax is `$env:OMP_WEB_PASSWORD="..."`; `ompweb --password "..."` works in every shell without that extra step.
+
+### Security and troubleshooting
+
+- The server binds to `127.0.0.1` by default. A non-loopback hostname is an explicit opt-in and should only be used behind a trusted network boundary; ompweb is not safe to expose publicly.
+- File APIs are allow-listed to the selected workspace, its valid Git worktrees, session-referenced directories, and explicitly selected roots. Paths are canonicalized to reject traversal and symlink escapes.
+- `omp` is resolved from `OMP_WEB_OMP_BIN` first, then `PATH`. If live chat cannot start, run `omp --version` in the same terminal or set `OMP_WEB_OMP_BIN` to the executable's absolute path.
+- Session history remains native OMP JSONL. OMP owns live-session writes; ompweb reads the files directly and only performs explicit title, archive, and delete maintenance when it is not racing a live OMP write.
+- Session archive uses OMP's native `archive/sessions/<cwd>/<file>.jsonl.gz` layout and moves sibling artifacts with the transcript; the original JSONL bytes are preserved inside the gzip.
+
+## Features
+
+- **Pick work back up**: browse previous omp conversations by project without digging through terminal history or session paths.
+- **Try different directions safely**: continue from an earlier message (in-session branches with a branch navigator) or fork a session into a separate route.
+- **Keep the sidebar tidy**: archive an inactive session without deleting its native transcript, or delete it explicitly when it is no longer needed.
+- **Work across branches**: switch Git worktrees from the sidebar so new sessions and the Explorer follow the checkout you choose.
+- **Chat beside the project**: browse files on the left and preview source, docs, images, audio, and PDFs on the right while the agent works.
+- **Watch subagents and plans live**: composer-attached panels show the todo plan and running subagents with per-subagent telemetry; click a chip for the full subagent transcript.
+- **See session state clearly**: context usage, cost, tokens-per-second (reported by omp itself), compaction state and method (with before → after token counts on compaction cards), and system prompt details are visible from the top bar and transcript.
+- **Preview markdown faithfully**: YAML frontmatter renders in a summary card (title + key/value rows), math fences stay aligned inside lists, and CJK ranges like `5~7U` are no longer mangled (GFM now requires `~~` for strikethrough).
+- **Pick projects naturally on Windows**: a drive picker at the filesystem root and a case-folded, symlink-aware project identity keep the sidebar stable across drives and worktrees.
+- **Configure less from the terminal**: manage models, login/API keys, model tests, task agents, native OMP controls (advisor, approval, Bash policy, thinking, compaction, memory, auto-learn, retry/fallback), skills (search, install, update checks), plugins, and project MCP servers from the web UI.
+- **MCP management in Settings**: a dedicated MCP tab lists installed project servers with status (enabled / disabled / invalid), supports add/edit/rename/validate/remove, and surfaces configuration failures as corner toasts.
+- **Slash commands that travel**: `/goal`, `/plan`, `/review`, `/fix`, `/test`, `/explain`, `/simplify`, `/commit`, and `/advisor` expand into well-structured prompts; omp's own commands (skills, `/compact`, …) appear via `available_commands_update`.
+- **Keep OMP current**: check the installed runtime version, update it, and restart active sessions from Settings when needed.
+- **Stay informed**: opt into browser notifications when an agent finishes, play a completion sound, and check installed skills for updates.
+- **Jump anywhere with ⌘K**: a command palette (⌘K / Ctrl+K) for switching sessions, starting new ones, and toggling the theme.
+- **Warm, paper-like design**: light and dark themes with serif display type and WCAG AA-verified contrast, built on a token-driven UI kit (Base UI primitives, cmdk, lucide icons).
+
+## Configuration
+
+| Variable | Meaning |
+| --- | --- |
+| `PORT` | Server port (default `30177`; `-p/--port` wins) |
+| `OMP_WEB_HOSTNAME` | Bind hostname (default `127.0.0.1`; `-H/--hostname` wins) |
+| `OMP_WEB_PASSWORD` / `--password` | Password for the sign-in screen; `--password` works in every shell (PowerShell/CMD) without ` $env:` syntax |
+| `OMP_WEB_NO_OPEN` | Set to `1`/`true` to skip auto-opening the browser |
+| `OMP_WEB_OMP_BIN` | Absolute path to the `omp` binary when it is not on `PATH` |
+| `PI_CODING_AGENT_DIR` | Point at another omp agent directory (default `~/.omp/agent`) |
+| `HTTP_PROXY` / `HTTPS_PROXY` / `NO_PROXY` | Standard proxy variables for server-side requests |
+
+## Architecture
+
+ompweb is a Node-hosted Next.js app that drives your installed `omp` binary — it does not embed the agent:
+- **Live sessions**: spawns `omp --mode rpc-ui` (NDJSON over stdio), one child process per active session, so the agent version is always exactly what you have installed. It negotiates RPC v2 when the installed OMP advertises it, uses bounded chunk reassembly for large frames, and falls back to v1 for older versions. Host env (`PORT`, `NEXT_*`, `NODE_ENV`) is stripped before spawn, and shutdown is graceful on both POSIX (process-group) and Windows (`taskkill /t`).
+- **Live state and telemetry**: context usage, queue depth, compaction state, and tokens-per-second are polled from omp's `get_state` RPC and surfaced in the top bar and transcript; compaction cards show the maintenance method and before → after token counts. Subagent transcripts persist beside the parent session's artifacts and are recovered from disk so past runs still show their rosters.
+- **Session browsing**: reads omp's session files (`~/.omp/agent/sessions/<encoded-cwd>/<timestamp>_<uuid>.jsonl`) directly; title, archive, and delete are narrow native-file maintenance operations guarded against live OMP writes. Projects are grouped by a stable `projectKey` (Windows case-folded, symlink-resolved) so the sidebar doesn't jump between drives or worktrees.
+- **Models and auth**: RPC commands against the omp child process with strict payload validation (unknown-shape guards, safe fallbacks); the Models panel edits `models.yml` in the omp agent directory, dropping blank placeholder rows and rejecting ambiguous `enabledModels` entries.
+- **Native settings**: the General/MCP settings panels read and write the allow-listed subset of `~/.omp/agent/config.yml` (or `config.yaml` fallback), preserving unrelated keys and comments. Changes apply to new and restarted sessions.
+- **Skills and plugins**: scans omp's skill directories (`~/.omp/agent/skills`, project `.omp/skills`, and compat dirs) and shells out to `omp plugin` for plugin management.
+- **MCP servers**: project servers are managed through OMP's native locations (`.omp/mcp.json`, then compatibility files) at the git top level, validated against the stdio/http/sse schema and written atomically.
+- **File access**: file browsing and preview are scoped to the selected project directory and working directories that appear in sessions; paths are canonicalized via a single `isWindowsAbsolutePath`/`samePath` helper and symlink escapes are rejected after `realpath` resolution. On Windows the directory picker offers a drive list at the root.
+- **Forks vs in-session branches**: Fork creates a new `.jsonl` file. "Edit from here" creates another branch inside the same session file.
+
+## Development
+
+```bash
+npm install
+npm run dev
+```
+
+The local dev server runs at [http://127.0.0.1:30178](http://127.0.0.1:30178).
+
+Common checks:
+
+```bash
+npm run typecheck      # type check
+npm run lint           # ESLint (zero warnings enforced)
+npm test               # run test suite
+npm run build          # production build
+```
+
+Avoid running `next build` / `npm run build` during local development. It writes to `.next/` and can interfere with the dev server; leave builds for release work.
+
+## Internationalization
+
+ompweb supports English, Simplified Chinese (简体中文), and Japanese (日本語) with translated UI strings across all three languages. The language is auto-detected from `navigator.language` and can be switched at runtime via the language menu in the top bar. The choice persists across sessions.
+
+- Dictionaries: `lib/i18n/locales/{en,zh-CN,ja}.json`
+- Framework: `lib/i18n/index.tsx` — a lightweight store built on `useSyncExternalStore` with `{var}` interpolation and plural support (`.one`/`.other`)
+- API error messages are translated via stable error codes (`errors.<code>`) looked up client-side
+
+## Quality
+
+- **Accessibility**: WCAG AA compliant — Lighthouse a11y score 100/100, keyboard navigation throughout, focus-visible rings, ARIA roles
+- **Performance**: memoized list components, RAF-gated scroll/mouse handlers, debounced search, streaming JSONL reader, ETag-cached session listing
+- **Resilience**: graceful shutdown of spawned omp processes (process-group kill), error boundaries, atomic session file rewrites
+- **Tests**: a focused suite covering session parsing, RPC frame chunking, subagent history, markdown rendering, message display, native settings, and MCP configuration — run with `npm test`
+
+## Credits
+
+ompweb is a fork of [agegr/pi-web](https://github.com/agegr/pi-web) (MIT), the web UI for the [earendil/pi-mono](https://github.com/earendil-works/pi) pi coding agent, adapted for [can1357/oh-my-pi](https://github.com/can1357/oh-my-pi).
+
+## License
+
+MIT

package/README.zh-CN.md

@@ -0,0 +1,177 @@
+# ompweb
+
+[English](./README.md) | [日本語](./README.ja.md)
+
+社区：[加入 OMPWEB Discord](https://discord.gg/evqgGzRfM5)
+
+[oh-my-pi (omp) 编程智能体](https://github.com/can1357/oh-my-pi)的本地 Web UI。ompweb 读取本机的 omp 会话文件，在浏览器中提供一个工作区，支持会话浏览、实时对话、模型配置、技能管理和项目文件预览。
+
+![ompweb — 演示](docs/demo.gif)
+
+<d## 🌟 相比上游仓库的优化与增强 (Optimizations & Enhancements)
+
+本仓库（[37chengshan/ompweb](https://github.com/37chengshan/ompweb)）是基于 [kahme247/ompweb](https://github.com/kahme247/ompweb) 的功能增强与深度调优版本。基于实际代码实现，包含了以下关键特性新增、架构升级与性能优化：
+
+### 1. 🖥️ 内置交互式 Web 终端 (Interactive Web Terminal)
+- **真 PTY 伪终端支持 (`app/api/terminal/route.ts`, `components/EmbeddedTerminal.tsx`)**：利用 `python3 -c "import pty; pty.spawn(...)"` 生成原生 PTY，支持 ANSI 全彩高亮解析、双向 SSE 流式传输、有序输入序列化与终端窗口动态缩放（`cols`/`rows`）。
+- **底部可停靠面板**：直接在 Web 界面执行 Git 命令、调试脚本和运行测试，自带超时会话自动回收与环形缓冲区溢出保护。
+
+### 2. 📂 系统原生文件管理器联动与工作区排序 (File Explorer & Workspace Alias)
+- **常驻「在文件管理器中显示」快捷键 (`components/FileExplorer.tsx`, `app/api/files/open/route.ts`)**：工作区卡片与文件树节点提供常驻快捷按钮（无需 hover 悬停），跨平台调用系统原生文件管理器（macOS `open`、Windows `explorer.exe`、Linux `xdg-open`）。
+- **工作区别名与自定义排序 (`lib/project-registry.ts`, `lib/project-ordering.ts`)**：支持为工作区设置显示别名（Alias）并在侧边栏持久化自定义排序，不破坏磁盘目录结构。
+
+### 3. 🎨 视觉主题工作室与无障碍动效控制 (Theme Studio & Motion Controls)
+- **主题调色工作室 (`components/ThemeStudio.tsx`, `hooks/useTheme.ts`)**：支持自定义纸感/余烬设计系统 Token，所有色彩均通过 WCAG AA 对比度验证，提供浅色/深色/跟随系统一键轮转与个性化强调色调节。
+- **动效无障碍支持 (`hooks/useMotionPrefs.ts`)**：自动适配系统 `prefers-reduced-motion` 偏好，立即禁用耗性能的 SVG SMIL 动效并将平滑滚动转换为瞬时跳跃，保障低配设备流畅度。
+
+### 4. 🧭 计划模式看板与压缩前历史追溯 (Plan Mode & History Traceability)
+- **交互式计划看板 (`components/PlanPanel.tsx`, `lib/plan-reader.ts`)**：实时同步并渲染 `<session>/local/*-plan.md` 计划草稿，支持一键执行计划与弹窗提交结构化修改意见（`onRejectPlan`）。
+- **压缩前历史追溯 (`lib/session-reader.ts`)**：允许用户在顶栏展开浏览上下文压缩前的全部原始历史记录，不污染当前活跃上下文。
+
+### 5. ⚡ 前端渲染引擎与视口安全防御 (UI & React Rendering)
+- **流式 Markdown 增量绕过 (`components/MarkdownBody.tsx`)**：Token 流式输出期间跳过全文公式正则扫描（`normalizeDisplayMath`）与 KaTeX 插件动态加载，仅在消息提交时执行一次 AST 构建，保持 60fps 丝滑渲染。
+- **内存级 LRU 缓存加速 (`lib/markdown.ts`, `lib/patch.ts`)**：公式标准化内置 200 条容量 LRU 缓存，Unified Diff 解析内置 20 条容量 LRU 缓存（`patchCache`），消除重复计算。
+- **DOM 防雪崩与极端输出截断保护 (`components/MessageView.tsx`)**：Git Diff 视图设置 800 行硬上限（`MAX_ROWS = 800`），超长思考与 ToolResult 设置 100KB 防崩保护。
+- **组件细粒度 Memo 包装 (`components/PlanPanel.tsx`, `components/MessageView.tsx`)**：`React.memo` 阻断非必要级联重渲染。
+
+### 6. 🛡️ 后端 Node.js、RPC 进程与文件 I/O 加固 (Backend & Process Safety)
+- **Git 根目录内存持久缓存 + 并发去重 (`lib/worktree.ts`)**：延长 `PROJECT_CACHE_TTL_MS` 至 5 分钟，加入 `__piProjectPendingCache` 全局 Map 合并并行 Promise，杜绝重复 `git rev-parse` 进程风暴。
+- **SSE 僵尸连接彻底清理 (`app/api/agent/[id]/events/route.ts`, `lib/rpc-manager.ts`)**：会话终结或销毁时主动派发 `session_destroyed` 事件并安全关闭 `ReadableStream`，杜绝文件描述符与内存泄漏。
+- **子进程 Dispose 熔断保护 (`lib/omp/rpc-process.ts`)**：`RpcProcess.dispose()` 加入 `Promise.race` 熔断锁防止僵死进程挂起，`crlfDelay: Infinity` 标准化流式行解析。
+- **`deferThinking` 载荷瘦身 (`lib/session-reader.ts`, `lib/types.ts`)**：在延迟加载模式下直接从 JSON 结构中解构移除 thinking 字段，显著降低网络传输体积。
+
+### 7. ⚙️ MCP 管理器体验重构与内置 Agent MCP
+- **双模式可视化表单编辑器 (`components/McpConfig.tsx`)**：提供「可视化表单（协议、命令/URL、参数、启用开关）」与「JSON 代码」双模式，内置 `Python stdio`、`NPX stdio`、`Remote HTTP` 一键模板，支持项目与全局（`~/.omp/agent/mcp.json`）配置自由切换。
+- **多源分类折叠手风琴 (`components/McpConfig.tsx`)**：对跨客户端自动发现的 50+ 个服务端按来源折叠并支持实时搜索。
+- **内置 Agent MCP 预设与微调 (`vendor/agent-mcp/`)**：自带多 Agent 编排工具库，配合 SQLite 高并发优化（`PRAGMA temp_store=MEMORY`、autocommit 事务无锁化）、SSE 广播队列无锁化原子置换与指数退避等待算法。
+
+## 环境要求�会话终结或销毁时主动派发 `session_destroyed` 事件，SSE 流监听到后立即关闭 `ReadableStream` 并注销监听器，杜绝文件描述符与内存泄漏。
+- **子进程 Dispose 熔断保护 (`lib/omp/rpc-process.ts`)**：在 `RpcProcess.dispose()` 中加入 `Promise.race` 熔断定时器，即使操作系统偶发未能回收僵死进程，也能安全 resolve，防止 Promise 永久挂起；以 `crlfDelay: Infinity` 标准化流式行解析。
+- **原子文件操作异常清理 (`lib/omp/mcp-config.ts`)**：在原子写入中使用 `try ... finally { try { unlinkSync(temp); } catch {} }`，防止异常时残留 `.tmp-*` 孤儿文件。
+- **`deferThinking` 载荷瘦身 (`lib/session-reader.ts`, `lib/types.ts`)**：将 `ThinkingContent.thinking` 改为可选字段，在延迟加载模式下直接从 JSON 结构中解构移除该 key 而非返回空字符串，显著降低会话上下文网络传输开销。
+
+### 3. ⚙️ MCP 管理器重构与内置 Agent MCP
+- **双模式可视化表单编辑器 (`components/McpConfig.tsx`)**：提供「可视化表单（协议、命令/URL、参数、启用开关）」与「JSON 代码」双模式，内置 `Python stdio`、`NPX stdio`、`Remote HTTP` 一键模板，并支持在项目与全局配置（`~/.omp/agent/mcp.json`）之间无缝切换。
+- **多源分类折叠手风琴 (`components/McpConfig.tsx`)**：对跨客户端自动发现的 50+ 个服务端按来源折叠并支持实时搜索，彻底解决卡片溢出和遮挡问题。
+- **内置 Agent MCP 编排引擎**：内嵌 `agent-mcp` (v3.0.0) 预设与工具，配合 SQLite 高并发优化（`PRAGMA temp_store=MEMORY`、`isolation_level=None` autocommit 事务无锁化）、SSE 广播队列无锁化原子引用置换与指数退避等待算法。
+
+## 环境要求
+
+- 已安装 [omp](https://github.com/can1357/oh-my-pi) 且在 `PATH` 中（或通过 `OMP_WEB_OMP_BIN` 指向其二进制文件）
+- Node.js 22.19.0 或更高版本（`node --version`）
+
+## 快速开始
+
+**免安装直接运行：**
+
+```bash
+npx @kahme247/ompweb@latest
+```
+
+**或全局安装：**
+
+```bash
+npm install -g @kahme247/ompweb
+ompweb
+```
+
+然后打开 [http://127.0.0.1:30177](http://127.0.0.1:30177)。服务器就绪后，CLI 会尝试自动打开浏览器。ompweb 默认监听 `127.0.0.1`。
+
+**选项：**
+
+```bash
+ompweb --port 8080              # 自定义端口
+ompweb --hostname 0.0.0.0       # 在可信网络中暴露服务
+ompweb -p 8080 -H 0.0.0.0       # 组合使用
+ompweb --no-open                # 不自动打开浏览器
+
+ompweb --password "a-long-random-password" # 启用仅密码登录（Windows 同样适用）
+
+PORT=8080 ompweb                # 也支持环境变量
+OMP_WEB_HOSTNAME=0.0.0.0 ompweb # 显式暴露到网络
+OMP_WEB_PASSWORD='a-long-random-password' ompweb # 环境变量形式（POSIX）
+# Windows: $env:OMP_WEB_PASSWORD="secret"; ompweb
+OMP_WEB_NO_OPEN=1 ompweb        # 作为后台服务运行时很有用
+```
+
+设置 `OMP_WEB_PASSWORD` 可通过与主题集成的仅密码登录页面保护界面和所有 API 端点。登录成功后，会创建有效期为 30 天的 HTTP-only 签名会话 Cookie；留空则关闭认证。远程访问仍需通过受信任反向代理或 VPN 提供 HTTPS，以保护密码和会话 Cookie。默认仅监听 `127.0.0.1`；不要将 ompweb 直接暴露到互联网。
+
+## 功能特性
+
+- **随时接续之前的工作**：按项目浏览以往的 omp 对话，不必翻找终端历史或会话文件路径。
+- **放心尝试不同方向**：从更早的消息继续，或将会话分叉为一条独立路线。
+- **整理侧边栏**：归档不活跃会话而不删除原生记录，或在不再需要时明确删除。
+- **跨分支工作**：在侧边栏切换 Git 工作树，新会话和资源管理器都会跟随你选择的检出。
+- **边看项目边聊天**：左侧浏览文件，右侧预览源码、文档、图片、音频和 PDF，同时智能体继续工作。
+- **清晰掌握会话状态**：上下文用量、费用、压缩上下文状态和系统提示词详情都显示在顶栏。
+- **减少对终端配置的依赖**：在 Web UI 中管理模型、登录/API 密钥、模型测试、原生 OMP 控制（顾问、审批、Bash 策略、思考、压缩、记忆、自动学习、重试/回退）、技能、插件和项目 MCP 服务器。
+- **在设置中管理 MCP**：专用 MCP 标签页显示项目服务器状态（已启用 / 已禁用 / 无效），支持添加、编辑、重命名、校验和删除，并通过角落提示显示配置失败。
+- **保持 OMP 为最新版本**：可在设置中检查已安装运行时、更新它，并按需重启活动会话。
+- **及时获知完成状态**：可选择在智能体完成时接收浏览器通知，并检查已安装技能的更新。
+- **⌘K 随处跳转**：命令面板（⌘K / Ctrl+K）支持切换会话、新建会话和切换主题。
+- **温暖的纸感设计**：浅色/深色双主题，衬线展示字体，对比度经 WCAG AA 验证，基于令牌驱动的 UI 套件（Base UI 基元、cmdk、lucide 图标）构建。
+
+## 配置
+
+| 变量 | 含义 |
+| --- | --- |
+| `PORT` | 服务器端口（默认 `30177`；`-p/--port` 优先） |
+| `OMP_WEB_HOSTNAME` | 绑定主机名（默认 `127.0.0.1`；`-H/--hostname` 优先） |
+| `OMP_WEB_PASSWORD` | 登录页面使用的可选密码 |
+| `OMP_WEB_NO_OPEN` | 设为 `1`/`true` 可跳过自动打开浏览器 |
+| `OMP_WEB_OMP_BIN` | `omp` 不在 `PATH` 中时，指向其二进制文件的绝对路径 |
+| `PI_CODING_AGENT_DIR` | 指向其他 omp agent 目录（默认 `~/.omp/agent`） |
+| `HTTP_PROXY` / `HTTPS_PROXY` / `NO_PROXY` | 服务器端请求使用的标准代理变量 |
+
+## 架构
+
+ompweb 是一个由 Node 托管的 Next.js 应用，驱动你已安装的 `omp` 二进制文件——它并不内嵌智能体：
+
+- **实时会话**：启动 `omp --mode rpc-ui`（基于 stdio 的 NDJSON），每个活动会话对应一个子进程，因此智能体版本始终与你安装的完全一致。
+- **会话浏览**：直接读取 omp 的会话文件（`~/.omp/agent/sessions/<encoded-cwd>/<timestamp>_<uuid>.jsonl`）；标题、归档和删除是受保护的原生文件维护操作，不会与 OMP 的实时写入竞争。
+- **模型与认证**：通过 RPC 命令与 omp 子进程交互；模型面板编辑 omp agent 目录中的 `models.yml`。
+- **技能与插件**：扫描 omp 的技能目录（`~/.omp/agent/skills`、项目内 `.omp/skills` 及兼容目录），并调用 `omp plugin` 进行插件管理。
+- **文件访问**：文件浏览与预览仅限于所选项目目录以及会话中出现过的工作目录。
+- **分叉与会话内分支**：分叉会创建新的 `.jsonl` 文件；“从此处编辑”则在同一会话文件内创建另一个分支。
+
+## 开发
+
+```bash
+npm install
+npm run dev
+```
+
+本地开发服务器运行在 [http://127.0.0.1:30177](http://127.0.0.1:30177)。
+
+常用检查：
+
+```bash
+npx tsc --noEmit       # 类型检查
+npm run lint           # ESLint（零警告）
+node --test lib/*.test.mjs components/*.test.mjs   # 运行测试
+```
+
+本地开发时请避免运行 `next build` / `npm run build`。它会写入 `.next/`，可能干扰开发服务器；构建请留到发布阶段。
+
+## 多语言支持
+
+ompweb 支持英语、简体中文和日本語，三种语言均覆盖整个界面的翻译字符串。语言从 `navigator.language` 自动检测，可通过顶栏的语言菜单在运行时切换。选择会跨会话持久化。
+
+- 字典文件：`lib/i18n/locales/{en,zh-CN,ja}.json`
+- 框架：`lib/i18n/index.tsx` — 基于 `useSyncExternalStore` 的轻量 store，支持 `{var}` 插值和复数形式（`.one`/`.other`）
+- API 错误消息通过稳定的错误码（`errors.<code>`）在客户端翻译
+
+## 质量
+
+- **可访问性**：符合 WCAG AA 标准 — Lighthouse 可访问性评分 100/100，全键盘导航，焦点可见环，ARIA 角色
+- **性能**：列表组件 memo 化、RAF 节流滚动/鼠标处理、防抖搜索、流式 JSONL 读取器、ETag 缓存会话列表
+- **健壮性**：优雅关闭 omp 子进程（进程组杀死）、错误边界、原子化会话文件重写
+- **测试**：聚焦的测试套件覆盖会话解析、终端输入、Markdown 渲染、消息展示、原生设置和 MCP 配置
+
+## 致谢
+
+ompweb 分叉自 [agegr/pi-web](https://github.com/agegr/pi-web)（MIT）——[badlogic/pi-mono](https://github.com/badlogic/pi-mono) pi 编程智能体的 Web UI，并针对 [can1357/oh-my-pi](https://github.com/can1357/oh-my-pi) 进行了适配。
+
+## 许可证
+
+MIT