@ottocode/web-sdk 0.1.228 → 0.1.231

package/dist/hooks/index.js

@@ -924,6 +924,26 @@ function useUpdateDefaults() {
   const queryClient = useQueryClient();
   return useMutation({
     mutationFn: (data) => apiClient.updateDefaults(data),
+    onMutate: async (data) => {
+      await queryClient.cancelQueries({ queryKey: ["config"] });
+      const previousConfig = queryClient.getQueryData(["config"]);
+      if (previousConfig) {
+        const defaultUpdates = Object.fromEntries(Object.entries(data).filter(([key, value]) => key !== "scope" && value !== undefined));
+        queryClient.setQueryData(["config"], {
+          ...previousConfig,
+          defaults: {
+            ...previousConfig.defaults,
+            ...defaultUpdates
+          }
+        });
+      }
+      return { previousConfig };
+    },
+    onError: (_error, _data, context) => {
+      if (context?.previousConfig) {
+        queryClient.setQueryData(["config"], context.previousConfig);
+      }
+    },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: ["config"] });
     }
@@ -932,27 +952,27 @@ function useUpdateDefaults() {
 // src/hooks/usePreferences.ts
 import { useCallback, useMemo, useSyncExternalStore } from "react";
 var STORAGE_KEY = "otto-preferences";
-var DEFAULT_PREFERENCES = {
+var DEFAULT_STORED_PREFERENCES = {
   vimMode: false,
   compactThread: true
 };
 function resolveInitialPreferences() {
   if (typeof window === "undefined") {
-    return DEFAULT_PREFERENCES;
+    return DEFAULT_STORED_PREFERENCES;
   }
   try {
     const stored = window.localStorage.getItem(STORAGE_KEY);
     if (stored) {
       const parsed = JSON.parse(stored);
       return {
-        ...DEFAULT_PREFERENCES,
-        ...parsed
+        vimMode: typeof parsed.vimMode === "boolean" ? parsed.vimMode : DEFAULT_STORED_PREFERENCES.vimMode,
+        compactThread: typeof parsed.compactThread === "boolean" ? parsed.compactThread : DEFAULT_STORED_PREFERENCES.compactThread
       };
     }
   } catch (error) {
     console.warn("Failed to load preferences", error);
   }
-  return DEFAULT_PREFERENCES;
+  return DEFAULT_STORED_PREFERENCES;
 }
 var preferences = resolveInitialPreferences();
 var listeners = new Set;
@@ -960,7 +980,7 @@ function getSnapshot() {
   return preferences;
 }
 function getServerSnapshot() {
-  return DEFAULT_PREFERENCES;
+  return DEFAULT_STORED_PREFERENCES;
 }
 function subscribe(listener) {
   listeners.add(listener);
@@ -984,10 +1004,31 @@ function updateStore(updates) {
 }
 function usePreferences() {
   const currentPreferences = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+  const { data: config2 } = useConfig();
+  const updateDefaults = useUpdateDefaults();
   const updatePreferences = useCallback((updates) => {
-    updateStore(updates);
-  }, []);
-  return useMemo(() => ({ preferences: currentPreferences, updatePreferences }), [currentPreferences, updatePreferences]);
+    const localUpdates = {};
+    if (updates.vimMode !== undefined) {
+      localUpdates.vimMode = updates.vimMode;
+    }
+    if (updates.compactThread !== undefined) {
+      localUpdates.compactThread = updates.compactThread;
+    }
+    if (Object.keys(localUpdates).length > 0) {
+      updateStore(localUpdates);
+    }
+    if (updates.fullWidthContent !== undefined && updates.fullWidthContent !== config2?.defaults?.fullWidthContent) {
+      updateDefaults.mutate({
+        fullWidthContent: updates.fullWidthContent,
+        scope: "global"
+      });
+    }
+  }, [config2?.defaults?.fullWidthContent, updateDefaults]);
+  const resolvedPreferences = useMemo(() => ({
+    ...currentPreferences,
+    fullWidthContent: config2?.defaults?.fullWidthContent ?? false
+  }), [currentPreferences, config2?.defaults?.fullWidthContent]);
+  return useMemo(() => ({ preferences: resolvedPreferences, updatePreferences }), [resolvedPreferences, updatePreferences]);
 }
 // src/hooks/useFiles.ts
 import { useQuery as useQuery2 } from "@tanstack/react-query";
@@ -1633,7 +1674,8 @@ function useDeleteSession() {
 }
 
 // src/hooks/useMessages.ts
-function useMessages(sessionId) {
+function useMessages(sessionId, options = {}) {
+  const { enabled = true, staleTime = 15000 } = options;
   return useQuery4({
     queryKey: ["messages", sessionId],
     queryFn: () => {
@@ -1642,7 +1684,9 @@ function useMessages(sessionId) {
       }
       return apiClient.getMessages(sessionId);
     },
-    enabled: !!sessionId
+    enabled: !!sessionId && enabled,
+    staleTime,
+    refetchOnWindowFocus: false
   });
 }
 function useSendMessage(sessionId) {
@@ -1670,8 +1714,10 @@ class SSEClient {
     }
     this.abortController = new AbortController;
     this.running = true;
+    const isTunnel = !url.includes("localhost") && !url.includes("127.0.0.1");
     try {
       const response = await fetch(url, {
+        method: isTunnel ? "POST" : "GET",
         headers: { Accept: "text/event-stream" },
         signal: this.abortController.signal
       });
@@ -1787,11 +1833,10 @@ var useToolApprovalStore = create9((set) => ({
 }));
 
 // src/hooks/useSessionStream.ts
-function useSessionStream(sessionId) {
+function useSessionStream(sessionId, enabled = true) {
   const queryClient = useQueryClient5();
   const clientRef = useRef(null);
   const assistantMessageIdRef = useRef(null);
-  const lastInvalidationRef = useRef(0);
   const {
     addPendingApproval,
     removePendingApproval,
@@ -1799,8 +1844,7 @@ function useSessionStream(sessionId) {
     setPendingApprovals
   } = useToolApprovalStore();
   useEffect(() => {
-    if (!sessionId) {
-      console.log("[useSessionStream] No sessionId, skipping");
+    if (!sessionId || !enabled) {
       return;
     }
     assistantMessageIdRef.current = null;
@@ -1847,6 +1891,27 @@ function useSessionStream(sessionId) {
       }
       return "";
     };
+    const getToolEventCallId = (payload) => {
+      if (typeof payload?.callId === "string")
+        return payload.callId;
+      return typeof payload?.toolCallId === "string" ? payload.toolCallId : null;
+    };
+    const getToolEventName = (payload) => {
+      if (typeof payload?.name === "string")
+        return payload.name;
+      return typeof payload?.toolName === "string" ? payload.toolName : null;
+    };
+    const getToolEventArgs = (payload) => payload?.args ?? payload?.input;
+    const getToolInputDelta = (payload) => {
+      if (typeof payload?.delta === "string")
+        return payload.delta;
+      return typeof payload?.inputTextDelta === "string" ? payload.inputTextDelta : null;
+    };
+    const getToolOutputDelta = (payload) => {
+      if (typeof payload?.delta === "string")
+        return payload.delta;
+      return typeof payload?.outputTextDelta === "string" ? payload.outputTextDelta : null;
+    };
     const getOptimisticPartIndex = (parts, stepIndex) => {
       if (typeof stepIndex !== "number") {
         return parts.length;
@@ -1979,8 +2044,8 @@ function useSessionStream(sessionId) {
     const upsertEphemeralToolCall = (payload) => {
       if (!payload)
         return;
-      const callId = typeof payload.callId === "string" ? payload.callId : null;
-      const name = typeof payload.name === "string" ? payload.name : null;
+      const callId = getToolEventCallId(payload);
+      const name = getToolEventName(payload);
       if (!name)
         return;
       queryClient.setQueryData(["messages", sessionId], (oldMessages) => {
@@ -2004,7 +2069,7 @@ function useSessionStream(sessionId) {
         if (partIndex === -1 && !callId) {
           partIndex = parts.findIndex((part) => part.ephemeral && part.toolName === name);
         }
-        const args = payload.args;
+        const args = getToolEventArgs(payload);
         const stepIndex = typeof payload.stepIndex === "number" ? payload.stepIndex : null;
         const contentJsonBase = { name };
         if (callId)
@@ -2054,15 +2119,161 @@ function useSessionStream(sessionId) {
         return nextMessages;
       });
     };
+    const accumulateToolInputDelta = (payload, delta) => {
+      if (!payload)
+        return;
+      const callId = getToolEventCallId(payload);
+      const name = getToolEventName(payload);
+      if (!name)
+        return;
+      queryClient.setQueryData(["messages", sessionId], (oldMessages) => {
+        if (!oldMessages)
+          return oldMessages;
+        const nextMessages = [...oldMessages];
+        let targetIndex = resolveAssistantTargetIndex(nextMessages);
+        if (typeof payload.messageId === "string") {
+          const explicitIndex = nextMessages.findIndex((message) => message.id === payload.messageId);
+          if (explicitIndex !== -1)
+            targetIndex = explicitIndex;
+        }
+        if (targetIndex === -1)
+          return oldMessages;
+        const targetMessage = nextMessages[targetIndex];
+        const parts = targetMessage.parts ? [...targetMessage.parts] : [];
+        let partIndex = -1;
+        if (callId) {
+          partIndex = parts.findIndex((part) => part.toolCallId === callId && part.ephemeral);
+        }
+        if (partIndex === -1 && !callId) {
+          partIndex = parts.findIndex((part) => part.ephemeral && part.toolName === name);
+        }
+        const stepIndex = typeof payload.stepIndex === "number" ? payload.stepIndex : null;
+        if (partIndex === -1) {
+          const contentJsonBase = {
+            name,
+            _streamedInput: delta
+          };
+          if (callId)
+            contentJsonBase.callId = callId;
+          const newPart = {
+            id: callId ? `ephemeral-tool-call-${callId}` : `ephemeral-tool-call-${name}-${Date.now()}`,
+            messageId: targetMessage.id,
+            index: getOptimisticPartIndex(parts, stepIndex),
+            stepIndex,
+            type: "tool_call",
+            content: JSON.stringify(contentJsonBase),
+            contentJson: contentJsonBase,
+            agent: targetMessage.agent,
+            provider: targetMessage.provider,
+            model: targetMessage.model,
+            startedAt: Date.now(),
+            completedAt: null,
+            toolName: name,
+            toolCallId: callId,
+            toolDurationMs: null,
+            ephemeral: true
+          };
+          parts.push(newPart);
+        } else {
+          const existing = parts[partIndex];
+          const prev = typeof existing.contentJson?._streamedInput === "string" ? existing.contentJson._streamedInput : "";
+          const nextContentJson = {
+            ...typeof existing.contentJson === "object" && !Array.isArray(existing.contentJson) ? existing.contentJson : {},
+            _streamedInput: prev + delta
+          };
+          parts[partIndex] = {
+            ...existing,
+            content: JSON.stringify(nextContentJson),
+            contentJson: nextContentJson,
+            stepIndex: stepIndex ?? existing.stepIndex ?? null
+          };
+        }
+        nextMessages[targetIndex] = { ...targetMessage, parts };
+        return nextMessages;
+      });
+    };
+    const accumulateToolOutputDelta = (payload, delta) => {
+      if (!payload)
+        return;
+      const callId = getToolEventCallId(payload);
+      const name = getToolEventName(payload);
+      if (!name)
+        return;
+      queryClient.setQueryData(["messages", sessionId], (oldMessages) => {
+        if (!oldMessages)
+          return oldMessages;
+        const nextMessages = [...oldMessages];
+        let targetIndex = resolveAssistantTargetIndex(nextMessages);
+        if (typeof payload.messageId === "string") {
+          const explicitIndex = nextMessages.findIndex((message) => message.id === payload.messageId);
+          if (explicitIndex !== -1)
+            targetIndex = explicitIndex;
+        }
+        if (targetIndex === -1)
+          return oldMessages;
+        const targetMessage = nextMessages[targetIndex];
+        const parts = targetMessage.parts ? [...targetMessage.parts] : [];
+        let partIndex = -1;
+        if (callId) {
+          partIndex = parts.findIndex((part) => part.toolCallId === callId && part.ephemeral);
+        }
+        if (partIndex === -1 && !callId) {
+          partIndex = parts.findIndex((part) => part.ephemeral && part.toolName === name);
+        }
+        const stepIndex = typeof payload.stepIndex === "number" ? payload.stepIndex : null;
+        if (partIndex === -1) {
+          const contentJsonBase = {
+            name,
+            _streamedOutput: delta
+          };
+          if (callId)
+            contentJsonBase.callId = callId;
+          const newPart = {
+            id: callId ? `ephemeral-tool-call-${callId}` : `ephemeral-tool-call-${name}-${Date.now()}`,
+            messageId: targetMessage.id,
+            index: getOptimisticPartIndex(parts, stepIndex),
+            stepIndex,
+            type: "tool_call",
+            content: JSON.stringify(contentJsonBase),
+            contentJson: contentJsonBase,
+            agent: targetMessage.agent,
+            provider: targetMessage.provider,
+            model: targetMessage.model,
+            startedAt: Date.now(),
+            completedAt: null,
+            toolName: name,
+            toolCallId: callId,
+            toolDurationMs: null,
+            ephemeral: true
+          };
+          parts.push(newPart);
+        } else {
+          const existing = parts[partIndex];
+          const prev = typeof existing.contentJson?._streamedOutput === "string" ? existing.contentJson._streamedOutput : "";
+          const nextContentJson = {
+            ...typeof existing.contentJson === "object" && !Array.isArray(existing.contentJson) ? existing.contentJson : {},
+            _streamedOutput: prev + delta
+          };
+          parts[partIndex] = {
+            ...existing,
+            content: JSON.stringify(nextContentJson),
+            contentJson: nextContentJson,
+            stepIndex: stepIndex ?? existing.stepIndex ?? null
+          };
+        }
+        nextMessages[targetIndex] = { ...targetMessage, parts };
+        return nextMessages;
+      });
+    };
     const resolveEphemeralToolCall = (payload) => {
-      const callId = typeof payload?.callId === "string" ? payload.callId : null;
+      const callId = getToolEventCallId(payload);
       if (!callId)
         return;
-      const payloadName = typeof payload?.name === "string" ? payload.name : null;
+      const payloadName = getToolEventName(payload);
       const payloadStepIndex = typeof payload?.stepIndex === "number" ? payload.stepIndex : null;
       const payloadResult = payload?.result;
       const payloadArtifact = payload?.artifact;
-      const payloadArgs = payload?.args;
+      const payloadArgs = getToolEventArgs(payload);
       queryClient.setQueryData(["messages", sessionId], (oldMessages) => {
         if (!oldMessages)
           return oldMessages;
@@ -2110,7 +2321,7 @@ function useSessionStream(sessionId) {
       });
     };
     const removeEphemeralToolCall = (payload) => {
-      const callId = typeof payload?.callId === "string" ? payload.callId : null;
+      const callId = getToolEventCallId(payload);
       if (!callId)
         return;
       queryClient.setQueryData(["messages", sessionId], (oldMessages) => {
@@ -2169,20 +2380,6 @@ function useSessionStream(sessionId) {
         return nextMessages;
       });
     };
-    const throttledInvalidate = () => {
-      const now = Date.now();
-      if (now - lastInvalidationRef.current < 500) {
-        return;
-      }
-      lastInvalidationRef.current = now;
-      queryClient.invalidateQueries({ queryKey: ["messages", sessionId] });
-    };
-    const invalidatingEvents = new Set([
-      "message.completed",
-      "message.updated",
-      "finish-step",
-      "error"
-    ]);
     const unsubscribe = client2.on("*", (event) => {
       const payload = event.payload;
       switch (event.type) {
@@ -2196,6 +2393,26 @@ function useSessionStream(sessionId) {
             const agent = typeof payload?.agent === "string" ? payload.agent : "";
             const provider = typeof payload?.provider === "string" ? payload.provider : "";
             const model = typeof payload?.model === "string" ? payload.model : "";
+            const content = typeof payload?.content === "string" ? payload.content : null;
+            const userParts = role === "user" && content ? [
+              {
+                id: `${id}-text`,
+                messageId: id,
+                index: 0,
+                stepIndex: null,
+                type: "text",
+                content: JSON.stringify({ text: content }),
+                contentJson: { text: content },
+                agent,
+                provider,
+                model,
+                startedAt: Date.now(),
+                completedAt: Date.now(),
+                toolName: null,
+                toolCallId: null,
+                toolDurationMs: null
+              }
+            ] : [];
             queryClient.setQueryData(["messages", sessionId], (oldMessages) => {
               if (!oldMessages)
                 return oldMessages;
@@ -2205,7 +2422,7 @@ function useSessionStream(sessionId) {
                 id,
                 sessionId,
                 role,
-                status: "pending",
+                status: role === "user" ? "complete" : "pending",
                 agent,
                 provider,
                 model,
@@ -2216,13 +2433,12 @@ function useSessionStream(sessionId) {
                 completionTokens: null,
                 totalTokens: null,
                 error: null,
-                parts: []
+                parts: userParts
               };
               const next = [...oldMessages, newMessage];
               next.sort((a, b) => a.createdAt - b.createdAt);
               return next;
             });
-            throttledInvalidate();
           }
           break;
         }
@@ -2241,13 +2457,21 @@ function useSessionStream(sessionId) {
           }
           markMessageCompleted(payload);
           clearEphemeralForMessage(id);
+          queryClient.invalidateQueries({ queryKey: ["messages", sessionId] });
           queryClient.invalidateQueries({ queryKey: sessionsQueryKey });
           break;
         }
         case "tool.delta": {
           const channel = typeof payload?.channel === "string" ? payload.channel : null;
-          if (channel === "input") {
-            upsertEphemeralToolCall(payload);
+          const delta = channel === "output" ? getToolOutputDelta(payload) : getToolInputDelta(payload);
+          if (channel === "input" || channel == null && delta) {
+            if (delta) {
+              accumulateToolInputDelta(payload, delta);
+            } else {
+              upsertEphemeralToolCall(payload);
+            }
+          } else if (channel === "output" && delta) {
+            accumulateToolOutputDelta(payload, delta);
           }
           break;
         }
@@ -2296,6 +2520,7 @@ function useSessionStream(sessionId) {
           if (messageId) {
             clearEphemeralForMessage(messageId);
           }
+          queryClient.invalidateQueries({ queryKey: ["messages", sessionId] });
           break;
         }
         case "message.updated": {
@@ -2330,9 +2555,6 @@ function useSessionStream(sessionId) {
         default:
           break;
       }
-      if (invalidatingEvents.has(event.type)) {
-        throttledInvalidate();
-      }
       if (event.type === "finish-step") {
         const now = Date.now();
         if (now - lastSessionInvalidation >= 2000) {
@@ -2350,6 +2572,7 @@ function useSessionStream(sessionId) {
     queryClient,
     addPendingApproval,
     removePendingApproval,
+    enabled,
     setPendingApprovals,
     updatePendingApproval
   ]);
@@ -3240,13 +3463,13 @@ function useFileUpload(options = {}) {
 }
 // src/hooks/useSessionFiles.ts
 import { useQuery as useQuery5 } from "@tanstack/react-query";
-function useSessionFiles(sessionId) {
+function useSessionFiles(sessionId, enabled = true) {
   const isExpanded = useSessionFilesStore((state) => state.isExpanded);
   return useQuery5({
     queryKey: ["session", sessionId, "files"],
     queryFn: () => sessionId ? apiClient.getSessionFiles(sessionId) : null,
-    enabled: !!sessionId,
-    refetchInterval: isExpanded ? 5000 : false,
+    enabled: !!sessionId && enabled,
+    refetchInterval: isExpanded && enabled ? 5000 : false,
     retry: 1,
     staleTime: 3000
   });
@@ -3438,11 +3661,11 @@ class ResearchApiClient {
   }
 }
 var researchApi = new ResearchApiClient;
-function useResearchSessions(parentSessionId) {
+function useResearchSessions(parentSessionId, enabled = true) {
   return useQuery8({
     queryKey: ["research", "sessions", parentSessionId],
     queryFn: () => researchApi.listResearchSessions(parentSessionId),
-    enabled: !!parentSessionId,
+    enabled: !!parentSessionId && enabled,
     staleTime: 30000
   });
 }
@@ -4395,7 +4618,7 @@ function useTunnelStream() {
   return { connect };
 }
 // src/hooks/useProviderUsage.ts
-import { useEffect as useEffect13, useCallback as useCallback10 } from "react";
+import { useEffect as useEffect13, useCallback as useCallback10, useRef as useRef6 } from "react";
 
 // src/stores/usageStore.ts
 import { create as create18 } from "zustand";
@@ -4415,16 +4638,22 @@ var useUsageStore = create18((set) => ({
 // src/hooks/useProviderUsage.ts
 var POLL_INTERVAL = 60000;
 var STALE_THRESHOLD = 30000;
+var inflight = new Set;
 function useProviderUsage(provider, authType) {
   const setUsage = useUsageStore((s) => s.setUsage);
   const setLoading = useUsageStore((s) => s.setLoading);
   const setLastFetched = useUsageStore((s) => s.setLastFetched);
   const usage = useUsageStore((s) => provider ? s.usage[provider] : undefined);
-  const lastFetched = useUsageStore((s) => provider ? s.lastFetched[provider] : 0);
   const isOAuthProvider = authType === "oauth" && (provider === "anthropic" || provider === "openai");
   const fetchUsage = useCallback10(async () => {
     if (!provider || !isOAuthProvider)
       return;
+    if (inflight.has(provider))
+      return;
+    const last = useUsageStore.getState().lastFetched[provider] ?? 0;
+    if (last && Date.now() - last < STALE_THRESHOLD)
+      return;
+    inflight.add(provider);
     setLoading(provider, true);
     try {
       const data = await apiClient.getProviderUsage(provider);
@@ -4432,18 +4661,18 @@ function useProviderUsage(provider, authType) {
       setLastFetched(provider, Date.now());
     } catch {} finally {
       setLoading(provider, false);
+      inflight.delete(provider);
     }
   }, [provider, isOAuthProvider, setUsage, setLoading, setLastFetched]);
+  const fetchRef = useRef6(fetchUsage);
+  fetchRef.current = fetchUsage;
   useEffect13(() => {
     if (!isOAuthProvider)
       return;
-    const isStale = !lastFetched || Date.now() - lastFetched > STALE_THRESHOLD;
-    if (isStale) {
-      fetchUsage();
-    }
-    const interval = setInterval(fetchUsage, POLL_INTERVAL);
+    fetchRef.current();
+    const interval = setInterval(() => fetchRef.current(), POLL_INTERVAL);
     return () => clearInterval(interval);
-  }, [isOAuthProvider, fetchUsage, lastFetched]);
+  }, [isOAuthProvider, provider]);
   return {
     usage,
     fetchUsage,
@@ -4481,7 +4710,7 @@ function useGitDiffFullFile(file, staged = false, enabled = false) {
 }
 // src/hooks/useMCP.ts
 import { useQuery as useQuery12, useMutation as useMutation8, useQueryClient as useQueryClient10 } from "@tanstack/react-query";
-import { useEffect as useEffect14, useRef as useRef6, useCallback as useCallback11 } from "react";
+import { useEffect as useEffect14, useRef as useRef7, useCallback as useCallback11 } from "react";
 import {
   listMcpServers,
   startMcpServer,
@@ -4647,7 +4876,7 @@ function useCopilotDevicePoller() {
   const setCopilotDevice = useMCPStore((s) => s.setCopilotDevice);
   const setLoading = useMCPStore((s) => s.setLoading);
   const queryClient = useQueryClient10();
-  const timerRef = useRef6(null);
+  const timerRef = useRef7(null);
   const stopPolling = useCallback11(() => {
     if (timerRef.current) {
       clearInterval(timerRef.current);
@@ -4818,4 +5047,4 @@ export {
   sessionsQueryKey
 };
 
-//# debugId=381FB663C2D4B88E64756E2164756E21
+//# debugId=E3072251705A9AC764756E2164756E21