@myrialabs/clopen 0.0.7 → 0.0.8

package/backend/index.ts

@@ -14,6 +14,7 @@ import { debug } from '$shared/utils/logger';
 import { findAvailablePort } from './lib/shared/port-utils';
 import { networkInterfaces } from 'os';
 import { resolve } from 'node:path';
+import { statSync } from 'node:fs';
 
 // Import WebSocket router
 import { wsRouter } from './ws';
@@ -57,19 +58,27 @@ const app = new Elysia()
 	.use(wsRouter.asPlugin('/ws'));
 
 if (!isDevelopment) {
-	// Production: serve static files from dist/ using @elysiajs/static
-	const { staticPlugin } = await import('@elysiajs/static');
-
-	app.use(staticPlugin({
-		assets: 'dist',
-		prefix: '/',
-	}));
-
-	// SPA fallback: serve index.html for any unmatched route (client-side routing)
+	// Production: serve static files manually instead of @elysiajs/static.
+	// The static plugin tries to serve directories (like /) as files via Bun.file(),
+	// which hangs on some devices/platforms. Using statSync to verify the path is
+	// an actual file before serving avoids this issue.
 	const distDir = resolve(process.cwd(), 'dist');
 	const indexHtml = await Bun.file(resolve(distDir, 'index.html')).text();
 
-	app.get('/*', () => {
+	app.all('/*', ({ path }) => {
+		// Serve static files from dist/
+		if (path !== '/' && !path.includes('..')) {
+			const filePath = resolve(distDir, path.slice(1));
+			if (filePath.startsWith(distDir)) {
+				try {
+					if (statSync(filePath).isFile()) {
+						return new Response(Bun.file(filePath));
+					}
+				} catch {}
+			}
+		}
+
+		// SPA fallback: serve cached index.html
 		return new Response(indexHtml, {
 			headers: { 'Content-Type': 'text/html; charset=utf-8' }
 		});

package/backend/lib/terminal/stream-manager.ts

@@ -49,17 +49,20 @@ class TerminalStreamManager {
   ): string {
     // Check if there's already a stream for this session
     const existingStreamId = this.sessionToStream.get(sessionId);
+    let preservedOutput: string[] = [];
     if (existingStreamId) {
       const existingStream = this.streams.get(existingStreamId);
       if (existingStream) {
-        // Clean up existing stream first
         if (existingStream.pty && existingStream.pty !== pty) {
-          // If it's a different PTY, kill the old one
+          // Different PTY, kill the old one
           try {
             existingStream.pty.kill();
           } catch (error) {
             // Ignore error if PTY already killed
           }
+        } else if (existingStream.pty === pty) {
+          // Same PTY (reconnection after browser refresh) - preserve output buffer
+          preservedOutput = [...existingStream.output];
         }
         // Remove the old stream
         this.streams.delete(existingStreamId);
@@ -79,7 +82,7 @@ class TerminalStreamManager {
       workingDirectory,
       projectPath,
       projectId,
-      output: [],
+      output: preservedOutput,
       processId: pty.pid,
       outputStartIndex: outputStartIndex || 0
     };

package/backend/ws/terminal/session.ts

@@ -179,6 +179,22 @@ export const sessionHandler = createRouter()
 
 		debug.log('terminal', `✅ Added fresh listeners to PTY session ${sessionId}`);
 
+		// Replay historical output for reconnection (e.g., after browser refresh)
+		// The stream preserves output from the old stream when reconnecting to the same PTY.
+		// Replay from outputStartIndex so frontend receives all output it doesn't have yet.
+		const historicalOutput = terminalStreamManager.getOutput(registeredStreamId, outputStartIndex);
+		if (historicalOutput.length > 0) {
+			debug.log('terminal', `📜 Replaying ${historicalOutput.length} historical output entries for session ${sessionId}`);
+			for (const output of historicalOutput) {
+				ws.emit.project(projectId, 'terminal:output', {
+					sessionId,
+					content: output,
+					projectId,
+					timestamp: new Date().toISOString()
+				});
+			}
+		}
+
 		// Broadcast terminal tab created to all project users
 		ws.emit.project(projectId, 'terminal:tab-created', {
 			sessionId,
@@ -379,4 +395,36 @@ export const sessionHandler = createRouter()
 				message: 'PTY not found'
 			};
 		}
+	})
+
+	// List active PTY sessions for a project
+	// Used after browser refresh to discover existing sessions
+	.http('terminal:list-sessions', {
+		data: t.Object({
+			projectId: t.String()
+		}),
+		response: t.Object({
+			sessions: t.Array(t.Object({
+				sessionId: t.String(),
+				pid: t.Number(),
+				cwd: t.String(),
+				createdAt: t.String(),
+				lastActivityAt: t.String()
+			}))
+		})
+	}, async ({ data }) => {
+		const { projectId } = data;
+
+		const allSessions = ptySessionManager.getAllSessions();
+		const projectSessions = allSessions
+			.filter(session => session.projectId === projectId)
+			.map(session => ({
+				sessionId: session.sessionId,
+				pid: session.pty.pid,
+				cwd: session.cwd,
+				createdAt: session.createdAt.toISOString(),
+				lastActivityAt: session.lastActivityAt.toISOString()
+			}));
+
+		return { sessions: projectSessions };
 	});

package/bun.lock

@@ -8,7 +8,6 @@
         "@anthropic-ai/claude-agent-sdk": "^0.2.7",
         "@anthropic-ai/sdk": "^0.62.0",
         "@elysiajs/cors": "^1.4.0",
-        "@elysiajs/static": "^1.4.7",
         "@iconify-json/lucide": "^1.2.57",
         "@iconify-json/material-icon-theme": "^1.2.16",
         "@modelcontextprotocol/sdk": "^1.26.0",
@@ -77,8 +76,6 @@
 
     "@elysiajs/cors": ["@elysiajs/cors@1.4.0", "", { "peerDependencies": { "elysia": ">= 1.4.0" } }, "sha512-pb0SCzBfFbFSYA/U40HHO7R+YrcXBJXOWgL20eSViK33ol1e20ru2/KUaZYo5IMUn63yaTJI/bQERuQ+77ND8g=="],
 
-    "@elysiajs/static": ["@elysiajs/static@1.4.7", "", { "peerDependencies": { "elysia": ">= 1.4.0" } }, "sha512-Go4kIXZ0G3iWfkAld07HmLglqIDMVXdyRKBQK/sVEjtpDdjHNb+rUIje73aDTWpZYg4PEVHUpi9v4AlNEwrQug=="],
-
     "@emnapi/runtime": ["@emnapi/runtime@1.4.5", "", { "dependencies": { "tslib": "^2.4.0" } }, "sha512-++LApOtY0pEEz1zrd9vy1/zXVaVJJ/EbAF3u0fXIzPJEDtnITsBGbbK0EkM72amhl/R5b+5xx0Y/QhcVOpuulg=="],
 
     "@esbuild/aix-ppc64": ["@esbuild/aix-ppc64@0.25.8", "", { "os": "aix", "cpu": "ppc64" }, "sha512-urAvrUedIqEiFR3FYSLTWQgLu5tb+m0qZw0NBEasUeo6wuqatkMDaRT+1uABiGXEu5vqgPd7FGE1BhsAIy9QVA=="],

package/frontend/lib/services/terminal/project.service.ts

@@ -98,28 +98,83 @@ class TerminalProjectManager {
 
 	/**
 	 * Create initial terminal sessions for a project
+	 * First checks backend for existing PTY sessions (e.g., after browser refresh)
 	 */
 	private async createProjectTerminalSessions(projectId: string, projectPath: string): Promise<void> {
-		// Creating terminal session for project
-		
 		const context = this.getOrCreateProjectContext(projectId, projectPath);
-		
-		// Create only 1 terminal session by default with correct project path and projectId
+
+		// Check backend for existing PTY sessions (survives browser refresh)
+		const existingBackendSessions = await terminalService.listProjectSessions(projectId);
+
+		if (existingBackendSessions.length > 0) {
+			debug.log('terminal', `Found ${existingBackendSessions.length} existing PTY sessions for project ${projectId}`);
+
+			// Sort by sessionId to maintain consistent order (terminal-1, terminal-2, etc.)
+			existingBackendSessions.sort((a, b) => a.sessionId.localeCompare(b.sessionId));
+
+			// Restore all existing sessions as tabs
+			for (const backendSession of existingBackendSessions) {
+				const sessionParts = backendSession.sessionId.split('-');
+				const terminalNumber = sessionParts[sessionParts.length - 1] || '1';
+
+				const terminalSession: TerminalSession = {
+					id: backendSession.sessionId,
+					name: `Terminal ${terminalNumber}`,
+					directory: backendSession.cwd || projectPath,
+					lines: [],
+					commandHistory: [],
+					isActive: false,
+					createdAt: new Date(backendSession.createdAt),
+					lastUsedAt: new Date(backendSession.lastActivityAt),
+					shellType: 'Unknown',
+					terminalBuffer: undefined,
+					projectId: projectId,
+					projectPath: projectPath
+				};
+
+				terminalStore.addSession(terminalSession);
+				terminalSessionManager.createSession(backendSession.sessionId, projectId, projectPath, backendSession.cwd || projectPath);
+				context.sessionIds.push(backendSession.sessionId);
+
+				// Update nextSessionId to avoid ID conflicts
+				const match = backendSession.sessionId.match(/terminal-(\d+)/);
+				if (match) {
+					terminalStore.updateNextSessionId(parseInt(match[1], 10) + 1);
+				}
+			}
+
+			// Restore previously active session from sessionStorage, or default to first
+			let activeSessionId = existingBackendSessions[0].sessionId;
+			if (typeof sessionStorage !== 'undefined') {
+				try {
+					const savedActiveId = sessionStorage.getItem(`terminal-active-session-${projectId}`);
+					if (savedActiveId && context.sessionIds.includes(savedActiveId)) {
+						activeSessionId = savedActiveId;
+					}
+				} catch {
+					// sessionStorage not available
+				}
+			}
+			context.activeSessionId = activeSessionId;
+			terminalStore.switchToSession(context.activeSessionId);
+			this.persistContexts();
+			return;
+		}
+
+		// No existing backend sessions, create 1 new terminal session
 		const sessionId = terminalStore.createNewSession(projectPath, projectPath, projectId);
-		
-		// Update the session's directory to ensure it's correct
+
 		const session = terminalStore.getSession(sessionId);
 		if (session) {
 			session.directory = projectPath;
 		}
-		
-		// Create a fresh session in terminalSessionManager with correct project association
+
 		terminalSessionManager.createSession(sessionId, projectId, projectPath, projectPath);
-		
+
 		context.sessionIds.push(sessionId);
 		context.activeSessionId = sessionId;
 		terminalStore.switchToSession(sessionId);
-		
+
 		this.persistContexts();
 	}
 

package/frontend/lib/services/terminal/terminal.service.ts

@@ -339,6 +339,25 @@ export class TerminalService {
 		}
 	}
 
+	/**
+	 * List active PTY sessions for a project on the backend
+	 * Used after browser refresh to discover existing sessions
+	 */
+	async listProjectSessions(projectId: string): Promise<Array<{
+		sessionId: string;
+		pid: number;
+		cwd: string;
+		createdAt: string;
+		lastActivityAt: string;
+	}>> {
+		try {
+			const data = await ws.http('terminal:list-sessions', { projectId }, 5000);
+			return data.sessions || [];
+		} catch {
+			return [];
+		}
+	}
+
 	/**
 	 * Cleanup listeners for a session
 	 */

package/frontend/lib/stores/features/terminal.svelte.ts

@@ -138,6 +138,16 @@ export const terminalStore = {
 		}));
 
 		terminalState.activeSessionId = sessionId;
+
+		// Persist active session ID for restoration after browser refresh
+		const session = terminalState.sessions.find(s => s.id === sessionId);
+		if (session?.projectId && typeof sessionStorage !== 'undefined') {
+			try {
+				sessionStorage.setItem(`terminal-active-session-${session.projectId}`, sessionId);
+			} catch {
+				// sessionStorage not available
+			}
+		}
 	},
 
 	async closeSession(sessionId: string): Promise<boolean> {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@myrialabs/clopen",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "description": "All-in-one web workspace for Claude Code & OpenCode — chat, terminal, git, browser preview, checkpoints, and real-time collaboration",
   "author": "Myria Labs",
   "license": "MIT",
@@ -77,7 +77,6 @@
     "@anthropic-ai/claude-agent-sdk": "^0.2.7",
     "@anthropic-ai/sdk": "^0.62.0",
     "@elysiajs/cors": "^1.4.0",
-    "@elysiajs/static": "^1.4.7",
     "@iconify-json/lucide": "^1.2.57",
     "@iconify-json/material-icon-theme": "^1.2.16",
     "@modelcontextprotocol/sdk": "^1.26.0",