@ottocode/web-sdk 0.1.267 → 0.1.268

package/dist/hooks/index.js

@@ -2656,8 +2656,229 @@ function useSessionStream(sessionId, enabled = true) {
     updatePendingApproval
   ]);
 }
+// src/hooks/useClientEvents.ts
+import { useEffect as useEffect2, useRef as useRef2 } from "react";
+import { useQueryClient as useQueryClient6 } from "@tanstack/react-query";
+import {
+  buildClientEventsStreamUrl,
+  createClientEventsStream
+} from "@ottocode/api";
+
+// src/stores/toastStore.ts
+import { create as create10 } from "zustand";
+var toastId = 0;
+var useToastStore = create10((set) => ({
+  toasts: [],
+  addToast: (toast) => {
+    const id = `toast-${++toastId}`;
+    set((state) => ({
+      toasts: [...state.toasts, { ...toast, id }]
+    }));
+    return id;
+  },
+  removeToast: (id) => set((state) => ({
+    toasts: state.toasts.filter((t) => t.id !== id)
+  })),
+  updateToast: (id, updates) => set((state) => ({
+    toasts: state.toasts.map((t) => t.id === id ? { ...t, ...updates } : t)
+  })),
+  clearToasts: () => set({ toasts: [] })
+}));
+function toast(message, type = "default", duration = 4000) {
+  const id = useToastStore.getState().addToast({ message, type, duration });
+  if (duration > 0) {
+    setTimeout(() => {
+      useToastStore.getState().removeToast(id);
+    }, duration);
+  }
+  return id;
+}
+toast.success = (message, duration = 4000) => toast(message, "success", duration);
+toast.error = (message, duration = 5000) => toast(message, "error", duration);
+toast.info = (message, duration = 4000) => toast(message, "default", duration);
+toast.loading = (message) => toast(message, "loading", 0);
+toast.successWithAction = (message, action, duration = 6000) => {
+  const id = useToastStore.getState().addToast({
+    message,
+    type: "success",
+    duration,
+    action
+  });
+  if (duration > 0) {
+    setTimeout(() => {
+      useToastStore.getState().removeToast(id);
+    }, duration);
+  }
+  return id;
+};
+
+// src/hooks/useClientEvents.ts
+function toastTypeForLevel(level) {
+  if (level === "success")
+    return "success";
+  if (level === "error")
+    return "error";
+  return "default";
+}
+function showInAppNotification(notification) {
+  const message = notification.body ? `${notification.title}: ${notification.body}` : notification.title;
+  if (notification.action) {
+    const id = toast(message, toastTypeForLevel(notification.level), 6000);
+    useToastStore.getState().updateToast(id, { action: notification.action });
+    return;
+  }
+  toast(message, toastTypeForLevel(notification.level), 5000);
+}
+function sendBrowserNotification(notification) {
+  if (typeof window === "undefined")
+    return;
+  if (window.parent && window.parent !== window) {
+    const message = {
+      type: "otto-notification",
+      notification
+    };
+    window.parent.postMessage(message, "*");
+    return;
+  }
+  if (!("Notification" in window) || Notification.permission !== "granted")
+    return;
+  const browserNotification = new Notification(notification.title, {
+    body: notification.body,
+    tag: notification.id
+  });
+  browserNotification.onclick = () => {
+    window.focus();
+    if (notification.sessionId) {
+      window.location.href = `/sessions/${notification.sessionId}`;
+    }
+    browserNotification.close();
+  };
+}
+function updateSessionStatusInCache(queryClient, status) {
+  queryClient.setQueryData(sessionsQueryKey, (old) => {
+    if (!old)
+      return old;
+    return {
+      ...old,
+      pages: old.pages.map((page) => ({
+        ...page,
+        items: page.items.map((session) => session.id === status.sessionId ? {
+          ...session,
+          isRunning: status.status === "running"
+        } : session)
+      }))
+    };
+  });
+}
+function isLocalApiUrl(baseUrl) {
+  try {
+    const { hostname } = new URL(baseUrl);
+    return hostname === "localhost" || hostname === "127.0.0.1" || hostname.startsWith("192.168.") || hostname.startsWith("10.") || /^172\.(1[6-9]|2\d|3[01])\./.test(hostname);
+  } catch {
+    return false;
+  }
+}
+async function requestLocalhostAccess(baseUrl) {
+  const response = await fetch(new URL("/openapi.json", baseUrl), {
+    cache: "no-store",
+    credentials: "include"
+  });
+  if (!response.ok) {
+    throw new Error(`Local API returned ${response.status}`);
+  }
+}
+function useClientEvents(activeSessionId) {
+  const queryClient = useQueryClient6();
+  const activeSessionIdRef = useRef2(activeSessionId);
+  useEffect2(() => {
+    activeSessionIdRef.current = activeSessionId;
+  }, [activeSessionId]);
+  useEffect2(() => {
+    if (typeof window === "undefined" || window.parent !== window)
+      return;
+    if (!("Notification" in window))
+      return;
+    if (Notification.permission !== "default")
+      return;
+    if (window.localStorage.getItem("otto-notification-permission-prompted")) {
+      return;
+    }
+    window.localStorage.setItem("otto-notification-permission-prompted", "1");
+    const id = toast("Enable browser notifications for background session updates.", "default", 0);
+    useToastStore.getState().updateToast(id, {
+      action: {
+        label: "Enable",
+        onClick: async () => {
+          const permission = await Notification.requestPermission();
+          if (permission === "granted") {
+            toast.success("Browser notifications enabled.");
+          } else {
+            toast.info("Browser notifications were not enabled.");
+          }
+        }
+      }
+    });
+  }, []);
+  useEffect2(() => {
+    const controller = new AbortController;
+    let hasShownLocalAccessToast = false;
+    const baseUrl = getBaseUrl();
+    createClientEventsStream({
+      baseUrl,
+      onEvent: (event) => {
+        if (event.event === "heartbeat")
+          return;
+        let payload;
+        try {
+          payload = JSON.parse(event.data);
+        } catch (error) {
+          console.error("[client-events] Failed to parse event:", error);
+          return;
+        }
+        if (event.event === "session.status") {
+          const status = payload;
+          updateSessionStatusInCache(queryClient, status);
+          if (status.status !== "running") {
+            queryClient.invalidateQueries({
+              queryKey: sessionsQueryKey
+            });
+          }
+          return;
+        }
+        if (event.event === "notification") {
+          const notification = payload;
+          showInAppNotification(notification);
+          const isActiveVisibleSession = notification.sessionId === activeSessionIdRef.current && document.visibilityState === "visible";
+          if (!isActiveVisibleSession) {
+            sendBrowserNotification(notification);
+          }
+        }
+      },
+      onError: (error) => {
+        if (!controller.signal.aborted) {
+          console.error("[client-events] Stream error:", error);
+          if (!hasShownLocalAccessToast && isLocalApiUrl(baseUrl)) {
+            hasShownLocalAccessToast = true;
+            const id = toast("Safari may need permission to access the local otto server.", "default", 0);
+            useToastStore.getState().updateToast(id, {
+              action: {
+                label: "Allow access",
+                onClick: async () => {
+                  await requestLocalhostAccess(baseUrl);
+                  toast.success("Local otto server access confirmed.");
+                }
+              }
+            });
+          }
+        }
+      }
+    }, controller.signal);
+    return () => controller.abort();
+  }, [queryClient]);
+  return buildClientEventsStreamUrl({ baseUrl: getBaseUrl() });
+}
 // src/hooks/useTheme.ts
-import { useEffect as useEffect2, useState, useCallback as useCallback2, useMemo as useMemo3 } from "react";
+import { useEffect as useEffect3, useState, useCallback as useCallback2, useMemo as useMemo3 } from "react";
 var STORAGE_KEY2 = "otto-theme";
 function resolveInitialTheme() {
   if (typeof window === "undefined") {
@@ -2674,7 +2895,7 @@ function resolveInitialTheme() {
 }
 function useTheme() {
   const [theme, setTheme] = useState(() => resolveInitialTheme());
-  useEffect2(() => {
+  useEffect3(() => {
     if (typeof document === "undefined")
       return;
     const root = document.documentElement;
@@ -2692,7 +2913,7 @@ function useTheme() {
       window.parent.postMessage({ type: "otto-set-theme", theme }, "*");
     }
   }, [theme]);
-  useEffect2(() => {
+  useEffect3(() => {
     if (typeof window === "undefined")
       return;
     const handler = (e) => {
@@ -2709,11 +2930,11 @@ function useTheme() {
   return useMemo3(() => ({ theme, setTheme, toggleTheme }), [theme, toggleTheme]);
 }
 // src/hooks/useWorkingDirectory.ts
-import { useEffect as useEffect3, useState as useState2 } from "react";
+import { useEffect as useEffect4, useState as useState2 } from "react";
 import { getCwd } from "@ottocode/api";
 function useWorkingDirectory() {
   const [dirName, setDirName] = useState2(null);
-  useEffect3(() => {
+  useEffect4(() => {
     const fetchWorkingDirectory = async () => {
       try {
         const response = await getCwd({ baseURL: getBaseUrl() });
@@ -2737,11 +2958,11 @@ function useWorkingDirectory() {
   return dirName;
 }
 // src/hooks/useKeyboardShortcuts.ts
-import { useEffect as useEffect4, useCallback as useCallback3 } from "react";
+import { useEffect as useEffect5, useCallback as useCallback3 } from "react";
 
 // src/stores/focusStore.ts
-import { create as create10 } from "zustand";
-var useFocusStore = create10((set) => ({
+import { create as create11 } from "zustand";
+var useFocusStore = create11((set) => ({
   currentFocus: null,
   sessionIndex: 0,
   gitFileIndex: 0,
@@ -2753,9 +2974,9 @@ var useFocusStore = create10((set) => ({
 }));
 
 // src/stores/sidebarStore.ts
-import { create as create11 } from "zustand";
+import { create as create12 } from "zustand";
 import { persist } from "zustand/middleware";
-var useSidebarStore = create11()(persist((set) => ({
+var useSidebarStore = create12()(persist((set) => ({
   isCollapsed: false,
   toggleCollapse: () => set((state) => ({ isCollapsed: !state.isCollapsed })),
   setCollapsed: (collapsed) => set({ isCollapsed: collapsed })
@@ -2764,8 +2985,8 @@ var useSidebarStore = create11()(persist((set) => ({
 }));
 
 // src/stores/filePickerStore.ts
-import { create as create12 } from "zustand";
-var useFilePickerStore = create12((set) => ({
+import { create as create13 } from "zustand";
+var useFilePickerStore = create13((set) => ({
   isOpen: false,
   open: () => set({ isOpen: true }),
   close: () => set({ isOpen: false }),
@@ -3004,7 +3225,7 @@ function useKeyboardShortcuts({
     onReturnToInput,
     closeDiff
   ]);
-  useEffect4(() => {
+  useEffect5(() => {
     window.addEventListener("keydown", handleKeyDown);
     return () => window.removeEventListener("keydown", handleKeyDown);
   }, [handleKeyDown]);
@@ -3018,7 +3239,7 @@ function useKeyboardShortcuts({
 import {
   useState as useState3,
   useCallback as useCallback4,
-  useEffect as useEffect5
+  useEffect as useEffect6
 } from "react";
 var SUPPORTED_TYPES = ["image/png", "image/jpeg", "image/gif", "image/webp"];
 function generateId() {
@@ -3154,7 +3375,7 @@ function useImageUpload(options = {}) {
       addImages(imageFiles);
     }
   }, [addImages]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!pageWide)
       return;
     let dragCounter = 0;
@@ -3218,7 +3439,7 @@ function useImageUpload(options = {}) {
 import {
   useState as useState4,
   useCallback as useCallback5,
-  useEffect as useEffect6
+  useEffect as useEffect7
 } from "react";
 var IMAGE_TYPES = ["image/png", "image/jpeg", "image/gif", "image/webp"];
 var PDF_TYPES = ["application/pdf"];
@@ -3475,7 +3696,7 @@ function useFileUpload(options = {}) {
       addFiles(pastedFiles);
     }
   }, [addFiles]);
-  useEffect6(() => {
+  useEffect7(() => {
     if (!pageWide)
       return;
     let dragCounter = 0;
@@ -3581,9 +3802,9 @@ function useMessageQueuePosition(sessionId, messageId) {
   return { isQueued: false, isRunning: false, position: null };
 }
 // src/hooks/useBranch.ts
-import { useQuery as useQuery7, useMutation as useMutation5, useQueryClient as useQueryClient6 } from "@tanstack/react-query";
+import { useQuery as useQuery7, useMutation as useMutation5, useQueryClient as useQueryClient7 } from "@tanstack/react-query";
 function useCreateBranch(sessionId) {
-  const queryClient = useQueryClient6();
+  const queryClient = useQueryClient7();
   return useMutation5({
     mutationFn: (data) => {
       if (!sessionId)
@@ -3623,7 +3844,7 @@ function useParentSession(sessionId) {
   });
 }
 // src/hooks/useResearch.ts
-import { useQuery as useQuery8, useMutation as useMutation6, useQueryClient as useQueryClient7 } from "@tanstack/react-query";
+import { useQuery as useQuery8, useMutation as useMutation6, useQueryClient as useQueryClient8 } from "@tanstack/react-query";
 import {
   createResearchSession as apiCreateResearchSession,
   deleteResearchSession as apiDeleteResearchSession,
@@ -3633,8 +3854,8 @@ import {
 } from "@ottocode/api";
 
 // src/stores/pendingResearchStore.ts
-import { create as create13 } from "zustand";
-var usePendingResearchStore = create13((set, get) => ({
+import { create as create14 } from "zustand";
+var usePendingResearchStore = create14((set, get) => ({
   pendingContexts: new Map,
   addContext: (parentSessionId, context) => {
     set((state) => {
@@ -3727,7 +3948,7 @@ function useResearchSessions(parentSessionId, enabled = true) {
   });
 }
 function useCreateResearchSession() {
-  const queryClient = useQueryClient7();
+  const queryClient = useQueryClient8();
   return useMutation6({
     mutationFn: ({
       parentSessionId,
@@ -3741,7 +3962,7 @@ function useCreateResearchSession() {
   });
 }
 function useDeleteResearchSession() {
-  const queryClient = useQueryClient7();
+  const queryClient = useQueryClient8();
   return useMutation6({
     mutationFn: (researchId) => researchApi.deleteResearchSession(researchId),
     onSuccess: () => {
@@ -3768,7 +3989,7 @@ function useInjectContext() {
   });
 }
 function useExportToSession() {
-  const queryClient = useQueryClient7();
+  const queryClient = useQueryClient8();
   return useMutation6({
     mutationFn: ({
       researchId,
@@ -3780,55 +4001,7 @@ function useExportToSession() {
   });
 }
 // src/hooks/useSetuPayments.ts
-import { useEffect as useEffect7, useRef as useRef2 } from "react";
-
-// src/stores/toastStore.ts
-import { create as create14 } from "zustand";
-var toastId = 0;
-var useToastStore = create14((set) => ({
-  toasts: [],
-  addToast: (toast) => {
-    const id = `toast-${++toastId}`;
-    set((state) => ({
-      toasts: [...state.toasts, { ...toast, id }]
-    }));
-    return id;
-  },
-  removeToast: (id) => set((state) => ({
-    toasts: state.toasts.filter((t) => t.id !== id)
-  })),
-  updateToast: (id, updates) => set((state) => ({
-    toasts: state.toasts.map((t) => t.id === id ? { ...t, ...updates } : t)
-  })),
-  clearToasts: () => set({ toasts: [] })
-}));
-function toast(message, type = "default", duration = 4000) {
-  const id = useToastStore.getState().addToast({ message, type, duration });
-  if (duration > 0) {
-    setTimeout(() => {
-      useToastStore.getState().removeToast(id);
-    }, duration);
-  }
-  return id;
-}
-toast.success = (message, duration = 4000) => toast(message, "success", duration);
-toast.error = (message, duration = 5000) => toast(message, "error", duration);
-toast.info = (message, duration = 4000) => toast(message, "default", duration);
-toast.loading = (message) => toast(message, "loading", 0);
-toast.successWithAction = (message, action, duration = 6000) => {
-  const id = useToastStore.getState().addToast({
-    message,
-    type: "success",
-    duration,
-    action
-  });
-  if (duration > 0) {
-    setTimeout(() => {
-      useToastStore.getState().removeToast(id);
-    }, duration);
-  }
-  return id;
-};
+import { useEffect as useEffect8, useRef as useRef3 } from "react";
 
 // src/stores/ottorouterStore.ts
 import { create as create15 } from "zustand";
@@ -3874,15 +4047,15 @@ var useTopupApprovalStore = create16((set) => ({
 
 // src/hooks/useSetuPayments.ts
 function useSetuPayments(sessionId) {
-  const clientRef = useRef2(null);
-  const loadingToastIdRef = useRef2(null);
+  const clientRef = useRef3(null);
+  const loadingToastIdRef = useRef3(null);
   const setBalance = useOttoRouterStore((s) => s.setBalance);
   const setPaymentPending = useOttoRouterStore((s) => s.setPaymentPending);
   const removeToast = useToastStore((s) => s.removeToast);
   const updateToast = useToastStore((s) => s.updateToast);
   const setPendingTopup = useTopupApprovalStore((s) => s.setPendingTopup);
   const clearPendingTopup = useTopupApprovalStore((s) => s.clearPendingTopup);
-  useEffect7(() => {
+  useEffect8(() => {
     if (!sessionId)
       return;
     const client2 = new SSEClient;
@@ -4012,7 +4185,7 @@ function useSetuPayments(sessionId) {
   ]);
 }
 // src/hooks/useOttoRouterBalance.ts
-import { useEffect as useEffect8, useCallback as useCallback6 } from "react";
+import { useEffect as useEffect9, useCallback as useCallback6 } from "react";
 
 // src/stores/usageStore.ts
 import { create as create17 } from "zustand";
@@ -4106,7 +4279,7 @@ function useOttoRouterBalance(providerName) {
     setUsage
   ]);
   const needsUsageWindows = subscription?.active && !subscription.usageWindows;
-  useEffect8(() => {
+  useEffect9(() => {
     if (providerName === "ottorouter" && (balance === null || usdcBalance === null || needsUsageWindows)) {
       fetchBalance();
     }
@@ -4127,7 +4300,7 @@ function useShareStatus(sessionId) {
   return { data, isLoading, error };
 }
 // src/hooks/useToolApprovalShortcuts.ts
-import { useEffect as useEffect9, useCallback as useCallback7 } from "react";
+import { useEffect as useEffect10, useCallback as useCallback7 } from "react";
 function useToolApprovalShortcuts(sessionId) {
   const { pendingApprovals, removePendingApproval } = useToolApprovalStore();
   const sessionPendingApprovals = pendingApprovals;
@@ -4163,7 +4336,7 @@ function useToolApprovalShortcuts(sessionId) {
       console.error("Failed to approve all tool calls:", error);
     }
   }, [sessionId, sessionPendingApprovals, removePendingApproval]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (!sessionId || sessionPendingApprovals.length === 0)
       return;
     const handleKeyDown = (e) => {
@@ -4193,14 +4366,14 @@ function useToolApprovalShortcuts(sessionId) {
   ]);
 }
 // src/hooks/useTopupCallback.ts
-import { useEffect as useEffect10, useRef as useRef3 } from "react";
+import { useEffect as useEffect11, useRef as useRef4 } from "react";
 var STORAGE_KEY3 = "pendingPolarCheckout";
 function useTopupCallback() {
-  const hasHandled = useRef3(false);
-  const loadingToastId = useRef3(null);
+  const hasHandled = useRef4(false);
+  const loadingToastId = useRef4(null);
   const setBalance = useOttoRouterStore((s) => s.setBalance);
   const removeToast = useToastStore((s) => s.removeToast);
-  useEffect10(() => {
+  useEffect11(() => {
     if (hasHandled.current)
       return;
     const params = new URLSearchParams(window.location.search);
@@ -4261,8 +4434,8 @@ function useTopupCallback() {
   }, [setBalance, removeToast]);
 }
 // src/hooks/useAuthStatus.ts
-import { useEffect as useEffect11, useCallback as useCallback8, useState as useState5, useRef as useRef4 } from "react";
-import { useQueryClient as useQueryClient8 } from "@tanstack/react-query";
+import { useEffect as useEffect12, useCallback as useCallback8, useState as useState5, useRef as useRef5 } from "react";
+import { useQueryClient as useQueryClient9 } from "@tanstack/react-query";
 
 // src/stores/onboardingStore.ts
 import { create as create18 } from "zustand";
@@ -4312,11 +4485,11 @@ function useAuthStatus() {
   const setError = useOnboardingStore((s) => s.setError);
   const authStatus = useOnboardingStore((s) => s.authStatus);
   const isOpen = useOnboardingStore((s) => s.isOpen);
-  const queryClient = useQueryClient8();
+  const queryClient = useQueryClient9();
   const [initialized, setInitialized] = useState5(false);
   const [oauthPolling, setOauthPolling] = useState5(false);
-  const oauthPollingRef = useRef4(null);
-  const preOauthProvidersRef = useRef4(new Set);
+  const oauthPollingRef = useRef5(null);
+  const preOauthProvidersRef = useRef5(new Set);
   const fetchAuthStatus = useCallback8(async () => {
     setLoading(true);
     setError(null);
@@ -4496,7 +4669,7 @@ function useAuthStatus() {
       setLoading(false);
     }
   }, [fetchAuthStatus, setLoading, setError]);
-  useEffect11(() => {
+  useEffect12(() => {
     if (!oauthPolling || !isInIframe)
       return;
     oauthPollingRef.current = setInterval(() => {
@@ -4510,7 +4683,7 @@ function useAuthStatus() {
       clearTimeout(timeout);
     };
   }, [oauthPolling, fetchAuthStatus]);
-  useEffect11(() => {
+  useEffect12(() => {
     if (!oauthPolling || !authStatus)
       return;
     const currentConfigured = Object.entries(authStatus.providers).filter(([, p]) => p.configured);
@@ -4519,7 +4692,7 @@ function useAuthStatus() {
       setOauthPolling(false);
     }
   }, [authStatus, oauthPolling]);
-  useEffect11(() => {
+  useEffect12(() => {
     const handleOAuthMessage = (event) => {
       if (event.data?.type === "oauth-success") {
         fetchAuthStatus();
@@ -4589,8 +4762,8 @@ function useAuthStatus() {
   };
 }
 // src/hooks/useTunnel.ts
-import { useQuery as useQuery10, useMutation as useMutation7, useQueryClient as useQueryClient9 } from "@tanstack/react-query";
-import { useEffect as useEffect12, useCallback as useCallback9, useRef as useRef5 } from "react";
+import { useQuery as useQuery10, useMutation as useMutation7, useQueryClient as useQueryClient10 } from "@tanstack/react-query";
+import { useEffect as useEffect13, useCallback as useCallback9, useRef as useRef6 } from "react";
 import {
   client as client2,
   getTunnelQr,
@@ -4633,7 +4806,7 @@ function useTunnelStatus() {
     queryFn: fetchTunnelStatus,
     refetchInterval: 3000
   });
-  useEffect12(() => {
+  useEffect13(() => {
     if (query.data) {
       setStatus(query.data.status);
       setUrl(query.data.url);
@@ -4643,7 +4816,7 @@ function useTunnelStatus() {
   return query;
 }
 function useStartTunnel() {
-  const queryClient = useQueryClient9();
+  const queryClient = useQueryClient10();
   const setStatus = useTunnelStore((s) => s.setStatus);
   const setUrl = useTunnelStore((s) => s.setUrl);
   const setError = useTunnelStore((s) => s.setError);
@@ -4675,7 +4848,7 @@ function useStartTunnel() {
   });
 }
 function useStopTunnel() {
-  const queryClient = useQueryClient9();
+  const queryClient = useQueryClient10();
   const reset = useTunnelStore((s) => s.reset);
   return useMutation7({
     mutationFn: stopTunnel,
@@ -4693,7 +4866,7 @@ function useTunnelQr() {
     queryFn: fetchTunnelQr,
     enabled: !!url
   });
-  useEffect12(() => {
+  useEffect13(() => {
     if (query.data?.ok && query.data.qrCode) {
       setQrCode(query.data.qrCode);
     }
@@ -4706,7 +4879,7 @@ function useTunnelStream() {
   const setError = useTunnelStore((s) => s.setError);
   const setProgress = useTunnelStore((s) => s.setProgress);
   const isExpanded = useTunnelStore((s) => s.isExpanded);
-  const eventSourceRef = useRef5(null);
+  const eventSourceRef = useRef6(null);
   const connect = useCallback9(() => {
     if (eventSourceRef.current) {
       eventSourceRef.current.close();
@@ -4733,7 +4906,7 @@ function useTunnelStream() {
       eventSourceRef.current = null;
     };
   }, [setStatus, setUrl, setError, setProgress]);
-  useEffect12(() => {
+  useEffect13(() => {
     if (isExpanded) {
       const cleanup = connect();
       return cleanup;
@@ -4748,7 +4921,7 @@ function useTunnelStream() {
   return { connect };
 }
 // src/hooks/useProviderUsage.ts
-import { useEffect as useEffect13, useCallback as useCallback10, useRef as useRef6 } from "react";
+import { useEffect as useEffect14, useCallback as useCallback10, useRef as useRef7 } from "react";
 var POLL_INTERVAL = 60000;
 var STALE_THRESHOLD = 30000;
 var inflight = new Set;
@@ -4777,9 +4950,9 @@ function useProviderUsage(provider, authType) {
       inflight.delete(provider);
     }
   }, [provider, isOAuthProvider, setUsage, setLoading, setLastFetched]);
-  const fetchRef = useRef6(fetchUsage);
+  const fetchRef = useRef7(fetchUsage);
   fetchRef.current = fetchUsage;
-  useEffect13(() => {
+  useEffect14(() => {
     if (!provider || !isOAuthProvider)
       return;
     fetchRef.current();
@@ -4822,8 +4995,8 @@ 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 useRef7, useCallback as useCallback11 } from "react";
+import { useQuery as useQuery12, useMutation as useMutation8, useQueryClient as useQueryClient11 } from "@tanstack/react-query";
+import { useEffect as useEffect15, useRef as useRef8, useCallback as useCallback11 } from "react";
 import {
   listMcpServers,
   startMcpServer,
@@ -4845,7 +5018,7 @@ function useMCPServers() {
     },
     refetchInterval: 1e4
   });
-  useEffect14(() => {
+  useEffect15(() => {
     if (query.data?.servers) {
       setServers(query.data.servers);
     }
@@ -4853,7 +5026,7 @@ function useMCPServers() {
   return query;
 }
 function useStartMCPServer() {
-  const queryClient = useQueryClient10();
+  const queryClient = useQueryClient11();
   return useMutation8({
     mutationFn: async (name) => {
       const { data, error } = await startMcpServer({
@@ -4872,7 +5045,7 @@ function useStartMCPServer() {
   });
 }
 function useStopMCPServer() {
-  const queryClient = useQueryClient10();
+  const queryClient = useQueryClient11();
   const setLoading = useMCPStore((s) => s.setLoading);
   return useMutation8({
     mutationFn: async (name) => {
@@ -4894,7 +5067,7 @@ function useStopMCPServer() {
   });
 }
 function useAddMCPServer() {
-  const queryClient = useQueryClient10();
+  const queryClient = useQueryClient11();
   return useMutation8({
     mutationFn: async (params) => {
       const { data, error } = await addMcpServer({
@@ -4913,7 +5086,7 @@ function useAddMCPServer() {
   });
 }
 function useRemoveMCPServer() {
-  const queryClient = useQueryClient10();
+  const queryClient = useQueryClient11();
   return useMutation8({
     mutationFn: async (name) => {
       const { data, error } = await removeMcpServer({
@@ -4932,7 +5105,7 @@ function useRemoveMCPServer() {
   });
 }
 function useAuthenticateMCPServer() {
-  const queryClient = useQueryClient10();
+  const queryClient = useQueryClient11();
   return useMutation8({
     mutationFn: async (name) => {
       const { data, error } = await initiateMcpAuth({
@@ -4951,7 +5124,7 @@ function useAuthenticateMCPServer() {
   });
 }
 function useRevokeMCPAuth() {
-  const queryClient = useQueryClient10();
+  const queryClient = useQueryClient11();
   return useMutation8({
     mutationFn: async (name) => {
       const { data, error } = await revokeMcpAuth({
@@ -4988,15 +5161,15 @@ function useCopilotDevicePoller() {
   const copilotDevice = useMCPStore((s) => s.copilotDevice);
   const setCopilotDevice = useMCPStore((s) => s.setCopilotDevice);
   const setLoading = useMCPStore((s) => s.setLoading);
-  const queryClient = useQueryClient10();
-  const timerRef = useRef7(null);
+  const queryClient = useQueryClient11();
+  const timerRef = useRef8(null);
   const stopPolling = useCallback11(() => {
     if (timerRef.current) {
       clearInterval(timerRef.current);
       timerRef.current = null;
     }
   }, []);
-  useEffect14(() => {
+  useEffect15(() => {
     if (!copilotDevice) {
       stopPolling();
       return;
@@ -5031,8 +5204,8 @@ function useCopilotDevicePoller() {
   return copilotDevice;
 }
 // src/hooks/useSkills.ts
-import { useMutation as useMutation9, useQuery as useQuery13, useQueryClient as useQueryClient11 } from "@tanstack/react-query";
-import { useEffect as useEffect15 } from "react";
+import { useMutation as useMutation9, useQuery as useQuery13, useQueryClient as useQueryClient12 } from "@tanstack/react-query";
+import { useEffect as useEffect16 } from "react";
 function useSkills() {
   const setSkillsConfig = useSkillsStore((s) => s.setSkillsConfig);
   const query = useQuery13({
@@ -5042,7 +5215,7 @@ function useSkills() {
     },
     refetchInterval: 30000
   });
-  useEffect15(() => {
+  useEffect16(() => {
     if (query.data?.items) {
       setSkillsConfig({
         skills: query.data.items,
@@ -5055,7 +5228,7 @@ function useSkills() {
   return query;
 }
 function useUpdateSkillsConfig() {
-  const queryClient = useQueryClient11();
+  const queryClient = useQueryClient12();
   const setSkillsConfig = useSkillsStore((s) => s.setSkillsConfig);
   return useMutation9({
     mutationFn: (input) => apiClient.updateSkillsConfig(input),
@@ -5173,6 +5346,7 @@ export {
   useCopilotDevicePoller,
   useConfig,
   useCommitChanges,
+  useClientEvents,
   useBranches,
   useAuthenticateMCPServer,
   useAuthStatus,
@@ -5182,4 +5356,4 @@ export {
   sessionsQueryKey
 };
 
-//# debugId=2FC62A50D828F41864756E2164756E21
+//# debugId=45CFEFDB9295F3FD64756E2164756E21