fix(hooks): memoize return objects to prevent infinite render loops

Apply useMemo to hook returns that create new object references on each
render. This prevents downstream useEffect/useCallback dependencies from
detecting false changes and triggering re-execution.

Fixed hooks:
- PrivacyProvider: memoize context value and toggle callback
- useCopilot: wrap large return object with all dependencies
- useWebSocket: memoize status/connect/disconnect object
- useProjectSelection: memoize state and handlers object
- useCliproxyAuthFlow: memoize spread state with auth functions
- useAnalyticsPage: memoize apiOptions to stabilize query params

ui/src/contexts/privacy-context.tsx

@@ -5,7 +5,15 @@
  */
 
 /* eslint-disable react-refresh/only-export-components */
-import { createContext, useContext, useState, useEffect, type ReactNode } from 'react';
+import {
+  createContext,
+  useContext,
+  useState,
+  useEffect,
+  useMemo,
+  useCallback,
+  type ReactNode,
+} from 'react';
 
 interface PrivacyContextValue {
   /** Whether privacy/demo mode is enabled */
@@ -32,13 +40,14 @@ export function PrivacyProvider({ children }: { children: ReactNode }) {
     localStorage.setItem(STORAGE_KEY, String(privacyMode));
   }, [privacyMode]);
 
-  const togglePrivacyMode = () => setPrivacyMode((prev) => !prev);
+  const togglePrivacyMode = useCallback(() => setPrivacyMode((prev) => !prev), []);
 
-  return (
+  const value = useMemo(
-    <PrivacyContext.Provider value={{ privacyMode, togglePrivacyMode }}>
+    () => ({ privacyMode, togglePrivacyMode }),
-      {children}
+    [privacyMode, togglePrivacyMode]
-    </PrivacyContext.Provider>
   );
+
+  return <PrivacyContext.Provider value={value}>{children}</PrivacyContext.Provider>;
 }
 
 export function usePrivacy() {

ui/src/hooks/use-cliproxy-auth-flow.ts

@@ -3,7 +3,7 @@
  * Manages popup-based OAuth authentication flows
  */
 
-import { useState, useCallback, useRef, useEffect } from 'react';
+import { useState, useCallback, useRef, useEffect, useMemo } from 'react';
 import { useQueryClient } from '@tanstack/react-query';
 import { toast } from 'sonner';
 
@@ -180,9 +180,12 @@ export function useCliproxyAuthFlow() {
     setState({ provider: null, isAuthenticating: false, error: null });
   }, [cleanup]);
 
-  return {
+  return useMemo(
+    () => ({
       ...state,
       startAuth,
       cancelAuth,
-  };
+    }),
+    [state, startAuth, cancelAuth]
+  );
 }

ui/src/hooks/use-copilot.ts

@@ -4,6 +4,7 @@
  * React hook for managing GitHub Copilot integration state.
  */
 
+import { useMemo } from 'react';
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
 
 const API_BASE = '/api';
@@ -247,7 +248,8 @@ export function useCopilot() {
     },
   });
 
-  return {
+  return useMemo(
+    () => ({
       // Status
       status: statusQuery.data,
       statusLoading: statusQuery.isLoading,
@@ -296,5 +298,39 @@ export function useCopilot() {
       install: installMutation.mutate,
       installAsync: installMutation.mutateAsync,
       isInstalling: installMutation.isPending,
-  };
+    }),
+    [
+      statusQuery.data,
+      statusQuery.isLoading,
+      statusQuery.error,
+      statusQuery.refetch,
+      configQuery.data,
+      configQuery.isLoading,
+      modelsQuery.data,
+      modelsQuery.isLoading,
+      rawSettingsQuery.data,
+      rawSettingsQuery.isLoading,
+      rawSettingsQuery.refetch,
+      updateConfigMutation.mutate,
+      updateConfigMutation.mutateAsync,
+      updateConfigMutation.isPending,
+      saveRawSettingsMutation.mutate,
+      saveRawSettingsMutation.mutateAsync,
+      saveRawSettingsMutation.isPending,
+      startAuthMutation.mutate,
+      startAuthMutation.mutateAsync,
+      startAuthMutation.isPending,
+      startAuthMutation.data,
+      startDaemonMutation.mutate,
+      startDaemonMutation.isPending,
+      stopDaemonMutation.mutate,
+      stopDaemonMutation.isPending,
+      infoQuery.data,
+      infoQuery.isLoading,
+      infoQuery.refetch,
+      installMutation.mutate,
+      installMutation.mutateAsync,
+      installMutation.isPending,
+    ]
+  );
 }

ui/src/hooks/use-project-selection.ts

@@ -5,7 +5,7 @@
  * Used in conjunction with ProjectSelectionDialog component.
  */
 
-import { useState, useEffect, useCallback } from 'react';
+import { useState, useEffect, useCallback, useMemo } from 'react';
 
 interface GCloudProject {
   id: string;
@@ -102,10 +102,13 @@ export function useProjectSelection() {
     setState({ isOpen: false, prompt: null });
   }, []);
 
-  return {
+  return useMemo(
+    () => ({
       isOpen: state.isOpen,
       prompt: state.prompt,
       onSelect: handleSelect,
       onClose: handleClose,
-  };
+    }),
+    [state.isOpen, state.prompt, handleSelect, handleClose]
+  );
 }

ui/src/hooks/use-websocket.ts

@@ -4,7 +4,7 @@
  * Manages WebSocket connection, auto-reconnect, and React Query invalidation.
  */
 
-import { useEffect, useState, useCallback, useRef } from 'react';
+import { useEffect, useState, useCallback, useRef, useMemo } from 'react';
 import { useQueryClient } from '@tanstack/react-query';
 import { toast } from 'sonner';
 
@@ -141,5 +141,5 @@ export function useWebSocket() {
     return () => clearInterval(interval);
   }, []);
 
-  return { status, connect, disconnect };
+  return useMemo(() => ({ status, connect, disconnect }), [status, connect, disconnect]);
 }

ui/src/pages/analytics/hooks.ts

@@ -41,11 +41,14 @@ export function useAnalyticsPage() {
     }
   }, [refreshUsage]);
 
-  // Convert dates to API format
+  // Convert dates to API format - memoized to prevent unnecessary re-renders
-  const apiOptions = {
+  const apiOptions = useMemo(
+    () => ({
       startDate: dateRange?.from,
       endDate: dateRange?.to,
-  };
+    }),
+    [dateRange?.from, dateRange?.to]
+  );
 
   // Fetch data
   const { data: summary, isLoading: isSummaryLoading } = useUsageSummary(apiOptions);