@electric-agent/studio 1.1.1 → 1.3.4

package/dist/server.js

@@ -11,17 +11,15 @@ import { cors } from "hono/cors";
 import { ActiveSessions } from "./active-sessions.js";
 import { ClaudeCodeDockerBridge } from "./bridge/claude-code-docker.js";
 import { ClaudeCodeSpritesBridge, } from "./bridge/claude-code-sprites.js";
-import { generateClaudeMd } from "./bridge/claude-md-generator.js";
-import { DaytonaSessionBridge } from "./bridge/daytona.js";
-import { DockerStdioBridge } from "./bridge/docker-stdio.js";
+import { createAppSkillContent, generateClaudeMd } from "./bridge/claude-md-generator.js";
 import { HostedStreamBridge } from "./bridge/hosted.js";
-import { SpritesStdioBridge } from "./bridge/sprites.js";
 import { DEFAULT_ELECTRIC_URL, getClaimUrl, provisionElectricResources } from "./electric-api.js";
 import { createGate, rejectAllGates, resolveGate } from "./gate.js";
 import { ghListAccounts, ghListBranches, ghListRepos, isGhAuthenticated } from "./git.js";
 import { resolveProjectDir } from "./project-utils.js";
+import { deriveSessionToken, validateSessionToken } from "./session-auth.js";
 import { generateInviteCode } from "./shared-sessions.js";
-import { getSharedStreamConnectionInfo, getStreamConnectionInfo, getStreamEnvVars, } from "./streams.js";
+import { getSharedStreamConnectionInfo, getStreamConnectionInfo, } from "./streams.js";
 /** Active session bridges — one per running session */
 const bridges = new Map();
 /** Inflight hook session creations — prevents duplicate sessions from concurrent hooks */
@@ -51,40 +49,20 @@ function getOrCreateBridge(config, sessionId) {
     return bridge;
 }
 /**
- * Create a stdio-based bridge for a session after the sandbox has been created.
- * Replaces any existing hosted bridge for the session.
+ * Resolve the studio server URL for remote sandboxes (Sprites).
+ * On Fly.io: uses the app's public HTTPS URL.
+ * Locally: falls back to ngrok/tailscale URL from STUDIO_URL env, or localhost (won't work from sprites).
  */
-function createStdioBridge(config, sessionId) {
-    const conn = sessionStream(config, sessionId);
-    let bridge;
-    if (config.sandbox.runtime === "daytona") {
-        const daytonaProvider = config.sandbox;
-        const sandbox = daytonaProvider.getSandboxObject(sessionId);
-        if (!sandbox) {
-            throw new Error(`No Daytona sandbox object for session ${sessionId}`);
-        }
-        bridge = new DaytonaSessionBridge(sessionId, conn, sandbox);
-    }
-    else if (config.sandbox.runtime === "sprites") {
-        const spritesProvider = config.sandbox;
-        const sprite = spritesProvider.getSpriteObject(sessionId);
-        if (!sprite) {
-            throw new Error(`No Sprites sandbox object for session ${sessionId}`);
-        }
-        bridge = new SpritesStdioBridge(sessionId, conn, sprite);
-    }
-    else {
-        const dockerProvider = config.sandbox;
-        const containerId = dockerProvider.getContainerId(sessionId);
-        if (!containerId) {
-            throw new Error(`No Docker container found for session ${sessionId}`);
-        }
-        bridge = new DockerStdioBridge(sessionId, conn, containerId);
-    }
-    // Replace any existing bridge
-    closeBridge(sessionId);
-    bridges.set(sessionId, bridge);
-    return bridge;
+function resolveStudioUrl(port) {
+    // Explicit override (e.g. ngrok tunnel for local dev with sprites)
+    if (process.env.STUDIO_URL)
+        return process.env.STUDIO_URL;
+    // Fly.io — FLY_APP_NAME is set automatically
+    const flyApp = process.env.FLY_APP_NAME;
+    if (flyApp)
+        return `https://${flyApp}.fly.dev`;
+    // Fallback — won't work from sprites VMs, but at least logs a useful URL
+    return `http://localhost:${port}`;
 }
 /**
  * Create a Claude Code bridge for a session.
@@ -283,6 +261,45 @@ export function createApp(config) {
             return c.json({ error: message }, 500);
         }
     });
+    // --- Session Token Auth Middleware ---
+    // Protects session-scoped endpoints. Hook endpoints and creation routes are exempt.
+    // Hono's wildcard middleware matches creation routes like /api/sessions/local as
+    // :id="local", so we must explicitly skip those.
+    const authExemptIds = new Set(["local", "auto", "resume"]);
+    const hookExemptSuffixes = new Set(["/hook-event"]);
+    /** Extract session token from Authorization header or query param. */
+    function extractToken(c) {
+        const authHeader = c.req.header("Authorization");
+        if (authHeader?.startsWith("Bearer "))
+            return authHeader.slice(7);
+        return c.req.query("token") ?? undefined;
+    }
+    // Protect /api/sessions/:id/* and /api/sessions/:id
+    app.use("/api/sessions/:id/*", async (c, next) => {
+        const id = c.req.param("id");
+        if (authExemptIds.has(id))
+            return next();
+        const subPath = c.req.path.replace(/^\/api\/sessions\/[^/]+/, "");
+        if (hookExemptSuffixes.has(subPath))
+            return next();
+        const token = extractToken(c);
+        if (!token || !validateSessionToken(config.streamConfig.secret, id, token)) {
+            return c.json({ error: "Invalid or missing session token" }, 401);
+        }
+        return next();
+    });
+    app.use("/api/sessions/:id", async (c, next) => {
+        const id = c.req.param("id");
+        if (authExemptIds.has(id))
+            return next();
+        if (c.req.method !== "GET" && c.req.method !== "DELETE")
+            return next();
+        const token = extractToken(c);
+        if (!token || !validateSessionToken(config.streamConfig.secret, id, token)) {
+            return c.json({ error: "Invalid or missing session token" }, 401);
+        }
+        return next();
+    });
     // Get single session (from in-memory active sessions)
     app.get("/api/sessions/:id", (c) => {
         const session = config.sessions.get(c.req.param("id"));
@@ -323,8 +340,9 @@ export function createApp(config) {
         config.sessions.add(session);
         // Pre-create a bridge so hook-event can emit to it immediately
         getOrCreateBridge(config, sessionId);
+        const sessionToken = deriveSessionToken(config.streamConfig.secret, sessionId);
         console.log(`[local-session] Created session: ${sessionId}`);
-        return c.json({ sessionId }, 201);
+        return c.json({ sessionId, sessionToken }, 201);
     });
     // Auto-register a local session on first hook event (SessionStart).
     // Eliminates the manual `curl POST /api/sessions/local` step.
@@ -369,8 +387,9 @@ export function createApp(config) {
         if (hookEvent) {
             await bridge.emit(hookEvent);
         }
+        const sessionToken = deriveSessionToken(config.streamConfig.secret, sessionId);
         console.log(`[auto-session] Created session: ${sessionId} (project: ${projectName})`);
-        return c.json({ sessionId }, 201);
+        return c.json({ sessionId, sessionToken }, 201);
     });
     // Receive a hook event from Claude Code (via forward.sh) and write it
     // to the session's durable stream as an EngineEvent.
@@ -384,19 +403,27 @@ export function createApp(config) {
         if (!hookEvent) {
             return c.json({ ok: true }); // Unknown hook type — silently skip
         }
-        try {
-            await bridge.emit(hookEvent);
-        }
-        catch (err) {
-            console.error(`[hook-event] Failed to emit:`, err);
-            return c.json({ error: "Failed to write event" }, 500);
+        // For Docker/Sprites bridge sessions, the stream-json parser already emits
+        // events to the durable stream. Only emit from hooks for hosted (local) bridges
+        // to avoid duplicate events.
+        const isClaudeCodeBridge = bridge instanceof ClaudeCodeDockerBridge || bridge instanceof ClaudeCodeSpritesBridge;
+        if (!isClaudeCodeBridge) {
+            try {
+                await bridge.emit(hookEvent);
+            }
+            catch (err) {
+                console.error(`[hook-event] Failed to emit:`, err);
+                return c.json({ error: "Failed to write event" }, 500);
+            }
         }
         // Bump lastActiveAt on every hook event
         config.sessions.update(sessionId, {});
         // SessionEnd: mark session complete and close the bridge
         if (hookEvent.type === "session_end") {
-            config.sessions.update(sessionId, { status: "complete" });
-            closeBridge(sessionId);
+            if (!isClaudeCodeBridge) {
+                config.sessions.update(sessionId, { status: "complete" });
+                closeBridge(sessionId);
+            }
             return c.json({ ok: true });
         }
         // AskUserQuestion: block until the user answers via the web UI
@@ -621,8 +648,8 @@ const events = ['PreToolUse','PostToolUse','PostToolUseFailure','Stop','SessionS
 for (const ev of events) {
   if (!settings.hooks[ev]) settings.hooks[ev] = [];
   const arr = settings.hooks[ev];
-  if (!arr.some(h => h.command === hook)) {
-    arr.push({ type: 'command', command: hook });
+  if (!arr.some(g => g.hooks && g.hooks.some(h => h.command === hook))) {
+    arr.push({ hooks: [{ type: 'command', command: hook }] });
   }
 }
 fs.writeFileSync(file, JSON.stringify(settings, null, 2) + '\\\\n');
@@ -649,17 +676,13 @@ echo "Start claude in this project — the session will appear in the studio UI.
         if (!body.description) {
             return c.json({ error: "description is required" }, 400);
         }
-        // Per-session bridge mode: "claude-code" if explicitly requested, else server default
-        const sessionBridgeMode = body.agentMode === "claude-code" ? "claude-code" : config.bridgeMode;
         const sessionId = crypto.randomUUID();
         const inferredName = body.name ||
-            (config.inferProjectName
-                ? await config.inferProjectName(body.description)
-                : body.description
-                    .slice(0, 40)
-                    .replace(/[^a-z0-9]+/gi, "-")
-                    .replace(/^-|-$/g, "")
-                    .toLowerCase());
+            body.description
+                .slice(0, 40)
+                .replace(/[^a-z0-9]+/gi, "-")
+                .replace(/^-|-$/g, "")
+                .toLowerCase();
         const baseDir = body.baseDir || process.cwd();
         const { projectName } = resolveProjectDir(baseDir, inferredName);
         console.log(`[session] Creating new session: id=${sessionId} project=${projectName}`);
@@ -689,7 +712,6 @@ echo "Start claude in this project — the session will appear in the studio UI.
             createdAt: new Date().toISOString(),
             lastActiveAt: new Date().toISOString(),
             status: "running",
-            agentMode: sessionBridgeMode === "claude-code" ? "claude-code" : "electric-agent",
         };
         config.sessions.add(session);
         // Write user prompt to the stream so it shows in the UI
@@ -769,16 +791,10 @@ echo "Start claude in this project — the session will appear in the studio UI.
                 message: `Creating ${config.sandbox.runtime} sandbox...`,
                 ts: ts(),
             });
-            // Only pass stream env vars when using hosted stream bridge (not stdio or claude-code)
-            const streamEnv = sessionBridgeMode === "stdio" || sessionBridgeMode === "claude-code"
-                ? undefined
-                : getStreamEnvVars(sessionId, config.streamConfig);
-            console.log(`[session:${sessionId}] Creating sandbox: runtime=${config.sandbox.runtime} project=${projectName} bridgeMode=${sessionBridgeMode}`);
+            console.log(`[session:${sessionId}] Creating sandbox: runtime=${config.sandbox.runtime} project=${projectName}`);
             const handle = await config.sandbox.create(sessionId, {
                 projectName,
                 infra,
-                streamEnv,
-                deferAgentStart: sessionBridgeMode === "stdio" || sessionBridgeMode === "claude-code",
                 apiKey: body.apiKey,
                 oauthToken: body.oauthToken,
                 ghToken: body.ghToken,
@@ -796,12 +812,8 @@ echo "Start claude in this project — the session will appear in the studio UI.
                 previewUrl: handle.previewUrl,
                 ...(claimId ? { claimId } : {}),
             });
-            // 3. If stdio bridge mode, create the stdio bridge now that the sandbox exists.
-            // If claude-code mode, write CLAUDE.md and create a ClaudeCode bridge.
-            // If stdio mode, create the stdio bridge now that the sandbox exists.
-            // If stream bridge mode with Sprites, launch the agent process in the sprite
-            // (it connects directly to the hosted Durable Stream via DS_URL env vars).
-            if (sessionBridgeMode === "claude-code") {
+            // 3. Write CLAUDE.md and create a ClaudeCode bridge.
+            {
                 console.log(`[session:${sessionId}] Setting up Claude Code bridge...`);
                 // Copy pre-scaffolded project from the image and customize per-session
                 await bridge.emit({
@@ -820,8 +832,6 @@ echo "Start claude in this project — the session will appear in the studio UI.
                         // Sprites/Daytona: run scaffold from globally installed electric-agent
                         await config.sandbox.exec(handle, `source /etc/profile.d/npm-global.sh 2>/dev/null; electric-agent scaffold '${handle.projectDir}' --name '${projectName}' --skip-git`);
                     }
-                    // Ensure _agent/ working memory directory exists
-                    await config.sandbox.exec(handle, `mkdir -p '${handle.projectDir}/_agent' && echo '# Error Log\n' > '${handle.projectDir}/_agent/errors.md' && echo '# Session State\n' > '${handle.projectDir}/_agent/session.md'`);
                     console.log(`[session:${sessionId}] Project setup complete`);
                     await bridge.emit({
                         type: "log",
@@ -852,46 +862,31 @@ echo "Start claude in this project — the session will appear in the studio UI.
                 catch (err) {
                     console.error(`[session:${sessionId}] Failed to write CLAUDE.md:`, err);
                 }
-                const claudeConfig = {
-                    prompt: body.description,
-                    cwd: handle.projectDir,
-                };
-                bridge = createClaudeCodeBridge(config, sessionId, claudeConfig);
-            }
-            else if (sessionBridgeMode === "stdio") {
-                console.log(`[session:${sessionId}] Creating stdio bridge...`);
-                bridge = createStdioBridge(config, sessionId);
-            }
-            else if (config.sandbox.runtime === "sprites") {
-                await bridge.emit({
-                    type: "log",
-                    level: "build",
-                    message: "Starting agent in sandbox...",
-                    ts: ts(),
-                });
-                console.log(`[session:${sessionId}] Starting agent process in sprite...`);
-                try {
-                    const spritesProvider = config.sandbox;
-                    await spritesProvider.startAgent(handle);
-                    // Give the agent time to start and connect to the stream
-                    await new Promise((r) => setTimeout(r, 3000));
-                    console.log(`[session:${sessionId}] Agent process launched in sprite`);
-                    await bridge.emit({
-                        type: "log",
-                        level: "done",
-                        message: "Agent started",
-                        ts: ts(),
-                    });
-                }
-                catch (err) {
-                    console.error(`[session:${sessionId}] Failed to start agent in sprite:`, err);
-                    await bridge.emit({
-                        type: "log",
-                        level: "error",
-                        message: `Failed to start agent: ${err instanceof Error ? err.message : "unknown error"}`,
-                        ts: ts(),
-                    });
+                // Ensure the create-app skill is present in the project.
+                // The npm-installed electric-agent may be an older version that
+                // doesn't include .claude/skills/ in its template directory.
+                if (createAppSkillContent) {
+                    try {
+                        const skillDir = `${handle.projectDir}/.claude/skills/create-app`;
+                        const skillB64 = Buffer.from(createAppSkillContent).toString("base64");
+                        await config.sandbox.exec(handle, `mkdir -p '${skillDir}' && echo '${skillB64}' | base64 -d > '${skillDir}/SKILL.md'`);
+                    }
+                    catch (err) {
+                        console.error(`[session:${sessionId}] Failed to write create-app skill:`, err);
+                    }
                 }
+                const claudeConfig = config.sandbox.runtime === "sprites"
+                    ? {
+                        prompt: `/create-app ${body.description}`,
+                        cwd: handle.projectDir,
+                        studioUrl: resolveStudioUrl(config.port),
+                    }
+                    : {
+                        prompt: `/create-app ${body.description}`,
+                        cwd: handle.projectDir,
+                        studioPort: config.port,
+                    };
+                bridge = createClaudeCodeBridge(config, sessionId, claudeConfig);
             }
             // 4. Log repo config
             if (repoConfig) {
@@ -905,8 +900,9 @@ echo "Start claude in this project — the session will appear in the studio UI.
             // 5. Start listening for agent events via the bridge
             // Track Claude Code session ID for --resume on iterate
             bridge.onAgentEvent((event) => {
-                if (event.type === "session_start" && "session_id" in event) {
+                if (event.type === "session_start") {
                     const ccSessionId = event.session_id;
+                    console.log(`[session:${sessionId}] Captured Claude Code session ID: ${ccSessionId}`);
                     if (ccSessionId) {
                         config.sessions.update(sessionId, { lastCoderSessionId: ccSessionId });
                     }
@@ -935,9 +931,9 @@ echo "Start claude in this project — the session will appear in the studio UI.
                     // Container may already be stopped
                 }
                 config.sessions.update(sessionId, updates);
-                // For Claude Code mode: check if the app is running after completion
+                // Check if the app is running after completion
                 // and emit app_ready so the UI shows the preview link
-                if (sessionBridgeMode === "claude-code" && success) {
+                if (success) {
                     try {
                         const appRunning = await config.sandbox.isAppRunning(handle);
                         if (appRunning) {
@@ -953,6 +949,13 @@ echo "Start claude in this project — the session will appear in the studio UI.
                     }
                 }
             });
+            // Show the command being sent to Claude Code
+            await bridge.emit({
+                type: "log",
+                level: "build",
+                message: `Running: claude "/create-app ${body.description}"`,
+                ts: ts(),
+            });
             console.log(`[session:${sessionId}] Starting bridge listener...`);
             await bridge.start();
             console.log(`[session:${sessionId}] Bridge started, sending 'new' command...`);
@@ -974,7 +977,8 @@ echo "Start claude in this project — the session will appear in the studio UI.
             console.error(`[session:${sessionId}] Session creation flow failed:`, err);
             config.sessions.update(sessionId, { status: "error" });
         });
-        return c.json({ sessionId, session }, 201);
+        const sessionToken = deriveSessionToken(config.streamConfig.secret, sessionId);
+        return c.json({ sessionId, session, sessionToken }, 201);
     });
     // Send iteration request
     app.post("/api/sessions/:id/iterate", async (c) => {
@@ -1036,20 +1040,11 @@ echo "Start claude in this project — the session will appear in the studio UI.
             if (!handle || !config.sandbox.isAlive(handle)) {
                 return c.json({ error: "Container is not running" }, 400);
             }
-            if (session.agentMode === "claude-code") {
-                // In Claude Code mode, send git requests as user messages
-                await bridge.sendCommand({
-                    command: "iterate",
-                    request: body.request,
-                });
-            }
-            else {
-                await bridge.sendCommand({
-                    command: "git",
-                    projectDir: session.sandboxProjectDir || handle.projectDir,
-                    ...gitOp,
-                });
-            }
+            // Send git requests as user messages via Claude Code bridge
+            await bridge.sendCommand({
+                command: "iterate",
+                request: body.request,
+            });
             return c.json({ ok: true });
         }
         const handle = config.sandbox.get(sessionId);
@@ -1086,7 +1081,9 @@ echo "Start claude in this project — the session will appear in the studio UI.
         const resolvedBy = participantId && participantName
             ? { id: participantId, displayName: participantName }
             : undefined;
-        // AskUserQuestion gates: resolve the blocking hook-event and emit gate_resolved
+        // AskUserQuestion gates: try to resolve the blocking hook-event first.
+        // If no gate is pending (Docker/Sprites bridge sessions create no gate),
+        // fall through to the generic bridge.sendGateResponse() path below.
         if (gate === "ask_user_question") {
             const toolUseId = body.toolUseId;
             if (!toolUseId) {
@@ -1094,24 +1091,24 @@ echo "Start claude in this project — the session will appear in the studio UI.
             }
             const answer = body.answer || "";
             const resolved = resolveGate(sessionId, `ask_user_question:${toolUseId}`, { answer });
-            if (!resolved) {
-                return c.json({ error: "No pending ask_user_question gate found" }, 404);
-            }
-            // Emit gate_resolved for replay
-            try {
-                const bridge = getOrCreateBridge(config, sessionId);
-                await bridge.emit({
-                    type: "gate_resolved",
-                    gate: "ask_user_question",
-                    summary,
-                    resolvedBy,
-                    ts: ts(),
-                });
-            }
-            catch {
-                // Non-critical
+            if (resolved) {
+                // Hook session — gate was blocking, now resolved
+                try {
+                    const bridge = getOrCreateBridge(config, sessionId);
+                    await bridge.emit({
+                        type: "gate_resolved",
+                        gate: "ask_user_question",
+                        summary,
+                        resolvedBy,
+                        ts: ts(),
+                    });
+                }
+                catch {
+                    // Non-critical
+                }
+                return c.json({ ok: true });
             }
-            return c.json({ ok: true });
+            // No pending gate — fall through to bridge.sendGateResponse()
         }
         // Server-side gates are resolved in-process (they run on the server, not inside the container)
         const serverGates = new Set(["infra_config"]);
@@ -1244,9 +1241,46 @@ echo "Start claude in this project — the session will appear in the studio UI.
         }
         return c.json({ success: true });
     });
+    // Interrupt the running Claude Code process without destroying the session.
+    // The sandbox stays alive and the bridge remains open for follow-up messages.
+    app.post("/api/sessions/:id/interrupt", async (c) => {
+        const sessionId = c.req.param("id");
+        const bridge = bridges.get(sessionId);
+        if (bridge) {
+            bridge.interrupt();
+            // Emit session_end so the UI knows the process stopped
+            await bridge.emit({
+                type: "session_end",
+                success: false,
+                ts: ts(),
+            });
+        }
+        rejectAllGates(sessionId);
+        config.sessions.update(sessionId, { status: "complete" });
+        return c.json({ ok: true });
+    });
     // Cancel a running session
     app.post("/api/sessions/:id/cancel", async (c) => {
         const sessionId = c.req.param("id");
+        // Write session_end to the stream so SSE clients see the cancellation
+        const conn = sessionStream(config, sessionId);
+        try {
+            const stream = new DurableStream({
+                url: conn.url,
+                headers: conn.headers,
+                contentType: "application/json",
+            });
+            const endEvent = {
+                source: "server",
+                type: "session_end",
+                success: false,
+                ts: ts(),
+            };
+            await stream.append(JSON.stringify(endEvent));
+        }
+        catch {
+            // Best effort — stream may not exist yet
+        }
         closeBridge(sessionId);
         const handle = config.sandbox.get(sessionId);
         if (handle)
@@ -1303,12 +1337,10 @@ echo "Start claude in this project — the session will appear in the studio UI.
     app.post("/api/sandboxes", async (c) => {
         const body = (await c.req.json());
         const sessionId = body.sessionId ?? crypto.randomUUID();
-        const streamEnv = getStreamEnvVars(sessionId, config.streamConfig);
         try {
             const handle = await config.sandbox.create(sessionId, {
                 projectName: body.projectName,
                 infra: body.infra,
-                streamEnv,
             });
             return c.json({
                 sessionId: handle.sessionId,
@@ -1334,6 +1366,19 @@ echo "Start claude in this project — the session will appear in the studio UI.
         return c.json({ ok: true });
     });
     // --- Shared Sessions ---
+    // Protect /api/shared-sessions/:id/* (all sub-routes)
+    // Exempt: "join" (Hono matches join/:code as :id/*)
+    const sharedSessionExemptIds = new Set(["join"]);
+    app.use("/api/shared-sessions/:id/*", async (c, next) => {
+        const id = c.req.param("id");
+        if (sharedSessionExemptIds.has(id))
+            return next();
+        const token = extractToken(c);
+        if (!token || !validateSessionToken(config.streamConfig.secret, id, token)) {
+            return c.json({ error: "Invalid or missing room token" }, 401);
+        }
+        return next();
+    });
     // Create a shared session
     app.post("/api/shared-sessions", async (c) => {
         const body = (await c.req.json());
@@ -1384,16 +1429,18 @@ echo "Start claude in this project — the session will appear in the studio UI.
             createdAt: new Date().toISOString(),
             revoked: false,
         });
+        const roomToken = deriveSessionToken(config.streamConfig.secret, id);
         console.log(`[shared-session] Created: id=${id} code=${code}`);
-        return c.json({ id, code }, 201);
+        return c.json({ id, code, roomToken }, 201);
     });
-    // Resolve invite code → shared session ID
+    // Resolve invite code → shared session ID + room token
     app.get("/api/shared-sessions/join/:code", (c) => {
         const code = c.req.param("code");
         const entry = config.rooms.getRoomByCode(code);
         if (!entry)
             return c.json({ error: "Shared session not found" }, 404);
-        return c.json({ id: entry.id, code: entry.code, revoked: entry.revoked });
+        const roomToken = deriveSessionToken(config.streamConfig.secret, entry.id);
+        return c.json({ id: entry.id, code: entry.code, revoked: entry.revoked, roomToken });
     });
     // Join a shared session as participant
     app.post("/api/shared-sessions/:id/join", async (c) => {
@@ -1492,7 +1539,7 @@ echo "Start claude in this project — the session will appear in the studio UI.
         if (!entry)
             return c.json({ error: "Shared session not found" }, 404);
         const connection = sharedSessionStream(config, id);
-        const lastEventId = c.req.header("Last-Event-ID") || "-1";
+        const lastEventId = c.req.header("Last-Event-ID") || c.req.query("offset") || "-1";
         const reader = new DurableStream({
             url: connection.url,
             headers: connection.headers,
@@ -1558,8 +1605,12 @@ echo "Start claude in this project — the session will appear in the studio UI.
         // Get the stream connection info (no session lookup needed —
         // the DS stream may exist from a previous server lifetime)
         const connection = sessionStream(config, sessionId);
-        // Last-Event-ID allows reconnection from where the client left off
-        const lastEventId = c.req.header("Last-Event-ID") || "-1";
+        // Last-Event-ID allows reconnection from where the client left off.
+        // Also check for an explicit ?offset= query param — when the client
+        // manually reconnects (e.g. after a tab switch), the new EventSource
+        // won't carry the Last-Event-ID from the previous connection, so the
+        // client passes it explicitly.
+        const lastEventId = c.req.header("Last-Event-ID") || c.req.query("offset") || "-1";
         console.log(`[sse] Reading stream from offset=${lastEventId} url=${connection.url}`);
         const reader = new DurableStream({
             url: connection.url,
@@ -1782,7 +1833,8 @@ echo "Start claude in this project — the session will appear in the studio UI.
                 message: `Resumed from ${body.repoUrl}`,
                 ts: ts(),
             });
-            return c.json({ sessionId, session, appPort: handle.port }, 201);
+            const sessionToken = deriveSessionToken(config.streamConfig.secret, sessionId);
+            return c.json({ sessionId, session, sessionToken, appPort: handle.port }, 201);
         }
         catch (e) {
             const msg = e instanceof Error ? e.message : "Failed to resume from repo";
@@ -1816,8 +1868,7 @@ export async function startWebServer(opts) {
         rooms: opts.rooms,
         sandbox: opts.sandbox,
         streamConfig: opts.streamConfig,
-        bridgeMode: opts.bridgeMode ?? "stream",
-        inferProjectName: opts.inferProjectName,
+        bridgeMode: opts.bridgeMode ?? "claude-code",
     };
     fs.mkdirSync(config.dataDir, { recursive: true });
     const app = createApp(config);