feat: Workspace browser terminal — walking skeleton (v7.7.0)

.gitignore

@@ -6,4 +6,5 @@ node_modules/
 .hooks/
 .agent-memory/
 hooks/
-.tmp/
+.tmp/
+package-lock.json

CLAUDE.md

@@ -41,7 +41,7 @@ docs/
 
 ## Key architecture decisions
 
-- **Zero dependencies** — only Node.js stdlib + system `sqlite3` CLI for SQLite agents
+- **Zero dependencies for the core** — dashboard/CLI use only Node.js stdlib + system `sqlite3` CLI for SQLite agents. The optional browser terminal (Workspace) is the sole exception: it lazily loads `@lydell/node-pty` (declared in `optionalDependencies`, prebuilt-only, never runs node-gyp). If it is absent the dashboard still runs and the terminal reports itself disabled. Do NOT add core dependencies.
 - **Node >= 18** — minimum supported version
 - **Single process** — server + static HTML in one process
 - **Template injection** — `html.js` reads CSS/JS files and injects via `split/join` (not `String.replace` which breaks on `$` characters in JS code)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "codbash-app",
-  "version": "7.6.0",
+  "version": "7.7.0",
   "description": "Dashboard + CLI for AI coding agents — Claude Code, Codex, Cursor, OpenCode, Kiro. View, search, resume, convert, sync sessions.",
   "bin": {
     "codbash": "./bin/cli.js",
@@ -38,5 +38,9 @@
   "license": "MIT",
   "engines": {
     "node": ">=18"
+  },
+  "comment:optionalDependencies": "Browser terminal (Workspace) only. @lydell/node-pty ships prebuilt binaries and never invokes node-gyp; if no prebuilt exists for the platform it is simply skipped and the dashboard still runs — the terminal feature stays disabled with a friendly notice. The core dashboard remains dependency-free.",
+  "optionalDependencies": {
+    "@lydell/node-pty": "^1.2.0-beta.12"
   }
 }

src/changelog.js

@@ -1,6 +1,17 @@
 'use strict';
 
 const CHANGELOG = [
+  {
+    version: '7.7.0',
+    date: '2026-07-19',
+    title: 'Workspace — browser terminal (preview)',
+    changes: [
+      'New "Workspace" view: a real terminal right in the browser (xterm.js) — run shells and agents without leaving codbash',
+      'Optional feature: the core dashboard stays dependency-free; the terminal lazily loads @lydell/node-pty, which ships prebuilt binaries (no compiler / node-gyp needed)',
+      'Secured by a per-process token + same-origin check on the WebSocket, so it is safe to run the dashboard in server mode',
+      'This is the first step (single pane); splits, reattach across reload, saved commands and per-project workspaces are coming next',
+    ],
+  },
   {
     version: '7.6.0',
     date: '2026-07-19',

src/frontend/app.js

@@ -1594,6 +1594,12 @@ function render() {
   var stats = document.getElementById('stats');
   if (!content) return;
 
+  // Tear down the live terminal when navigating away from the Workspace view
+  // so the pty + WebSocket don't leak in the background.
+  if (currentView !== 'workspace' && typeof teardownWorkspaceIfActive === 'function') {
+    teardownWorkspaceIfActive();
+  }
+
   // Preserve scroll + collapsed state across re-renders
   var scrollTop = content.scrollTop;
   var collapsedGroups = new Set();
@@ -1665,6 +1671,11 @@ function render() {
     return;
   }
 
+  if (currentView === 'workspace') {
+    renderWorkspace(content);
+    return;
+  }
+
   if (currentView === 'settings') {
     renderSettings(content);
     return;

src/frontend/index.html

@@ -61,6 +61,10 @@
                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="7" rx="1"/><rect x="14" y="3" width="7" height="7" rx="1"/><rect x="3" y="14" width="7" height="7" rx="1"/><rect x="14" y="14" width="7" height="7" rx="1"/></svg>
                 All Sessions
             </div>
+            <div class="sidebar-item" data-view="workspace" data-key="workspace">
+                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="3" width="20" height="18" rx="2"/><polyline points="6 8 9 11 6 14"/><line x1="12" y1="15" x2="17" y2="15"/></svg>
+                Workspace
+            </div>
             <div class="sidebar-item" data-view="projects">
                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 19a2 2 0 01-2 2H4a2 2 0 01-2-2V5a2 2 0 012-2h5l2 3h9a2 2 0 012 2z"/></svg>
                 Projects

src/frontend/sidebar-config.js

@@ -30,7 +30,7 @@
 
   var KNOWN_ITEM_KEYS = [
     // Workspace
-    'sessions', 'projects', 'timeline', 'activity', 'running',
+    'sessions', 'workspace', 'projects', 'timeline', 'activity', 'running',
     'analytics', 'starred', 'leaderboard', 'cloud',
     // Agents
     'claude-only', 'codex-only', 'qwen-only', 'pi-original-only', 'ohmypi-only', 'kiro-only', 'cursor-only',
@@ -53,6 +53,7 @@
   var NAV_HELP = {
     // Workspace
     'sessions': 'Every AI coding session across all agents, in one place',
+    'workspace': 'A live terminal in your browser — run shells and agents without leaving codbash',
     'projects': 'Browse sessions grouped by project folder',
     'timeline': 'Your sessions laid out on a chronological timeline',
     'activity': 'GitHub-style heatmap of your coding activity and streaks',

src/frontend/styles.css

@@ -2748,6 +2748,30 @@ body {
 
 /* ── Changelog ──────────────────────────────────────────────── */
 
+/* ── Workspace (browser terminal) ──────────────────────────── */
+.workspace-wrap {
+    display: flex;
+    flex-direction: column;
+    height: calc(100vh - 52px);
+}
+.workspace-bar {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    padding: 8px 14px;
+    border-bottom: 1px solid var(--border);
+    background: var(--bg-secondary);
+}
+.workspace-title { font-weight: 600; color: var(--text-primary); font-size: 13px; }
+.workspace-status { font-size: 12px; color: var(--text-muted); flex: 1; }
+.workspace-term {
+    flex: 1;
+    min-height: 0;
+    padding: 6px 8px;
+    background: #08090c;
+    overflow: hidden;
+}
+
 .changelog-container { padding: 20px; max-width: 700px; }
 
 /* ── Recommended tools view ────────────────────────────────── */