ompchamber 0.3.0

package/src/server/routes/browser/stream.ts

@@ -0,0 +1,217 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * GET /api/browser/:sessionId/stream — SSE stream of the browser tab that the
+ * session's own omp process drives inside the project-shared Chromium.
+ *
+ * Events:
+ * - `state` → BrowserViewState JSON (status: agent-offline | browser-offline |
+ *   no-tab | live, plus url/title/targetId/tabs when known)
+ * - `frame` → BrowserViewFrame JSON (base64 JPEG + dimensions + targetId)
+ *
+ * While the agent, the shared browser, or an agent-owned tab is missing, the
+ * route emits a coarse state and keeps polling every 1s instead of erroring —
+ * any of those can appear later in the session's life. The stream stays scoped
+ * to this session's own tabs: the daemon is project-shared, so neither the
+ * framebuffer nor the tab list ever falls back to another session's page.
+ * Frames are dropped under
+ * consumer backpressure (desiredSize < 0); the screencast itself is already
+ * acked upstream, so dropping is lossless latest-wins.
+ */
+
+import type { LoaderFunctionArgs } from '@/server/lib/remix-compat';
+import { isMockMode } from '@/server/mock.server';
+import { extractEvalActions } from '@/shared/lib/browser/activity';
+
+import { isRecord } from '@/shared/lib/util/guards';
+import { getRpcSession } from '@/server/lib/omp/rpc/session-registry';
+import { findProjectRuntimeDir, readOwnedTargetIds } from '@/server/lib/browser/runtime';
+import { openScreencast, type ScreencastHandle } from '@/shared/lib/browser/viewer';
+import { type TargetWatcherHandle, watchOwnedTargets } from '@/shared/lib/browser/watcher';
+import type { BrowserPanelAction, BrowserViewFrame, BrowserViewState } from '@/shared/types';
+import { createSseStream } from '@/server/lib/sse';
+import { BROWSER_POLL_MS, STREAM_HEARTBEAT_MS } from '@/shared/lib/workspace/refresh-cadence';
+
+const BROWSER_OFFLINE: BrowserViewState = { status: 'browser-offline', tabs: [] };
+
+export async function loader({ params, request }: LoaderFunctionArgs) {
+  const sessionId = params.sessionId ?? '';
+  const preferTargetId = new URL(request.url).searchParams.get('target') ?? undefined;
+
+  let closed = false;
+
+  const stream = createSseStream({
+    heartbeatMs: STREAM_HEARTBEAT_MS,
+    signal: request.signal,
+    headers: { 'Cache-Control': 'no-cache, no-transform' },
+    onStart(handlers) {
+      let lastStateKey = '';
+      let viewer: ScreencastHandle | null = null;
+      let viewerWsUrl: string | null = null;
+      let watcher: TargetWatcherHandle | null = null;
+      let watcherWsUrl: string | null = null;
+      let tickInFlight = false;
+      let pollTimer: ReturnType<typeof setInterval> | null = null;
+      let actionSeq = 0;
+      let agentSource: unknown = null;
+      let unsubscribeAgent: (() => void) | null = null;
+
+      const detachViewer = (): void => {
+        const current = viewer;
+        viewer = null;
+        viewerWsUrl = null;
+        if (!current) return;
+        try {
+          current.close();
+        } catch {
+          // Already closed by a disconnect callback.
+        }
+      };
+
+      const dropWatcher = (): void => {
+        const current = watcher;
+        watcher = null;
+        watcherWsUrl = null;
+        current?.close();
+      };
+
+      const cleanup = (): void => {
+        if (closed) return;
+        closed = true;
+        detachViewer();
+        dropWatcher();
+        unsubscribeAgent?.();
+        unsubscribeAgent = null;
+        agentSource = null;
+        if (pollTimer !== null) clearInterval(pollTimer);
+        pollTimer = null;
+        handlers.close();
+      };
+
+      const emitState = (state: BrowserViewState): void => {
+        const key = JSON.stringify(state);
+        if (key === lastStateKey) return;
+        lastStateKey = key;
+        handlers.send('state', state);
+      };
+
+      const emitAction = (action: { kind: BrowserPanelAction['kind']; label: string }): void => {
+        actionSeq += 1;
+        const payload: BrowserPanelAction = { id: `act-${actionSeq}`, kind: action.kind, label: action.label };
+        handlers.send('action', payload);
+      };
+
+      const emitFrame = (frame: BrowserViewFrame): void => {
+        // Backpressure: keep at most a couple of pending frames; drop the rest.
+        if (handlers.isBackpressured()) return;
+        handlers.send('frame', frame);
+      };
+
+      const tick = async (): Promise<void> => {
+        if (closed || tickInFlight) return;
+        tickInFlight = true;
+        try {
+          if (isMockMode()) {
+            detachViewer();
+            emitState(BROWSER_OFFLINE);
+            return;
+          }
+          const session = getRpcSession(sessionId);
+          if (!session || !session.isAlive()) {
+            dropWatcher();
+            unsubscribeAgent?.();
+            unsubscribeAgent = null;
+            agentSource = null;
+            detachViewer();
+            emitState({ status: 'agent-offline', tabs: [] });
+            return;
+          }
+          if (agentSource !== session) {
+            unsubscribeAgent?.();
+            agentSource = session;
+            unsubscribeAgent = session.onEvent((event) => {
+              if (typeof event.toolName !== 'string' || event.toolName !== 'eval') return;
+              if (event.type === 'tool_execution_start') {
+                const args = isRecord(event.args) ? event.args : {};
+                for (const action of extractEvalActions({ code: args.code, title: args.title })) {
+                  emitAction(action);
+                }
+                void tick();
+              } else if (event.type === 'tool_execution_update') {
+                void tick();
+              } else if (event.type === 'tool_execution_end' && event.isError === true) {
+                emitAction({ kind: 'error', label: 'Aksi browser gagal' });
+              }
+            });
+          }
+          const pid = session.pid;
+          const runtime = pid === undefined ? null : await findProjectRuntimeDir(session.cwd);
+          if (closed) return;
+          if (!runtime || pid === undefined) {
+            dropWatcher();
+            detachViewer();
+            emitState(BROWSER_OFFLINE);
+            return;
+          }
+          if (!watcher || watcherWsUrl !== runtime.wsUrl) {
+            dropWatcher();
+            const started = await watchOwnedTargets(runtime.wsUrl, {
+              getOwnedTargetIds: () => readOwnedTargetIds(runtime.runtimeDir, runtime.daemonName, pid),
+              onOwnedTarget: () => {
+                void tick();
+              },
+            }).catch(() => null);
+            if (closed) {
+              started?.close();
+              return;
+            }
+            watcher = started;
+            watcherWsUrl = started ? runtime.wsUrl : null;
+          }
+          const ownedIds = await readOwnedTargetIds(runtime.runtimeDir, runtime.daemonName, pid);
+          if (closed) return;
+          if (ownedIds.length === 0) {
+            detachViewer();
+            emitState({ status: 'no-tab', tabs: [] });
+            return;
+          }
+          if (viewer && viewerWsUrl !== runtime.wsUrl) detachViewer();
+          if (!viewer) {
+            const handle = await openScreencast(runtime.wsUrl, {
+              preferTargetId,
+              getOwnedTargetIds: () => readOwnedTargetIds(runtime.runtimeDir, runtime.daemonName, pid),
+              onFrame: emitFrame,
+              onAction: (action) => emitAction(action),
+              onState: (state) => {
+                emitState(state);
+                if (state.status === 'browser-offline') detachViewer();
+              },
+            });
+            if (closed) {
+              handle.close();
+              return;
+            }
+            viewer = handle;
+            viewerWsUrl = runtime.wsUrl;
+          }
+        } catch {
+          // Transient fs/CDP failure: keep the stream open and retry next tick.
+        } finally {
+          tickInFlight = false;
+        }
+      };
+
+      pollTimer = setInterval(() => {
+        void tick();
+      }, BROWSER_POLL_MS);
+      void tick();
+
+      return cleanup;
+    },
+  });
+
+  return stream.response;
+}

package/src/server/routes/chat/index.ts

@@ -0,0 +1,12 @@
+import { bindingsFor, type HandlerBinding } from '@/server/lib/route-adapter';
+import * as chatRoot from '@/server/routes/chat/root';
+import * as chatSession from '@/server/routes/chat/session';
+import * as chatRewind from '@/server/routes/chat/rewind';
+import * as chatStream from '@/server/routes/chat/stream';
+
+export const chatBindings: HandlerBinding[] = [
+  ...bindingsFor(chatRoot, '/api/chat'),
+  ...bindingsFor(chatSession, '/api/chat/:sessionId'),
+  ...bindingsFor(chatRewind, '/api/chat/:sessionId/rewind'),
+  ...bindingsFor(chatStream, '/api/chat/stream'),
+];

package/src/server/routes/chat/rewind.ts

@@ -0,0 +1,162 @@
+import { json } from '@/server/lib/remix-compat';
+import type { ActionFunctionArgs } from '@/server/lib/remix-compat';
+import { getDb } from '@/server/db.server';
+import { resolveSessionFileOr404 } from '@/server/lib/omp/session/locator';
+import { getRpcSession } from '@/server/lib/omp/rpc/session-registry';
+import { clearSessionFileCaches } from '@/server/lib/omp/session/files';
+import { userTurnsRelate } from '@/shared/lib/chat/timeline/turns';
+
+/**
+ * In-place rewind (undo) for an omp session: truncate the session JSONL back
+ * to just before a user turn and clean the chamber's DB overlay copy.
+ *
+ * Why file surgery instead of omp's `branch` RPC: branch always forks a new
+ * session file (new id → URL/sidebar churn). omp itself rewrites this same
+ * file in place for equivalent operations (`rewriteEntries`), and its JSONL
+ * readers walk entries in order, so a prefix-preserving truncation is faithful.
+ *
+ * Safety contract:
+ *  - the live omp process for this session is destroyed first (it flushes all
+ *    pending state on shutdown and is the only other writer of this file);
+ *  - the original file is kept as `<name>.bak-<timestamp>` (omp's session
+ *    listing ignores names containing `.bak`, so it never becomes a phantom
+ *    session).
+ */
+
+interface StoredMessage {
+  role?: string;
+  content?: string;
+  id?: string;
+}
+
+/** Extract plain text from omp user-message content (string or text blocks). */
+function userEntryText(content: unknown): string {
+  if (typeof content === 'string') return content;
+  if (Array.isArray(content)) {
+    return content
+      .map((b) => (b && typeof b === 'object' && (b as { type?: unknown }).type === 'text' ? String((b as { text?: unknown }).text ?? '') : ''))
+      .join('');
+  }
+  return '';
+}
+
+/**
+ * Build the truncated body: entries at/after the cut user turn are dropped;
+ * header records and everything before it survive. Returns null when the cut
+ * entry cannot be found or is not a user message (rewind points are turns).
+ */
+function truncateJsonl(body: string, cutEntryId: string): string | null {
+  const records: Array<Record<string, unknown> | null> = body.split('\n').map((line) => {
+    const trimmed = line.trim();
+    if (!trimmed) return null;
+    try {
+      return JSON.parse(trimmed) as Record<string, unknown>;
+    } catch {
+      return null;
+    }
+  });
+
+  const cutIndex = records.findIndex((r) => r?.id === cutEntryId);
+  if (cutIndex === -1) return null;
+
+  const cutRecord = records[cutIndex];
+  const cutRole: unknown = (cutRecord as { message?: { role?: unknown } } | null)?.message?.role;
+  if (cutRole !== 'user') return null;
+
+  const outLines = records
+    .slice(0, cutIndex)
+    .filter((r): r is Record<string, unknown> => Boolean(r))
+    .map((r) => JSON.stringify(r));
+  // Header records written after the cut point (model/thinking changes during
+  // the abandoned turns) still describe the session's latest state — keep the
+  // last of each so a respawn resumes with the same model/level.
+  for (const type of ['model_change', 'thinking_level_change'] as const) {
+    const last = records
+      .slice(cutIndex)
+      .filter((r): r is Record<string, unknown> => r?.type === type)
+      .pop();
+    if (last) outLines.push(JSON.stringify(last));
+  }
+  return `${outLines.join('\n')}\n`;
+}
+
+export async function action({ params, request }: ActionFunctionArgs) {
+  const { sessionId } = params;
+  if (!sessionId) return json({ error: 'session id is required' }, { status: 400 });
+  if (request.method !== 'POST') return json({ error: 'method not allowed' }, { status: 405 });
+
+  const body: unknown = await request.json().catch(() => null);
+  const entryId = body && typeof body === 'object' && 'entryId' in body && typeof body.entryId === 'string'
+    ? body.entryId
+    : '';
+  if (!entryId) return json({ error: 'entryId is required', code: 'entry_id_required' }, { status: 400 });
+
+  const resolved = await resolveSessionFileOr404(sessionId);
+  if ('response' in resolved) return resolved.response;
+  const { filePath } = resolved;
+
+  // Tear down the live process first: it flushes pending writes on shutdown
+  // and must not race the rewrite. Best-effort — the session may already be
+  // gone or mid-restart.
+  const live = getRpcSession(sessionId);
+  if (live?.isAlive()) {
+    await live.destroyAndWait();
+  }
+  clearSessionFileCaches();
+
+  const raw = await Bun.file(filePath).text();
+  const nextBody = truncateJsonl(raw, entryId);
+  if (nextBody === null) {
+    return json({ error: 'Entry not found or not a user turn in this session', code: 'entry_not_found' }, { status: 400 });
+  }
+
+  // Backup then rewrite. `.bak` names are skipped by omp's session listing.
+  const backupPath = `${filePath}.bak-${Date.now()}`;
+  await Bun.write(backupPath, raw);
+  try {
+    await Bun.write(filePath, nextBody);
+  } catch (error) {
+    await Bun.write(filePath, raw);
+    return json({ error: error instanceof Error ? error.message : 'Failed to rewrite session file' }, { status: 500 });
+  }
+
+  // Clean the chamber DB overlay: drop stored turns that no longer survive in
+  // the truncated JSONL, otherwise mergeOmpAttachments resurrects them.
+  try {
+    const db = await getDb();
+    const row = await db.get('SELECT title, messages FROM chat_sessions WHERE session_id = ?', [sessionId]);
+    if (row?.messages) {
+      let stored: StoredMessage[] = [];
+      try {
+        stored = JSON.parse(row.messages) as StoredMessage[];
+      } catch {
+        stored = [];
+      }
+      // IDs still present in the truncated file survive verbatim; user turns
+      // whose stored text relates to the surviving JSONL chain also stay (the
+      // stored copy carries raw composer text, the JSONL the delivered prompt).
+      const truncatedIds = new Set(nextBody.split('\n').map((line) => JSON.parse(line).id as string | undefined));
+      const keptUserEntries = nextBody
+        .split('\n')
+        .map((line) => JSON.parse(line) as Record<string, unknown>)
+        .filter((r) => r.type === 'message' && (r as { message?: { role?: unknown } }).message?.role === 'user')
+        .map((r) => userEntryText((r as { message?: { content?: unknown } }).message?.content));
+      const next = stored.filter((m) => {
+        if (m?.id && truncatedIds.has(m.id)) return true;
+        if (m?.role !== 'user' || typeof m.content !== 'string') return false;
+        return keptUserEntries.some((text) => userTurnsRelate(text, m.content!));
+      });
+      if (next.length !== stored.length) {
+        await db.run(
+          'INSERT OR REPLACE INTO chat_sessions (session_id, title, messages, updated_at) VALUES (?, ?, ?, CURRENT_TIMESTAMP)',
+          [sessionId, row.title ?? null, JSON.stringify(next)],
+        );
+      }
+    }
+  } catch {
+    // Overlay cleanup is best-effort; the JSONL is authoritative for reloads.
+  }
+
+  clearSessionFileCaches();
+  return json({ success: true });
+}

package/src/server/routes/chat/root.ts

@@ -0,0 +1,78 @@
+import { json } from '@/server/lib/remix-compat';
+import type { ActionFunctionArgs, LoaderFunctionArgs } from '@/server/lib/remix-compat';
+import { getDb } from '@/server/db.server';
+import { getSessionData } from '@/client/data/mock/chat';
+import { isMockMode } from '@/server/mock.server';
+
+export async function loader({ request }: LoaderFunctionArgs) {
+  const url = new URL(request.url);
+  const sessionId = url.searchParams.get('sessionId');
+  const mock = isMockMode();
+
+  try {
+    const db = await getDb();
+
+    if (sessionId) {
+      const existing = await db.get('SELECT * FROM chat_sessions WHERE session_id = ?', [sessionId]);
+      if (existing) {
+        let parsedMessages = [];
+        try {
+          parsedMessages = JSON.parse(existing.messages);
+        } catch {
+          parsedMessages = [];
+        }
+        return json({
+          session: {
+            id: existing.session_id,
+            title: existing.title || `Session ${sessionId}`,
+            messages: parsedMessages,
+          },
+          isMock: mock,
+        });
+      }
+
+      const initial = (mock ? getSessionData(sessionId) : null) || {
+        id: sessionId,
+        title: `Session ${sessionId}`,
+        messages: [],
+      };
+
+      await db.run(
+        'INSERT OR REPLACE INTO chat_sessions (session_id, title, messages, updated_at) VALUES (?, ?, ?, CURRENT_TIMESTAMP)',
+        [sessionId, initial.title, JSON.stringify(initial.messages)]
+      );
+
+      return json({ session: initial, isMock: mock });
+    }
+
+    // List all stored chat sessions
+    const rows = await db.all('SELECT session_id, title, updated_at FROM chat_sessions ORDER BY updated_at DESC');
+    return json({ sessions: rows, isMock: mock });
+  } catch (error: any) {
+    return json({ error: error.message, isMock: mock }, { status: 500 });
+  }
+}
+
+export async function action({ request }: ActionFunctionArgs) {
+  try {
+    const db = await getDb();
+    const data = await request.json();
+    const sessionId = data.sessionId;
+
+    if (!sessionId) {
+      return json({ error: 'sessionId is required' }, { status: 400 });
+    }
+
+    const messages = Array.isArray(data.messages) ? data.messages : [];
+    const title = data.title || `Session ${sessionId}`;
+
+    await db.run(
+      'INSERT OR REPLACE INTO chat_sessions (session_id, title, messages, updated_at) VALUES (?, ?, ?, CURRENT_TIMESTAMP)',
+      [sessionId, title, JSON.stringify(messages)]
+    );
+
+    return json({ success: true, session: { id: sessionId, title, messages } });
+  } catch (error: any) {
+    return json({ error: error.message }, { status: 500 });
+  }
+}