diff --git a/.claude/CLAUDE.md b/.claude/CLAUDE.md index 4933885..58fa81a 100644 --- a/.claude/CLAUDE.md +++ b/.claude/CLAUDE.md @@ -3,7 +3,8 @@ ## Workflow - v1 is a single-file Python app (`bterminal.py`). Changes are localized. -- v2 planning docs are in `docs/`. Architecture decisions are in `docs/task_plan.md`. +- v2 docs are in `docs/`. Architecture decisions are in `docs/task_plan.md`. +- Phase 2 (Terminal Pane + Layout) is complete. Phase 3 (Agent SDK) is next. - Consult Memora (tag: `bterminal`) before making architectural changes. ## Documentation References diff --git a/CHANGELOG.md b/CHANGELOG.md index 54eb805..bc43012 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,10 +8,19 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## [Unreleased] ### Added -- v2 project scaffolding: Tauri 2.x + Svelte 5 in `v2/` directory (Phase 1 complete) -- Rust backend stubs: main.rs, lib.rs, pty.rs, sidecar.rs, watcher.rs, session.rs -- Svelte frontend with Catppuccin Mocha CSS variables and component structure -- Node.js sidecar scaffold with NDJSON communication pattern +- Rust PTY backend with portable-pty: spawn, write, resize, kill with Tauri event streaming (Phase 2) +- xterm.js terminal pane with Canvas addon, FitAddon, and Catppuccin Mocha theme (Phase 2) +- CSS Grid tiling layout with 5 presets: 1-col, 2-col, 3-col, 2x2, master-stack (Phase 2) +- Layout store with Svelte 5 $state runes and auto-preset selection (Phase 2) +- Sidebar with session list, layout preset selector, and new terminal button (Phase 2) +- Keyboard shortcuts: Ctrl+N new terminal, Ctrl+1-4 focus pane (Phase 2) +- PTY bridge adapter for Tauri IPC (invoke + event listeners) (Phase 2) +- PaneContainer component with header bar, status indicator, and close button (Phase 2) +- Terminal resize handling with ResizeObserver and 100ms debounce (Phase 2) +- v2 project scaffolding: Tauri 2.x + Svelte 5 in `v2/` directory (Phase 1) +- Rust backend stubs: main.rs, lib.rs, pty.rs, sidecar.rs, watcher.rs, session.rs (Phase 1) +- Svelte frontend with Catppuccin Mocha CSS variables and component structure (Phase 1) +- Node.js sidecar scaffold with NDJSON communication pattern (Phase 1) - v2 architecture planning: Tauri 2.x + Svelte 5 + Claude Agent SDK via Node.js sidecar - Research documentation covering Agent SDK, xterm.js performance, Tauri ecosystem, and ultrawide layout patterns - Phased implementation plan (6 phases, MVP = Phases 1-4) diff --git a/README.md b/README.md index f6467da..d623b96 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@ Terminal with session panel (MobaXterm-style), built with GTK 3 + VTE. Catppuccin Mocha theme. -> **v2 in progress (Phase 1 complete):** Redesign as a multi-session Claude agent dashboard using Tauri 2.x + Svelte 5 + Claude Agent SDK. Project scaffolded on branch `v2-mission-control`. See [docs/task_plan.md](docs/task_plan.md) for architecture and [docs/phases.md](docs/phases.md) for implementation plan. +> **v2 in progress (Phase 2 complete):** Redesign as a multi-session Claude agent dashboard using Tauri 2.x + Svelte 5 + Claude Agent SDK. Working multi-pane terminal with PTY backend, CSS Grid tiling, and Catppuccin theme on branch `v2-mission-control`. See [docs/task_plan.md](docs/task_plan.md) for architecture and [docs/phases.md](docs/phases.md) for implementation plan. ![BTerminal](screenshot.png) diff --git a/TODO.md b/TODO.md index 3728723..fc57566 100644 --- a/TODO.md +++ b/TODO.md @@ -2,12 +2,13 @@ ## Active -- [ ] **Phase 2: Terminal Pane + Layout** — CSS Grid tiling, xterm.js with Canvas addon, PTY via portable-pty, SSH/shell/Claude CLI support. - [ ] **Phase 3: Agent SDK Integration** — Node.js sidecar, SDK message adapter, structured agent panes with tool call cards. - [ ] **Phase 4: Session Management + Markdown** — SQLite persistence, session CRUD, file watcher, markdown rendering. MVP ship after this phase. -- [ ] **Benchmark Canvas xterm.js** — Verify <50ms latency with 4 panes on target hardware (Phase 2 gate for Electron escape hatch). +- [ ] **Pane drag-resize handles** — Deferred from Phase 2, current presets sufficient for MVP. +- [ ] **Copy/paste (Ctrl+Shift+C/V)** — Deferred from Phase 2. - [ ] **Evaluate Deno as sidecar runtime** — Single binary, better packaging than Node.js. Test SDK compatibility. ## Completed +- [x] **Phase 2: Terminal Pane + Layout** — PTY backend (portable-pty), xterm.js + Canvas addon, CSS Grid tiling (5 presets), sidebar, keyboard shortcuts. | Done: 2026-03-05 - [x] **Phase 1: Project Scaffolding** — Tauri 2.x + Svelte 5 scaffolded in `v2/`, Catppuccin theme, Rust stubs, sidecar scaffold. | Done: 2026-03-05 diff --git a/docs/findings.md b/docs/findings.md index 613ca92..7a8eb0e 100644 --- a/docs/findings.md +++ b/docs/findings.md @@ -132,17 +132,17 @@ Zellij uses WASM plugins for extensibility: ## 6. Frontend Framework Choice -### Why Solid.js -- **Fine-grained reactivity** — updates only the DOM nodes that changed, not the component tree +### Why Svelte 5 (revised from initial Solid.js choice) +- **Fine-grained reactivity** — $state/$derived runes match Solid's signals model - **No VDOM** — critical when we have 4-8 panes each streaming data -- **Small bundle** — ~7KB vs React's ~40KB -- **JSX familiar** — easy for anyone who knows React -- **Signals** — perfect for streaming agent state +- **Small bundle** — ~5KB runtime vs React's ~40KB +- **Larger ecosystem** — more component libraries, xterm.js wrappers, better tooling +- **Better TypeScript support** — improved in Svelte 5 -### Alternative: Svelte -- Also no VDOM, also reactive, slightly larger community -- Slightly more ceremony for stores/state management -- Would also work, personal preference +### Why NOT Solid.js (initial choice, revised) +- Ecosystem too small for production use +- Fewer component libraries and integrations +- Svelte 5 runes eliminated the ceremony gap ### NOT React - VDOM reconciliation across 4-8 simultaneously updating panes = CPU waste diff --git a/docs/progress.md b/docs/progress.md index 2a07516..314c256 100644 --- a/docs/progress.md +++ b/docs/progress.md @@ -43,5 +43,22 @@ - [x] Project meta files: CLAUDE.md, .claude/CLAUDE.md, TODO.md, CHANGELOG.md - [x] Documentation structure: docs/README.md, task_plan.md, phases.md, findings.md, progress.md +### Phase 2: Terminal Pane + Layout (complete) +- [x] Rust PTY backend with portable-pty (PtyManager: spawn, write, resize, kill) +- [x] PTY reader thread emitting Tauri events (pty-data-{id}, pty-exit-{id}) +- [x] Tauri commands: pty_spawn, pty_write, pty_resize, pty_kill +- [x] xterm.js terminal pane with Canvas addon (explicit, no WebGL) +- [x] Catppuccin Mocha theme for xterm.js (16 ANSI colors) +- [x] FitAddon with ResizeObserver + 100ms debounce +- [x] PTY bridge adapter (spawnPty, writePty, resizePty, killPty, onPtyData, onPtyExit) +- [x] CSS Grid tiling layout with 5 presets (1-col, 2-col, 3-col, 2x2, master-stack) +- [x] Layout store with Svelte 5 $state runes and auto-preset selection +- [x] Sidebar with session list, layout preset selector, new terminal button +- [x] Keyboard shortcuts: Ctrl+N new terminal, Ctrl+1-4 focus pane +- [x] PaneContainer with header bar (title, status, close) +- [x] Empty state welcome screen with Ctrl+N hint +- [x] npm dependencies: @xterm/xterm, @xterm/addon-canvas, @xterm/addon-fit +- [x] Cargo dependencies: portable-pty, uuid + ### Next Steps -- [ ] Begin Phase 2: Terminal Pane + Layout (CSS Grid, xterm.js, PTY) +- [ ] Begin Phase 3: Agent SDK Integration (Node.js sidecar, SDK message adapter) diff --git a/docs/task_plan.md b/docs/task_plan.md index 75e4c49..3247e30 100644 --- a/docs/task_plan.md +++ b/docs/task_plan.md @@ -3,7 +3,7 @@ ## Goal Redesign BTerminal from a GTK3 terminal emulator into a **multi-session Claude agent dashboard** optimized for 32:9 ultrawide (5120x1440). Simultaneous visibility of all active sessions, agent tree visualization, inline markdown rendering, maximum information density. -## Status: PLANNING (Rev 2 — post-adversarial review) +## Status: BUILDING (Phase 2 complete — Rev 2) ---