@jcjeon/integration-cli 0.2.0

package/apps/web/src/features/chat/hooks/__tests__/useCodexSessions.test.ts

@@ -0,0 +1,131 @@
+import { act, renderHook, waitFor } from "@testing-library/react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+
+import * as sessionsApi from "../../api/sessions.api";
+import { useCodexSessions } from "../useCodexSessions";
+
+vi.mock("../../api/sessions.api", () => ({
+  createCodexSession: vi.fn(),
+  deleteCodexSession: vi.fn(),
+  fetchConversations: vi.fn(),
+  fetchDBSessions: vi.fn(),
+  saveCodexConversation: vi.fn(),
+}));
+
+const socketMock = vi.hoisted(() => {
+  const handlers: Record<string, (payload?: unknown) => void> = {};
+  const socket = {
+    on: vi.fn((event: string, handler: (payload?: unknown) => void) => {
+      handlers[event] = handler;
+      return socket;
+    }),
+    emit: vi.fn(),
+    disconnect: vi.fn(),
+  };
+  return {
+    handlers,
+    socket,
+    io: vi.fn(() => socket),
+    reset() {
+      for (const key of Object.keys(handlers)) delete handlers[key];
+      socket.on.mockClear();
+      socket.emit.mockClear();
+      socket.disconnect.mockClear();
+      this.io.mockClear();
+    },
+  };
+});
+
+vi.mock("socket.io-client", () => ({ io: socketMock.io }));
+
+const mockFetchDB = vi.mocked(sessionsApi.fetchDBSessions);
+const mockFetchConversations = vi.mocked(sessionsApi.fetchConversations);
+const mockCreateSession = vi.mocked(sessionsApi.createCodexSession);
+const mockDeleteSession = vi.mocked(sessionsApi.deleteCodexSession);
+const mockSave = vi.mocked(sessionsApi.saveCodexConversation);
+
+beforeEach(() => {
+  mockFetchDB.mockResolvedValue([{ sessionId: "db-1", title: "DB", createdAt: "2024-01-01" }]);
+  mockFetchConversations.mockResolvedValue([
+    { id: "c1", sessionId: "db-1", promptId: "p1", type: "agent_message", content: "codex", createdAt: "2024-01-01", agentModel: "codex" },
+    { id: "c2", sessionId: "db-1", promptId: "p2", type: "agent_message", content: "gemini", createdAt: "2024-01-01", agentModel: "gemini" },
+  ]);
+  mockCreateSession.mockResolvedValue({ id: "old-1", title: "Codex", createdAt: "2024-01-02", workingDirectory: "/tmp/codex" });
+});
+
+afterEach(() => {
+  vi.clearAllMocks();
+  socketMock.reset();
+});
+
+describe("useCodexSessions", () => {
+  it("connects and loads DB sessions", async () => {
+    const { result } = renderHook(() => useCodexSessions());
+    act(() => { socketMock.handlers.connect?.(); });
+
+    await waitFor(() => expect(result.current.connectionStatus).toBe("connected"));
+    await waitFor(() => expect(result.current.sessions[0].agentId).toBe("codex"));
+  });
+
+  it("creates, sends, saves on result, and supports session replacement", async () => {
+    const { result } = renderHook(() => useCodexSessions());
+
+    await act(async () => { await result.current.createSession("/tmp/codex"); });
+    expect(result.current.selectedSessionId).toBe("old-1");
+
+    act(() => { result.current.sendMessage("old-1", "hello"); });
+    expect(socketMock.socket.emit).toHaveBeenCalledWith("session:message", { sessionId: "old-1", input: "hello" });
+    expect(mockSave).not.toHaveBeenCalled();
+
+    act(() => {
+      socketMock.handlers["session:text"]?.({ sessionId: "old-1", text: "answer" });
+      socketMock.handlers["session:replaced"]?.({ oldSessionId: "old-1", newSessionId: "new-1" });
+      socketMock.handlers["session:result"]?.({ sessionId: "new-1", isError: false });
+    });
+
+    expect(result.current.selectedSessionId).toBe("new-1");
+    expect(mockSave).toHaveBeenCalledWith("new-1", expect.any(String), "hello", "user_message");
+    expect(mockSave).toHaveBeenCalledWith("new-1", expect.any(String), "answer", "agent_message");
+  });
+
+  it("loads codex conversations and terminates selected session", async () => {
+    const { result } = renderHook(() => useCodexSessions());
+    act(() => { socketMock.handlers.connect?.(); });
+    await waitFor(() => expect(result.current.sessions).toHaveLength(1));
+
+    act(() => { result.current.selectSession("db-1"); });
+    await waitFor(() => expect(mockFetchConversations).toHaveBeenCalledWith("db-1"));
+    await waitFor(() => expect(result.current.selectedSession?.messages).toHaveLength(1));
+
+    await act(async () => { await result.current.terminateSession("db-1"); });
+    expect(mockDeleteSession).toHaveBeenCalledWith("db-1");
+    expect(result.current.selectedSessionId).toBeNull();
+  });
+
+  it("keeps the session visible when terminate fails", async () => {
+    mockDeleteSession.mockRejectedValueOnce(new Error("delete failed"));
+    const { result } = renderHook(() => useCodexSessions());
+    act(() => { socketMock.handlers.connect?.(); });
+    await waitFor(() => expect(result.current.sessions).toHaveLength(1));
+
+    await act(async () => { await result.current.terminateSession("db-1"); });
+
+    expect(result.current.sessions).toHaveLength(1);
+    expect(result.current.error).toBe("delete failed");
+  });
+
+  it("handles exit, disconnect, and socket errors", async () => {
+    const { result } = renderHook(() => useCodexSessions());
+    await act(async () => { await result.current.createSession(); });
+    act(() => {
+      socketMock.handlers["session:text"]?.({ sessionId: "old-1", text: "partial" });
+      socketMock.handlers["session:exit"]?.({ sessionId: "old-1" });
+      socketMock.handlers.disconnect?.();
+      socketMock.handlers.error?.({ message: "socket failed" });
+    });
+
+    expect(result.current.selectedSession?.streaming).toBe("");
+    expect(result.current.connectionStatus).toBe("disconnected");
+    expect(result.current.error).toBe("socket failed");
+  });
+});

package/apps/web/src/features/chat/hooks/__tests__/useGeminiSessions.test.ts

@@ -0,0 +1,130 @@
+import { act, renderHook, waitFor } from "@testing-library/react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+
+import * as sessionsApi from "../../api/sessions.api";
+import { useGeminiSessions } from "../useGeminiSessions";
+
+vi.mock("../../api/sessions.api", () => ({
+  createGeminiSession: vi.fn(),
+  deleteGeminiSession: vi.fn(),
+  fetchConversations: vi.fn(),
+  fetchDBSessions: vi.fn(),
+  saveGeminiConversation: vi.fn(),
+}));
+
+const socketMock = vi.hoisted(() => {
+  const handlers: Record<string, (payload?: unknown) => void> = {};
+  const socket = {
+    on: vi.fn((event: string, handler: (payload?: unknown) => void) => {
+      handlers[event] = handler;
+      return socket;
+    }),
+    emit: vi.fn(),
+    disconnect: vi.fn(),
+  };
+  return {
+    handlers,
+    socket,
+    io: vi.fn(() => socket),
+    reset() {
+      for (const key of Object.keys(handlers)) delete handlers[key];
+      socket.on.mockClear();
+      socket.emit.mockClear();
+      socket.disconnect.mockClear();
+      this.io.mockClear();
+    },
+  };
+});
+
+vi.mock("socket.io-client", () => ({ io: socketMock.io }));
+
+const mockFetchDB = vi.mocked(sessionsApi.fetchDBSessions);
+const mockFetchConversations = vi.mocked(sessionsApi.fetchConversations);
+const mockCreateSession = vi.mocked(sessionsApi.createGeminiSession);
+const mockDeleteSession = vi.mocked(sessionsApi.deleteGeminiSession);
+const mockSave = vi.mocked(sessionsApi.saveGeminiConversation);
+
+beforeEach(() => {
+  mockFetchDB.mockResolvedValue([{ sessionId: "db-1", title: "DB", createdAt: "2024-01-01" }]);
+  mockFetchConversations.mockResolvedValue([
+    { id: "c1", sessionId: "db-1", promptId: "p1", type: "user_message", content: "hi", createdAt: "2024-01-01", agentModel: "gemini" },
+    { id: "c2", sessionId: "db-1", promptId: "p2", type: "agent_message", content: "other", createdAt: "2024-01-01", agentModel: "codex" },
+  ]);
+  mockCreateSession.mockResolvedValue({ id: "new-1", title: "Gemini", createdAt: "2024-01-02", workingDirectory: "/tmp/project" });
+});
+
+afterEach(() => {
+  vi.clearAllMocks();
+  socketMock.reset();
+});
+
+describe("useGeminiSessions", () => {
+  it("connects and loads DB sessions", async () => {
+    const { result } = renderHook(() => useGeminiSessions());
+
+    expect(result.current.connectionStatus).toBe("connecting");
+    act(() => { socketMock.handlers.connect?.(); });
+
+    await waitFor(() => expect(result.current.connectionStatus).toBe("connected"));
+    await waitFor(() => expect(result.current.sessions[0].info.id).toBe("db-1"));
+  });
+
+  it("creates, selects, sends, streams, and finishes a session", async () => {
+    const { result } = renderHook(() => useGeminiSessions());
+
+    let id: string | null = null;
+    await act(async () => { id = await result.current.createSession("/tmp/project"); });
+    expect(id).toBe("new-1");
+    expect(result.current.selectedSession?.info.title).toBe("project");
+
+    act(() => { result.current.sendMessage("new-1", "hello"); });
+    expect(socketMock.socket.emit).toHaveBeenCalledWith("session:message", { sessionId: "new-1", input: "hello" });
+    expect(result.current.selectedSession?.messages[0].content).toBe("hello");
+
+    act(() => {
+      socketMock.handlers["session:text"]?.({ sessionId: "new-1", text: "answer" });
+      socketMock.handlers["session:result"]?.({ sessionId: "new-1", isError: false });
+    });
+
+    expect(mockSave).toHaveBeenCalled();
+    expect(result.current.selectedSession?.messages.at(-1)?.content).toBe("answer");
+    expect(result.current.selectedSession?.isWaiting).toBe(false);
+  });
+
+  it("loads conversations when selecting a DB session and terminates it", async () => {
+    const { result } = renderHook(() => useGeminiSessions());
+    act(() => { socketMock.handlers.connect?.(); });
+    await waitFor(() => expect(result.current.sessions).toHaveLength(1));
+
+    act(() => { result.current.selectSession("db-1"); });
+    await waitFor(() => expect(mockFetchConversations).toHaveBeenCalledWith("db-1"));
+    await waitFor(() => expect(result.current.selectedSession?.messages).toHaveLength(1));
+
+    await act(async () => { await result.current.terminateSession("db-1"); });
+    expect(mockDeleteSession).toHaveBeenCalledWith("db-1");
+    expect(result.current.sessions).toEqual([]);
+  });
+
+  it("keeps the session visible when terminate fails", async () => {
+    mockDeleteSession.mockRejectedValueOnce(new Error("delete failed"));
+    const { result } = renderHook(() => useGeminiSessions());
+    act(() => { socketMock.handlers.connect?.(); });
+    await waitFor(() => expect(result.current.sessions).toHaveLength(1));
+
+    await act(async () => { await result.current.terminateSession("db-1"); });
+
+    expect(result.current.sessions).toHaveLength(1);
+    expect(result.current.error).toBe("delete failed");
+  });
+
+  it("sets errors from socket and create failures", async () => {
+    mockCreateSession.mockRejectedValueOnce(new Error("create failed"));
+    const { result } = renderHook(() => useGeminiSessions());
+
+    await act(async () => { await result.current.createSession(); });
+    expect(result.current.error).toBe("create failed");
+
+    act(() => { socketMock.handlers.error?.({ message: "socket failed" }); });
+    expect(result.current.error).toBe("socket failed");
+  });
+});

package/apps/web/src/features/chat/hooks/useAgentModelSettings.ts

@@ -0,0 +1,54 @@
+"use client";
+
+import { useCallback, useEffect, useState } from "react";
+
+import type { AgentId } from "../ui/AgentSelectModal";
+import type { AgentModelSettings, AgentModelSettingsByAgent } from "../lib/agentModelOptions";
+
+const STORAGE_KEY = "ji.agentModelSettings";
+
+const DEFAULT_SETTINGS: AgentModelSettingsByAgent = {
+  claude: { model: "default", reasoning: "default" },
+  codex: { model: "default", reasoning: "default" },
+};
+
+function readStoredSettings(): AgentModelSettingsByAgent {
+  try {
+    const raw = window.localStorage.getItem(STORAGE_KEY);
+    if (!raw) return DEFAULT_SETTINGS;
+    const parsed = JSON.parse(raw) as AgentModelSettingsByAgent;
+    return { ...DEFAULT_SETTINGS, ...parsed };
+  } catch {
+    return DEFAULT_SETTINGS;
+  }
+}
+
+export function useAgentModelSettings() {
+  const [settingsByAgent, setSettingsByAgent] =
+    useState<AgentModelSettingsByAgent>(DEFAULT_SETTINGS);
+  const [hydrated, setHydrated] = useState(false);
+
+  useEffect(() => {
+    setSettingsByAgent(readStoredSettings());
+    setHydrated(true);
+  }, []);
+
+  useEffect(() => {
+    if (!hydrated) return;
+    try {
+      window.localStorage.setItem(STORAGE_KEY, JSON.stringify(settingsByAgent));
+    } catch {}
+  }, [hydrated, settingsByAgent]);
+
+  const updateSettings = useCallback((agentId: AgentId, settings: AgentModelSettings) => {
+    setSettingsByAgent((prev) => ({
+      ...prev,
+      [agentId]: {
+        ...(prev[agentId] ?? {}),
+        ...settings,
+      },
+    }));
+  }, []);
+
+  return { settingsByAgent, updateSettings };
+}

package/apps/web/src/features/chat/hooks/useClaudeSessions.ts

@@ -0,0 +1,323 @@
+"use client";
+
+import { useCallback, useEffect, useRef, useState } from "react";
+import { io, type Socket } from "socket.io-client";
+
+import { CLAUDE_WS_NAMESPACE, SERVER_URL } from "@/lib/constants";
+import {
+  createSession as apiCreateSession,
+  deleteSession,
+  fetchConversations,
+  fetchDBSessions,
+  saveConversation,
+  updateSessionTitle,
+} from "../api/sessions.api";
+import type { DBConversation, SessionInfo } from "../api/sessions.api";
+import type { AgentModelSettings } from "../lib/agentModelOptions";
+import type { AgentId } from "../ui/AgentSelectModal";
+
+// ─── 타입 ────────────────────────────────────────────────────────────────────
+
+export type ConnectionStatus = "disconnected" | "connecting" | "connected";
+export type MessageRole = "user" | "assistant" | "permission" | "system";
+
+export interface ToolUseBlock {
+  tool: string;
+  input: Record<string, unknown>;
+}
+
+export interface ResultMeta {
+  result: string;
+  isError: boolean;
+  durationMs: number;
+  costUsd: number;
+}
+
+export interface ChatMessage {
+  id: string;
+  role: MessageRole;
+  content: string;
+  toolUses?: ToolUseBlock[];
+  meta?: ResultMeta;
+  createdAt: Date;
+}
+
+export interface SessionState {
+  info: SessionInfo;
+  messages: ChatMessage[];
+  streaming: string;
+  isWaiting: boolean;
+  messagesLoaded: boolean;
+  agentId: AgentId;
+}
+
+export type { AgentId };
+
+export { SessionInfo };
+
+// ─── 헬퍼 ────────────────────────────────────────────────────────────────────
+
+let msgId = 0;
+const nextId = () => String(++msgId);
+
+function toMessages(convos: DBConversation[]): ChatMessage[] {
+  return convos.map((c) => ({
+    id: c.id,
+    role: c.type === "user_message" ? "user" : "assistant",
+    content: c.content,
+    createdAt: new Date(c.createdAt),
+  }));
+}
+
+// ─── Hook ────────────────────────────────────────────────────────────────────
+
+export function useClaudeSessions() {
+  const socketRef = useRef<Socket | null>(null);
+  const [connectionStatus, setConnectionStatus] = useState<ConnectionStatus>("disconnected");
+  const [sessions, setSessions] = useState<SessionState[]>([]);
+  const [selectedSessionId, setSelectedSessionId] = useState<string | null>(null);
+  const [error, setError] = useState<string | null>(null);
+
+  const streamingRef = useRef<Record<string, string>>({});
+  const pendingToolsRef = useRef<Record<string, ToolUseBlock[]>>({});
+  const pendingPromptIdRef = useRef<Record<string, string>>({});
+  const loadingSessionsRef = useRef<Set<string>>(new Set());
+
+  // ─── DB 세션 로드 ──────────────────────────────────────────────────────────
+
+  const loadSessionsFromDB = useCallback(async () => {
+    try {
+      const dbSessions = await fetchDBSessions('claude');
+      setSessions((prev) => {
+        const existingIds = new Set(prev.map((s) => s.info.id));
+        const newStates: SessionState[] = dbSessions
+          .filter((s) => !existingIds.has(s.sessionId))
+          .map((s) => ({
+            info: { id: s.sessionId, title: !s.title || s.title === "server" ? "Claude" : s.title, createdAt: s.createdAt },
+            messages: [],
+            streaming: "",
+            isWaiting: false,
+            messagesLoaded: false,
+            agentId: "claude" as AgentId,
+          }));
+        return [...prev, ...newStates].sort(
+          (a, b) => new Date(b.info.createdAt).getTime() - new Date(a.info.createdAt).getTime(),
+        );
+      });
+    } catch {}
+  }, []);
+
+  // ─── 대화 기록 로드 ────────────────────────────────────────────────────────
+
+  const loadConversations = useCallback(async (sessionId: string) => {
+    if (loadingSessionsRef.current.has(sessionId)) return;
+    loadingSessionsRef.current.add(sessionId);
+    try {
+      const convos = await fetchConversations(sessionId);
+      setSessions((prev) =>
+        prev.map((s) =>
+          s.info.id === sessionId ? { ...s, messages: toMessages(convos), messagesLoaded: true } : s,
+        ),
+      );
+    } catch {
+      setSessions((prev) =>
+        prev.map((s) => (s.info.id === sessionId ? { ...s, messagesLoaded: true } : s)),
+      );
+    }
+  }, []);
+
+  // ─── WebSocket ─────────────────────────────────────────────────────────────
+
+  useEffect(() => {
+    const socket = io(`${SERVER_URL}${CLAUDE_WS_NAMESPACE}`, { transports: ["websocket"] });
+    socketRef.current = socket;
+    setConnectionStatus("connecting");
+
+    socket.on("connect", () => {
+      setConnectionStatus("connected");
+      void loadSessionsFromDB();
+    });
+
+    socket.on("disconnect", () => setConnectionStatus("disconnected"));
+
+    socket.on("session:text", ({ sessionId, text }: { sessionId: string; text: string }) => {
+      streamingRef.current[sessionId] = (streamingRef.current[sessionId] ?? "") + text;
+      const accumulated = streamingRef.current[sessionId];
+      setSessions((prev) =>
+        prev.map((s) =>
+          s.info.id === sessionId ? { ...s, streaming: accumulated, isWaiting: true } : s,
+        ),
+      );
+    });
+
+    socket.on(
+      "session:tool",
+      ({ sessionId, tool, input }: { sessionId: string; tool: string; input: Record<string, unknown> }) => {
+        if (!pendingToolsRef.current[sessionId]) pendingToolsRef.current[sessionId] = [];
+        pendingToolsRef.current[sessionId].push({ tool, input });
+      },
+    );
+
+    socket.on(
+      "session:result",
+      ({ sessionId, result, isError, durationMs, costUsd }: { sessionId: string } & ResultMeta) => {
+        const content = (streamingRef.current[sessionId] ?? "").trim();
+        const toolUses = pendingToolsRef.current[sessionId] ?? [];
+        streamingRef.current[sessionId] = "";
+        pendingToolsRef.current[sessionId] = [];
+
+        const promptId = pendingPromptIdRef.current[sessionId];
+        if (promptId && content) {
+          saveConversation(sessionId, promptId, content, "agent_message");
+          delete pendingPromptIdRef.current[sessionId];
+        }
+
+        setSessions((prev) =>
+          prev.map((s) => {
+            if (s.info.id !== sessionId) return s;
+            const newMessages = [...s.messages];
+            if (content || toolUses.length > 0) {
+              newMessages.push({
+                id: nextId(),
+                role: "assistant",
+                content,
+                toolUses: toolUses.length > 0 ? toolUses : undefined,
+                meta: { result, isError, durationMs, costUsd },
+                createdAt: new Date(),
+              });
+            }
+            return { ...s, messages: newMessages, streaming: "", isWaiting: false };
+          }),
+        );
+      },
+    );
+
+    socket.on("session:exit", ({ sessionId }: { sessionId: string }) => {
+      streamingRef.current[sessionId] = "";
+      pendingToolsRef.current[sessionId] = [];
+      setSessions((prev) =>
+        prev.map((s) => (s.info.id === sessionId ? { ...s, streaming: "", isWaiting: false } : s)),
+      );
+    });
+
+    socket.on("error", ({ message }: { message: string }) => setError(message));
+
+    return () => { socket.disconnect(); };
+  }, [loadSessionsFromDB]);
+
+  // ─── 세션 선택 시 대화 기록 로드 ─────────────────────────────────────────
+
+  useEffect(() => {
+    if (!selectedSessionId) return;
+    const session = sessions.find((s) => s.info.id === selectedSessionId);
+    if (!session || session.messagesLoaded) return;
+    void loadConversations(selectedSessionId);
+  }, [selectedSessionId, sessions, loadConversations]);
+
+  // ─── 공개 API ─────────────────────────────────────────────────────────────
+
+  const renameSession = useCallback((sessionId: string, newTitle: string) => {
+    setSessions((prev) =>
+      prev.map((s) =>
+        s.info.id === sessionId ? { ...s, info: { ...s.info, title: newTitle } } : s,
+      ),
+    );
+    void updateSessionTitle(sessionId, newTitle).catch(() => undefined);
+  }, []);
+
+  const createSession = useCallback(async (
+    agentId: AgentId,
+    workingDirectory?: string,
+    modelSettings?: AgentModelSettings,
+  ): Promise<string | null> => {
+    setError(null);
+    try {
+      const raw = await apiCreateSession({ workingDirectory, ...modelSettings });
+      const title = raw.workingDirectory
+        ? raw.workingDirectory.replace(/[/\\]+$/, "").split(/[/\\]/).filter(Boolean).at(-1) ?? "Claude"
+        : "Claude";
+
+      const newState: SessionState = {
+        info: { ...raw, title },
+        messages: [],
+        streaming: "",
+        isWaiting: false,
+        messagesLoaded: true,
+        agentId,
+      };
+
+      setSessions((prev) => [newState, ...prev]);
+      setSelectedSessionId(raw.id);
+      return raw.id;
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "세션 생성 실패");
+      return null;
+    }
+  }, []);
+
+  const sendMessage = useCallback((sessionId: string, text: string, modelSettings?: AgentModelSettings) => {
+    const promptId = crypto.randomUUID();
+    pendingPromptIdRef.current[sessionId] = promptId;
+
+    setSessions((prev) =>
+      prev.map((s) =>
+        s.info.id === sessionId
+          ? {
+              ...s,
+              messages: [
+                ...s.messages,
+                { id: nextId(), role: "user", content: text, createdAt: new Date() },
+              ],
+              isWaiting: true,
+            }
+          : s,
+      ),
+    );
+
+    saveConversation(sessionId, promptId, text, "user_message");
+    socketRef.current?.emit("session:message", {
+      sessionId,
+      input: text,
+      ...modelSettings,
+    });
+  }, []);
+
+  const terminateSession = useCallback(async (sessionId: string) => {
+    try {
+      await deleteSession(sessionId);
+      setSessions((prev) => prev.filter((s) => s.info.id !== sessionId));
+      setSelectedSessionId((prev) => (prev === sessionId ? null : prev));
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "세션 삭제 실패");
+    }
+  }, []);
+
+  const injectMessage = useCallback(
+    (sessionId: string, message: Omit<ChatMessage, "id" | "createdAt">) => {
+      setSessions((prev) =>
+        prev.map((s) =>
+          s.info.id === sessionId
+            ? { ...s, messages: [...s.messages, { ...message, id: nextId(), createdAt: new Date() }] }
+            : s,
+        ),
+      );
+    },
+    [],
+  );
+
+  const selectedSession = sessions.find((s) => s.info.id === selectedSessionId) ?? null;
+
+  return {
+    connectionStatus,
+    sessions,
+    selectedSession,
+    selectedSessionId,
+    error,
+    createSession,
+    selectSession: setSelectedSessionId,
+    sendMessage,
+    terminateSession,
+    injectMessage,
+    renameSession,
+  };
+}