repoburg 1.3.188 → 1.3.196

package/agent-pane/frontend/src/hooks/useSessionStatus.ts

@@ -0,0 +1,34 @@
+import { useStore } from '../store/store.ts';
+import { statusToDot, statusToLabel, runtimeIcon } from '../types/index.ts';
+import type { Session } from '../types/index.ts';
+
+interface SessionStatus {
+  dot: string;
+  label: string;
+  iconClass: string;
+  iconText: string;
+  isRunning: boolean;
+  isFinished: boolean;
+}
+
+/** Hook: derive UI status (dot, label, icon) from a session by ID. */
+export function useSessionStatus(sessionId: string | null): SessionStatus | null {
+  const session = useStore((s) => (sessionId ? (s.sessions.find((x) => x.id === sessionId) ?? null) : null));
+  if (!session) return null;
+  return deriveSessionStatus(session);
+}
+
+/** Derive UI status from a Session object (no hook, for use in render props). */
+export function deriveSessionStatus(s: Session): SessionStatus {
+  const isRunning = s.is_running === 1;
+  const isFinished = s.lifecycle === 'finished';
+  const ri = runtimeIcon(s.runtime_type);
+  return {
+    dot: statusToDot(s.status, isRunning, s.has_unreviewed === 1, s.lifecycle),
+    label: statusToLabel(s.status, isRunning, s.has_unreviewed === 1, s.lifecycle),
+    iconClass: ri.iconClass,
+    iconText: ri.iconText,
+    isRunning,
+    isFinished,
+  };
+}

package/agent-pane/frontend/src/main.test.tsx

@@ -0,0 +1,37 @@
+import { describe, it, expect, vi } from 'vitest';
+
+// Mock react-dom/client before importing main.tsx
+const mockRender = vi.fn();
+const mockCreateRoot = vi.fn(() => ({ render: mockRender }));
+vi.mock('react-dom/client', () => ({
+  default: { createRoot: mockCreateRoot },
+  createRoot: mockCreateRoot,
+}));
+
+// Create #root element BEFORE importing main.tsx (jsdom has no #root by default)
+const rootEl = document.createElement('div');
+rootEl.id = 'root';
+document.body.appendChild(rootEl);
+
+// Import AFTER mock + root element are set up
+await import('./main.tsx');
+
+/** Type helper: extract first call arg from a mock with no typed params */
+function firstCallArg(mock: ReturnType<typeof vi.fn>): unknown {
+  const calls = mock.mock.calls as unknown as unknown[][];
+  return calls[0]?.[0];
+}
+
+describe('main.tsx', () => {
+  it('calls createRoot with the #root element', () => {
+    expect(mockCreateRoot).toHaveBeenCalledTimes(1);
+    expect(firstCallArg(mockCreateRoot)).toBe(rootEl);
+  });
+
+  it('calls render with a React element', () => {
+    expect(mockRender).toHaveBeenCalledTimes(1);
+    const vnode = firstCallArg(mockRender);
+    expect(vnode).toBeDefined();
+    expect(typeof vnode).toBe('object');
+  });
+});

package/agent-pane/frontend/src/main.tsx

@@ -7,4 +7,4 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
   <React.StrictMode>
     <App />
   </React.StrictMode>,
-);
+);

package/agent-pane/frontend/src/store/sessionSlice.ts

@@ -0,0 +1,417 @@
+import type { StateCreator } from 'zustand';
+import type { Session, SessionDetail, Turn } from '../types/index.ts';
+import type { StoreState, CreateSessionBody } from './store.ts';
+import {
+  fetchSessions,
+  fetchSessionDetail,
+  createSession as apiCreateSession,
+  deleteSession as apiDeleteSession,
+  submitPrompt as apiSubmitPrompt,
+  cancelTurn as apiCancelTurn,
+  renameSession as apiRenameSession,
+  markFinished as apiMarkFinished,
+  reopenSession as apiReopenSession,
+  clearUnreviewed as apiClearUnreviewed,
+  rewindSession as apiRewindSession,
+  branchSession as apiBranchSession,
+  updateModelConfig as apiUpdateModelConfig,
+  updateRuntimeConfig as apiUpdateRuntimeConfig,
+} from '../api/sessions.ts';
+import { fetchWorkspaces as apiFetchWorkspaces } from '../api/workspaces.ts';
+
+export type SessionSlice = {
+  sessions: Session[];
+  sessionDetails: Record<string, SessionDetail>;
+  activeSessionId: string | null;
+  openTabs: string[];
+  activeTurnIndex: number;
+  submittingPrompt: string | null;
+  restoredPrompt: string | null;
+
+  init: () => Promise<void>;
+  selectSession: (id: string) => Promise<void>;
+  closeTab: (id: string) => void;
+  createSession: (body: CreateSessionBody) => Promise<void>;
+  deleteSession: (id: string) => Promise<void>;
+  renameSession: (id: string, title: string) => Promise<void>;
+  markFinished: (id: string) => Promise<void>;
+  reopenSession: (id: string) => Promise<void>;
+  submitPrompt: (prompt: string) => Promise<void>;
+  cancelTurn: () => Promise<void>;
+  refreshActiveSession: () => Promise<void>;
+  rewindToTurn: (sessionId: string, turnId: string) => Promise<void>;
+  branchFromTurn: (sessionId: string, turnId: string, title?: string) => Promise<void>;
+  updateModelConfig: (model: string, reasoningEffort: string, runtimeType?: string) => Promise<void>;
+  updateRuntimeConfig: (config: Record<string, unknown>) => Promise<void>;
+};
+
+export const createSessionSlice: StateCreator<StoreState, [], [], SessionSlice> = (set, get) => ({
+  sessions: [],
+  sessionDetails: {},
+  activeSessionId: null,
+  openTabs: [],
+  activeTurnIndex: 0,
+  submittingPrompt: null,
+  restoredPrompt: null,
+
+  init: async () => {
+    try {
+      const saved = localStorage.getItem('agentpane:last-model-config');
+      if (saved) set({ lastModelConfig: JSON.parse(saved) });
+    } catch {
+      /* ignore parse errors */
+    }
+
+    set({ loading: true, error: null });
+    try {
+      const [sessions, workspaces] = await Promise.all([fetchSessions(), apiFetchWorkspaces()]);
+      set({ sessions, workspaces, loading: false });
+      if (sessions.length > 0 && !get().activeSessionId) {
+        await get().selectSession(sessions[0].id);
+      }
+    } catch (err) {
+      set({ loading: false, error: (err as Error).message });
+    }
+  },
+
+  selectSession: async (id) => {
+    if (get().sessionDetails[id]) {
+      const detail = get().sessionDetails[id];
+      set({
+        activeSessionId: id,
+        activeTurnIndex: detail.turns.length > 0 ? detail.turns.length - 1 : 0,
+        activeRightTab: 'turns',
+        openTabs: get().openTabs.includes(id) ? get().openTabs : [...get().openTabs, id],
+      });
+      if (detail.has_unreviewed === 1) {
+        apiClearUnreviewed(id).catch(() => {});
+        set((state) => ({
+          sessions: state.sessions.map((s) => (s.id === id ? { ...s, has_unreviewed: 0 } : s)),
+          sessionDetails: { ...state.sessionDetails, [id]: { ...detail, has_unreviewed: 0 } },
+        }));
+      }
+      return;
+    }
+
+    set({ loading: true, error: null });
+    try {
+      const detail = await fetchSessionDetail(id);
+      set((state) => ({
+        sessionDetails: { ...state.sessionDetails, [id]: detail },
+        activeSessionId: id,
+        activeTurnIndex: detail.turns.length > 0 ? detail.turns.length - 1 : 0,
+        activeRightTab: 'turns',
+        loading: false,
+      }));
+      if (detail.has_unreviewed === 1) {
+        apiClearUnreviewed(id).catch(() => {});
+        set((state) => ({
+          sessions: state.sessions.map((s) => (s.id === id ? { ...s, has_unreviewed: 0 } : s)),
+          sessionDetails: { ...state.sessionDetails, [id]: { ...detail, has_unreviewed: 0 } },
+        }));
+      }
+    } catch (err) {
+      set({ loading: false, error: (err as Error).message });
+    }
+  },
+
+  closeTab: (id) => {
+    set((state) => {
+      const newTabs = state.openTabs.filter((t) => t !== id);
+      if (state.activeSessionId === id && newTabs.length > 0) {
+        const newActive = newTabs[newTabs.length - 1];
+        const detail = state.sessionDetails[newActive];
+        return {
+          openTabs: newTabs,
+          activeSessionId: newActive,
+          activeTurnIndex: detail && detail.turns.length > 0 ? detail.turns.length - 1 : 0,
+        };
+      }
+      return {
+        openTabs: newTabs,
+        activeSessionId: state.activeSessionId === id ? null : state.activeSessionId,
+      };
+    });
+  },
+
+  updateModelConfig: async (model, reasoningEffort, runtimeType) => {
+    const sessionId = get().activeSessionId;
+    if (!sessionId) return;
+
+    set({ error: null });
+    try {
+      const updated = await apiUpdateModelConfig(sessionId, model, reasoningEffort, runtimeType);
+
+      const config = {
+        provider: updated.runtime_type,
+        model: updated.model ?? '',
+        reasoning: updated.model_reasoning_effort ?? '',
+      };
+      set({ lastModelConfig: config });
+      localStorage.setItem('agentpane:last-model-config', JSON.stringify(config));
+
+      set((state) => ({
+        sessions: state.sessions.map((s) => (s.id === sessionId ? updated : s)),
+        sessionDetails: state.sessionDetails[sessionId]
+          ? {
+              ...state.sessionDetails,
+              [sessionId]: {
+                ...state.sessionDetails[sessionId],
+                model: updated.model,
+                model_reasoning_effort: updated.model_reasoning_effort,
+                external_thread_id: updated.external_thread_id,
+              },
+            }
+          : state.sessionDetails,
+      }));
+
+      await get().refreshActiveSession();
+    } catch (err) {
+      set({ error: (err as Error).message });
+      get().addToast('error', `Failed to update model — ${(err as Error).message}`);
+    }
+  },
+
+  createSession: async (body) => {
+    set({ error: null });
+    try {
+      const session = await apiCreateSession(body);
+      set((state) => ({
+        sessions: [session, ...state.sessions],
+        showNewSessionDialog: false,
+      }));
+
+      const config = {
+        provider: session.runtime_type,
+        model: session.model ?? '',
+        reasoning: session.model_reasoning_effort ?? '',
+      };
+      set({ lastModelConfig: config });
+      localStorage.setItem('agentpane:last-model-config', JSON.stringify(config));
+
+      await get().selectSession(session.id);
+      get().addLogEntry('INFO', `Session created — ${session.id.slice(0, 8)}`);
+      get().addToast('success', `Session created — ${session.title || session.id.slice(0, 8)}`);
+    } catch (err) {
+      set({ error: (err as Error).message });
+      get().addToast('error', `Failed to create session — ${(err as Error).message}`);
+    }
+  },
+
+  deleteSession: async (id) => {
+    set({ error: null });
+    const sessionTitle = get().sessions.find((s) => s.id === id)?.title;
+    try {
+      await apiDeleteSession(id);
+      set((state) => {
+        const newDetails = { ...state.sessionDetails };
+        delete newDetails[id];
+        const newTabs = state.openTabs.filter((t) => t !== id);
+        let newActive = state.activeSessionId;
+        let newTurnIndex = state.activeTurnIndex;
+        if (state.activeSessionId === id) {
+          newActive = newTabs.length > 0 ? newTabs[newTabs.length - 1] : null;
+          const detail = newActive ? newDetails[newActive] : null;
+          newTurnIndex = detail && detail.turns.length > 0 ? detail.turns.length - 1 : 0;
+        }
+        return {
+          sessions: state.sessions.filter((s) => s.id !== id),
+          sessionDetails: newDetails,
+          openTabs: newTabs,
+          activeSessionId: newActive,
+          activeTurnIndex: newTurnIndex,
+        };
+      });
+      get().addLogEntry('INFO', `Session deleted — ${id.slice(0, 8)}`);
+      get().addToast('info', `Session "${sessionTitle || id.slice(0, 8)}" deleted`);
+    } catch (err) {
+      set({ error: (err as Error).message });
+      get().addToast('error', `Failed to delete session — ${(err as Error).message}`);
+    }
+  },
+
+  renameSession: async (id, title) => {
+    set({ error: null });
+    try {
+      const updated = await apiRenameSession(id, title.trim());
+      set((state) => ({
+        sessions: state.sessions.map((s) => (s.id === id ? updated : s)),
+        sessionDetails: state.sessionDetails[id]
+          ? { ...state.sessionDetails, [id]: { ...state.sessionDetails[id], title: updated.title } }
+          : state.sessionDetails,
+      }));
+    } catch (err) {
+      set({ error: (err as Error).message });
+      get().addToast('error', `Failed to rename session — ${(err as Error).message}`);
+    }
+  },
+
+  markFinished: async (id) => {
+    set({ error: null });
+    try {
+      const updated = await apiMarkFinished(id);
+      set((state) => ({
+        sessions: state.sessions.map((s) => (s.id === id ? updated : s)),
+      }));
+      get().addToast('info', 'Session marked as finished');
+    } catch (err) {
+      set({ error: (err as Error).message });
+      get().addToast('error', `Failed to mark as finished — ${(err as Error).message}`);
+    }
+  },
+
+  reopenSession: async (id) => {
+    set({ error: null });
+    try {
+      const updated = await apiReopenSession(id);
+      set((state) => ({
+        sessions: state.sessions.map((s) => (s.id === id ? updated : s)),
+      }));
+      get().addToast('info', 'Session reopened');
+    } catch (err) {
+      set({ error: (err as Error).message });
+      get().addToast('error', `Failed to reopen session — ${(err as Error).message}`);
+    }
+  },
+
+  submitPrompt: async (prompt) => {
+    const sessionId = get().activeSessionId;
+    if (!sessionId) return;
+
+    set({ error: null, submittingPrompt: prompt });
+
+    set((state) => {
+      const detail = state.sessionDetails[sessionId];
+      if (!detail) return {};
+      return {
+        sessionDetails: {
+          ...state.sessionDetails,
+          [sessionId]: { ...detail, is_running: 1, status: 'running' },
+        },
+        sessions: state.sessions.map((s) => (s.id === sessionId ? { ...s, is_running: 1, status: 'running' } : s)),
+      };
+    });
+
+    try {
+      const turn = await apiSubmitPrompt(sessionId, prompt);
+      get().addLogEntry('INFO', `Turn submitted — "${prompt.slice(0, 40)}"`);
+
+      set((state) => {
+        const detail = state.sessionDetails[sessionId];
+        if (!detail) return { submittingPrompt: null };
+        const newTurn: Turn = { ...turn, items: [] };
+        return {
+          submittingPrompt: null,
+          sessionDetails: {
+            ...state.sessionDetails,
+            [sessionId]: {
+              ...detail,
+              turns: [...detail.turns, newTurn],
+            },
+          },
+          activeTurnIndex: detail.turns.length,
+        };
+      });
+    } catch (err) {
+      set({ submittingPrompt: null, error: (err as Error).message });
+      get().addLogEntry('ERROR', `Turn failed — ${(err as Error).message}`);
+      get().addToast('error', `Failed to send prompt — ${(err as Error).message}`);
+
+      set((state) => ({
+        sessionDetails: state.sessionDetails[sessionId]
+          ? {
+              ...state.sessionDetails,
+              [sessionId]: { ...state.sessionDetails[sessionId], is_running: 0, status: 'active' },
+            }
+          : state.sessionDetails,
+        sessions: state.sessions.map((s) => (s.id === sessionId ? { ...s, is_running: 0, status: 'active' } : s)),
+      }));
+    }
+  },
+
+  cancelTurn: async () => {
+    const sessionId = get().activeSessionId;
+    if (!sessionId) return;
+
+    try {
+      await apiCancelTurn(sessionId);
+    } catch (err) {
+      set({ error: (err as Error).message });
+    }
+  },
+
+  rewindToTurn: async (sessionId, turnId) => {
+    set({ error: null });
+    try {
+      await apiRewindSession(sessionId, turnId);
+      const detail = await fetchSessionDetail(sessionId);
+      set((state) => ({
+        sessionDetails: { ...state.sessionDetails, [sessionId]: detail },
+        sessions: state.sessions.map((s) =>
+          s.id === sessionId ? { ...s, external_thread_id: null, is_running: 0, status: 'active' } : s,
+        ),
+        activeTurnIndex: detail.turns.length > 0 ? detail.turns.length - 1 : 0,
+      }));
+      get().addToast('info', 'Rewound to selected turn');
+    } catch (err) {
+      set({ error: (err as Error).message });
+      get().addToast('error', `Failed to rewind — ${(err as Error).message}`);
+    }
+  },
+
+  branchFromTurn: async (sessionId, turnId, title) => {
+    set({ error: null });
+    try {
+      const newSession = await apiBranchSession(sessionId, turnId, title);
+      set((state) => ({
+        sessions: [newSession, ...state.sessions],
+      }));
+      await get().selectSession(newSession.id);
+      get().addToast('success', 'Branched from selected turn');
+    } catch (err) {
+      set({ error: (err as Error).message });
+      get().addToast('error', `Failed to branch — ${(err as Error).message}`);
+    }
+  },
+
+  updateRuntimeConfig: async (config) => {
+    const sessionId = get().activeSessionId;
+    if (!sessionId) return;
+
+    set({ error: null });
+    try {
+      const updated = await apiUpdateRuntimeConfig(sessionId, JSON.stringify(config));
+
+      set((state) => ({
+        sessions: state.sessions.map((s) => (s.id === sessionId ? updated : s)),
+        sessionDetails: state.sessionDetails[sessionId]
+          ? {
+              ...state.sessionDetails,
+              [sessionId]: { ...state.sessionDetails[sessionId], runtime_config: updated.runtime_config },
+            }
+          : state.sessionDetails,
+      }));
+    } catch (err) {
+      set({ error: (err as Error).message });
+      get().addToast('error', `Failed to update config — ${(err as Error).message}`);
+    }
+  },
+
+  refreshActiveSession: async () => {
+    const sessionId = get().activeSessionId;
+    if (!sessionId) return;
+
+    try {
+      const detail = await fetchSessionDetail(sessionId);
+      set((state) => ({
+        sessionDetails: { ...state.sessionDetails, [sessionId]: detail },
+        activeTurnIndex: detail.turns.length > 0 ? Math.min(state.activeTurnIndex, detail.turns.length - 1) : 0,
+        sessions: state.sessions.map((s) =>
+          s.id === sessionId ? { ...s, is_running: detail.is_running, status: detail.status } : s,
+        ),
+      }));
+    } catch (err) {
+      set({ error: (err as Error).message });
+    }
+  },
+});