paneful 0.8.7 → 0.8.8

package/README.md

@@ -26,17 +26,17 @@ paneful --install-app          # Install as a native macOS app
 
 ## Features
 
-### Drag & Drop Projects
+### Split Pane Layouts
 
-Drag a folder from Finder into the sidebar to create a new project with the path pre-filled.
+Five layout presets — columns, rows, main + stack, main + row, and grid. Cycle through them with `Cmd+T` or auto-reorganize with `Cmd+R`.
 
-### Drag Files into Terminals
+### Project Sidebar
 
-Drag files from Finder or your editor (VS Code, Cursor) into a terminal pane to paste their paths as shell-escaped arguments.
+Organize terminals by project. Each project gets its own layout, panes, and working directory. Switch instantly from the sidebar. Drag the right edge to resize — width persists across sessions.
 
-### Favourites
+### Drag & Drop
 
-Save a workspace layout as a favourite — name, layout preset, and per-pane commands. Launch any favourite with a click to instantly recreate the setup. Managed from the star icon in the toolbar and the favourites section in the sidebar.
+Drag folders from Finder into the sidebar to create projects with the path pre-filled. Drag files into terminal panes to paste their paths as shell-escaped arguments.
 
 ### Editor Sync
 
@@ -47,9 +47,13 @@ Requires:
 1. **Paneful** (native app) or **Terminal** (CLI) added to **System Settings > Privacy & Security > Accessibility**
 2. Editor window title includes the folder name (default in VS Code/Cursor)
 
-### Resizable Sidebar
+### Favourites
+
+Save a workspace layout as a favourite — name, layout preset, and per-pane commands. Launch any favourite with a click to instantly recreate the setup.
+
+### Dev Server Detection
 
-Drag the right edge of the sidebar to resize it. Width persists across sessions.
+Automatically detects when a dev server starts in a terminal (Vite, Next.js, Angular, etc.). A green dot appears next to the project name in the sidebar while the port is alive, and disappears when it stops. Tracks ports per-terminal so the same port across different projects is handled correctly.
 
 ### Auto-Reorganize
 

package/dist/server/claude-monitor.js

@@ -0,0 +1,106 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import os from 'node:os';
+// If the latest JSONL mtime is < 5s ago, Claude is actively working.
+// Otherwise Claude is open but idle (waiting for user input).
+const ACTIVE_THRESHOLD = 5_000;
+export class ClaudeMonitor {
+    claudeDir;
+    ptyManager;
+    projectStore;
+    onChange;
+    prevStatuses = {};
+    cachedLatestFile = new Map(); // cwd → latest .jsonl path
+    pollTimer = null;
+    destroyed = false;
+    constructor(ptyManager, projectStore, onChange) {
+        this.ptyManager = ptyManager;
+        this.projectStore = projectStore;
+        this.onChange = onChange;
+        this.claudeDir = path.join(os.homedir(), '.claude', 'projects');
+    }
+    start() {
+        this.pollTimer = setInterval(() => this.poll(), 3000);
+    }
+    destroy() {
+        this.destroyed = true;
+        if (this.pollTimer) {
+            clearInterval(this.pollTimer);
+            this.pollTimer = null;
+        }
+    }
+    poll() {
+        if (this.destroyed)
+            return;
+        // Step 1: Ask pty-manager which projects have `claude` as foreground process
+        const claudeProjects = this.ptyManager.getClaudeProjects();
+        // Step 2: For each, determine active vs idle by checking JSONL mtime
+        const statuses = {};
+        for (const projectId of claudeProjects) {
+            const project = this.projectStore.get(projectId);
+            if (!project)
+                continue;
+            const status = this.checkMtime(project.cwd) ? 'active' : 'idle';
+            statuses[projectId] = status;
+        }
+        // Step 3: Only notify if something changed
+        if (!this.statusesEqual(statuses)) {
+            this.prevStatuses = statuses;
+            this.onChange(statuses);
+        }
+    }
+    /** Returns true if the project's latest JSONL was modified within ACTIVE_THRESHOLD. */
+    checkMtime(cwd) {
+        // Fast path: stat only the cached latest file
+        const cached = this.cachedLatestFile.get(cwd);
+        if (cached) {
+            try {
+                const stat = fs.statSync(cached);
+                if ((Date.now() - stat.mtimeMs) < ACTIVE_THRESHOLD)
+                    return true;
+            }
+            catch {
+                // File gone — fall through to full scan
+                this.cachedLatestFile.delete(cwd);
+            }
+        }
+        // Full scan: find the latest .jsonl (runs once on first check, then only
+        // when the cached file is stale — i.e. Claude started a new session)
+        const folder = path.join(this.claudeDir, cwd.replace(/\//g, '-'));
+        try {
+            const files = fs.readdirSync(folder).filter((f) => f.endsWith('.jsonl'));
+            let maxMtime = 0;
+            let maxFile = '';
+            for (const file of files) {
+                try {
+                    const filePath = path.join(folder, file);
+                    const stat = fs.statSync(filePath);
+                    if (stat.mtimeMs > maxMtime) {
+                        maxMtime = stat.mtimeMs;
+                        maxFile = filePath;
+                    }
+                }
+                catch {
+                    // skip
+                }
+            }
+            if (maxFile)
+                this.cachedLatestFile.set(cwd, maxFile);
+            return maxMtime > 0 && (Date.now() - maxMtime) < ACTIVE_THRESHOLD;
+        }
+        catch {
+            return false;
+        }
+    }
+    statusesEqual(next) {
+        const prevKeys = Object.keys(this.prevStatuses);
+        const nextKeys = Object.keys(next);
+        if (prevKeys.length !== nextKeys.length)
+            return false;
+        for (const key of nextKeys) {
+            if (this.prevStatuses[key] !== next[key])
+                return false;
+        }
+        return true;
+    }
+}

package/dist/server/pty-manager.js

@@ -72,4 +72,20 @@ export class PtyManager {
     terminalExists(terminalId) {
         return this.sessions.has(terminalId);
     }
+    /** Returns projectIds that have a terminal with `claude` as the foreground process. */
+    getClaudeProjects() {
+        const result = new Set();
+        for (const managed of this.sessions.values()) {
+            try {
+                const proc = managed.process.process;
+                if (proc === 'claude') {
+                    result.add(managed.projectId);
+                }
+            }
+            catch {
+                // PTY may have been killed
+            }
+        }
+        return result;
+    }
 }

package/dist/server/ws-handler.js

@@ -1,12 +1,14 @@
 import { WebSocket, WebSocketServer } from 'ws';
 import { newProject } from './project-store.js';
 import { PortMonitor } from './port-monitor.js';
+import { ClaudeMonitor } from './claude-monitor.js';
 export class WsHandler {
     wss;
     client = null;
     ptyManager;
     projectStore;
     portMonitor;
+    claudeMonitor;
     idleTimer = null;
     onIdle;
     constructor(server, ptyManager, projectStore, options) {
@@ -16,6 +18,10 @@ export class WsHandler {
         this.portMonitor = new PortMonitor((ports) => {
             this.send({ type: 'port:status', ports });
         });
+        this.claudeMonitor = new ClaudeMonitor(ptyManager, projectStore, (statuses) => {
+            this.send({ type: 'claude:status', statuses });
+        });
+        this.claudeMonitor.start();
         this.wss = new WebSocketServer({ noServer: true });
         server.on('upgrade', (req, socket, head) => {
             if (req.url === '/ws') {
@@ -119,6 +125,7 @@ export class WsHandler {
     }
     destroy() {
         this.portMonitor.destroy();
+        this.claudeMonitor.destroy();
     }
     handlePtySpawn(terminalId, projectId, cwd) {
         try {