feat: add preview sidebar with dev server support

drizzle/0006_acoustic_luke_cage.sql

@@ -0,0 +1,9 @@
+CREATE TABLE `dev_credentials` (
+	`id` text PRIMARY KEY NOT NULL,
+	`label` text NOT NULL,
+	`email` text NOT NULL,
+	`encrypted_password` text NOT NULL,
+	`domain` text,
+	`created_at` integer,
+	`updated_at` integer
+);

electron.vite.config.ts

@@ -58,6 +58,9 @@ export default defineConfig({
           : undefined,
       }),
     ],
+    server: {
+      port: 5199, // Use non-default port to avoid conflict with worktree dev servers
+    },
     resolve: {
       alias: {
         "@": resolve(__dirname, "src/renderer"),

src/main/index.ts

@@ -28,6 +28,7 @@ import {
 } from "./lib/cli"
 import { cleanupGitWatchers } from "./lib/git/watcher"
 import { cancelAllPendingOAuth, handleMcpOAuthCallback } from "./lib/mcp-auth"
+import { terminalManager, portManager } from "./lib/terminal"
 import {
   createMainWindow,
   createWindow,
@@ -907,6 +908,10 @@ if (gotTheLock) {
   app.on("before-quit", async () => {
     console.log("[App] Shutting down...")
     cancelAllPendingOAuth()
+    // Kill all terminal sessions (including child processes like dev servers)
+    // This prevents orphan processes from consuming memory after app quits
+    await terminalManager.cleanup()
+    portManager.stopAllScanning()
     await cleanupGitWatchers()
     await shutdownAnalytics()
     await closeDatabase()

src/main/lib/db/schema/index.ts

@@ -103,6 +103,24 @@ export const claudeCodeCredentials = sqliteTable("claude_code_credentials", {
   userId: text("user_id"), // Desktop auth user ID (for reference)
 })
 
+// ============ DEV CREDENTIALS ============
+// Stores encrypted credentials for auto-filling login forms in preview
+export const devCredentials = sqliteTable("dev_credentials", {
+  id: text("id")
+    .primaryKey()
+    .$defaultFn(() => createId()),
+  label: text("label").notNull(), // Friendly name like "Test User 1"
+  email: text("email").notNull(),
+  encryptedPassword: text("encrypted_password").notNull(), // Encrypted with safeStorage
+  domain: text("domain"), // Optional domain hint for filtering
+  createdAt: integer("created_at", { mode: "timestamp" }).$defaultFn(
+    () => new Date(),
+  ),
+  updatedAt: integer("updated_at", { mode: "timestamp" }).$defaultFn(
+    () => new Date(),
+  ),
+})
+
 // ============ ANTHROPIC ACCOUNTS (Multi-account support) ============
 // Stores multiple Anthropic OAuth accounts for quick switching
 export const anthropicAccounts = sqliteTable("anthropic_accounts", {
@@ -137,6 +155,8 @@ export type SubChat = typeof subChats.$inferSelect
 export type NewSubChat = typeof subChats.$inferInsert
 export type ClaudeCodeCredential = typeof claudeCodeCredentials.$inferSelect
 export type NewClaudeCodeCredential = typeof claudeCodeCredentials.$inferInsert
+export type DevCredential = typeof devCredentials.$inferSelect
+export type NewDevCredential = typeof devCredentials.$inferInsert
 export type AnthropicAccount = typeof anthropicAccounts.$inferSelect
 export type NewAnthropicAccount = typeof anthropicAccounts.$inferInsert
 export type AnthropicSettings = typeof anthropicSettings.$inferSelect

src/main/lib/terminal/manager.ts

@@ -1,6 +1,7 @@
 import { EventEmitter } from "node:events"
 import { FALLBACK_SHELL, SHELL_CRASH_THRESHOLD_MS } from "./env"
 import { portManager } from "./port-manager"
+import { getProcessTree } from "./port-scanner"
 import { createSession, setupInitialCommands } from "./session"
 import type {
 	CreateSessionParams,
@@ -65,6 +66,9 @@ export class TerminalManager extends EventEmitter {
 
 		portManager.registerSession(session, workspaceId || "")
 
+		// Emit started event so subscribers know a session was created
+		this.emit(`started:${paneId}`, session.cwd)
+
 		return {
 			isNew: true,
 			serializedState: "",
@@ -111,10 +115,10 @@ export class TerminalManager extends EventEmitter {
 
 			this.emit(`exit:${paneId}`, exitCode, signal)
 
-			// Clean up session after delay
+			// Clean up session after short delay (allows late exit event handlers to fire)
 			const timeout = setTimeout(() => {
 				this.sessions.delete(paneId)
-			}, 5000)
+			}, 500)
 			timeout.unref()
 		})
 	}
@@ -169,7 +173,27 @@ export class TerminalManager extends EventEmitter {
 		}
 	}
 
-	signal(params: { paneId: string; signal?: string }): void {
+	/**
+	 * Kill all processes in a process tree (shell + all child processes like bun, node, webpack, etc.)
+	 * This prevents orphaned child processes from consuming memory after the shell exits.
+	 */
+	private async killProcessTree(pid: number, signal: NodeJS.Signals = "SIGTERM"): Promise<void> {
+		try {
+			const pids = await getProcessTree(pid)
+			// Kill in reverse order (children first, then parent) for cleaner shutdown
+			for (const childPid of pids.reverse()) {
+				try {
+					process.kill(childPid, signal)
+				} catch {
+					// Process may have already exited
+				}
+			}
+		} catch {
+			// getProcessTree may fail if process already exited
+		}
+	}
+
+	async signal(params: { paneId: string; signal?: string }): Promise<void> {
 		const { paneId, signal = "SIGTERM" } = params
 		const session = this.sessions.get(paneId)
 
@@ -180,6 +204,11 @@ export class TerminalManager extends EventEmitter {
 			return
 		}
 
+		// Kill entire process tree, not just the shell
+		const ptyPid = session.pty.pid
+		if (ptyPid) {
+			await this.killProcessTree(ptyPid, signal as NodeJS.Signals)
+		}
 		session.pty.kill(signal)
 		session.lastActive = Date.now()
 	}
@@ -193,11 +222,50 @@ export class TerminalManager extends EventEmitter {
 			return
 		}
 
-		if (session.isAlive) {
-			session.pty.kill()
-		} else {
+		if (!session.isAlive) {
 			this.sessions.delete(paneId)
+			return
+		}
+
+		const ptyPid = session.pty.pid
+
+		// Send SIGTERM to entire process tree first
+		try {
+			if (ptyPid) {
+				await this.killProcessTree(ptyPid, "SIGTERM")
+			}
+			session.pty.kill("SIGTERM")
+		} catch (error) {
+			console.error(`[TerminalManager] Failed to send SIGTERM to ${paneId}:`, error)
 		}
+
+		// Wait for graceful shutdown, then escalate to SIGKILL
+		await new Promise<void>((resolve) => {
+			const checkInterval = setInterval(() => {
+				if (!session.isAlive) {
+					clearInterval(checkInterval)
+					clearTimeout(forceKillTimeout)
+					resolve()
+				}
+			}, 100)
+
+			const forceKillTimeout = setTimeout(async () => {
+				clearInterval(checkInterval)
+				if (session.isAlive) {
+					try {
+						// SIGKILL entire process tree
+						if (ptyPid) {
+							await this.killProcessTree(ptyPid, "SIGKILL")
+						}
+						session.pty.kill("SIGKILL")
+					} catch (error) {
+						console.error(`[TerminalManager] Failed to send SIGKILL to ${paneId}:`, error)
+					}
+				}
+				// Give SIGKILL a moment to take effect
+				setTimeout(resolve, 100)
+			}, 2000)
+		})
 	}
 
 	detach(params: { paneId: string; serializedState?: string }): void {
@@ -365,11 +433,13 @@ export class TerminalManager extends EventEmitter {
 	}
 
 	async cleanup(): Promise<void> {
+		console.log(`[TerminalManager] Cleanup: killing ${this.sessions.size} sessions`)
 		const exitPromises: Promise<void>[] = []
 
 		for (const [paneId, session] of this.sessions.entries()) {
 			if (session.isAlive) {
-				const exitPromise = new Promise<void>((resolve) => {
+				const ptyPid = session.pty.pid
+				const exitPromise = new Promise<void>(async (resolve) => {
 					let timeoutId: ReturnType<typeof setTimeout> | undefined
 					const exitHandler = () => {
 						this.off(`exit:${paneId}`, exitHandler)
@@ -380,21 +450,31 @@ export class TerminalManager extends EventEmitter {
 					}
 					this.once(`exit:${paneId}`, exitHandler)
 
-					timeoutId = setTimeout(() => {
+					// Kill entire process tree (not just shell) to prevent orphan processes
+					if (ptyPid) {
+						await this.killProcessTree(ptyPid, "SIGTERM")
+					}
+					session.pty.kill()
+
+					timeoutId = setTimeout(async () => {
 						this.off(`exit:${paneId}`, exitHandler)
+						// Force kill if still alive after timeout
+						if (session.isAlive && ptyPid) {
+							await this.killProcessTree(ptyPid, "SIGKILL")
+						}
 						resolve()
 					}, 2000)
 					timeoutId.unref()
 				})
 
 				exitPromises.push(exitPromise)
-				session.pty.kill()
 			}
 		}
 
 		await Promise.all(exitPromises)
 		this.sessions.clear()
 		this.removeAllListeners()
+		console.log("[TerminalManager] Cleanup complete")
 	}
 }