Add interactive terminal windows to canvas dashboard with tmux session management and SSH proxy support. ## Features - **TerminalShape**: Resizable terminal windows on canvas - **SessionBrowser**: UI for managing tmux sessions (list, attach, create) - **TerminalContent**: xterm.js-based terminal renderer with WebSocket streaming - **TerminalProxy**: SSH connection pooling and tmux command execution - **Collaboration Mode**: Read-only by default, owner can enable shared input - **Pin to View**: Keep terminal fixed during pan/zoom ## Implementation Frontend Components: - src/shapes/TerminalShapeUtil.tsx - Terminal shape definition - src/tools/TerminalTool.ts - Shape creation tool - src/components/TerminalContent.tsx - xterm.js integration with WebSocket - src/components/SessionBrowser.tsx - tmux session management UI - Registered in Board.tsx and CustomToolbar.tsx Backend Infrastructure: - worker/TerminalProxy.ts - SSH proxy with connection pooling - terminal-config.example.json - Configuration template Documentation: - TERMINAL_SPEC.md - Complete feature specification (19 sections) - TERMINAL_INTEGRATION.md - Backend setup guide with 2 deployment options ## Dependencies - @xterm/xterm ^5.5.0 - Terminal emulator - @xterm/addon-fit ^0.10.0 - Responsive sizing - @xterm/addon-web-links ^0.11.0 - Clickable URLs - ssh2 ^1.16.0 - SSH client for backend ## Next Steps See TERMINAL_INTEGRATION.md for: - Backend WebSocket server setup on DigitalOcean droplet - SSH configuration and security hardening - Testing and troubleshooting procedures ## Notes - Backend implementation requires separate WebSocket server (Cloudflare Workers lack PTY support) - Frontend components ready but need backend deployed to function - Mock data shown in SessionBrowser for development 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> |
||
|---|---|---|
| .. | ||
| shapes | ||
| AutomergeDurableObject.ts | ||
| TerminalProxy.ts | ||
| assetUploads.ts | ||
| types.ts | ||
| worker.ts | ||