@oxyhq/services 5.16.0 → 5.16.2

package/src/ui/hooks/useIdentityMutations.ts

@@ -0,0 +1,115 @@
+/**
+ * TanStack Query mutations for identity operations
+ * Provides offline-first mutations for identity creation, import, and sync
+ * Never deletes identity on errors - preserves user data
+ */
+
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import type { User } from '../../models/interfaces';
+
+export interface CreateIdentityResult {
+  recoveryPhrase: string[];
+  synced: boolean;
+}
+
+export interface ImportIdentityResult {
+  synced: boolean;
+}
+
+/**
+ * Hook for creating a new identity with offline support
+ * Never deletes identity on error - preserves user data
+ */
+export function useCreateIdentity(
+  createIdentityFn: () => Promise<CreateIdentityResult>
+) {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: createIdentityFn,
+    onSuccess: (data) => {
+      // Invalidate user queries to refetch after identity creation
+      queryClient.invalidateQueries({ queryKey: ['user'] });
+      queryClient.invalidateQueries({ queryKey: ['identity'] });
+    },
+    onError: (error) => {
+      // Never delete identity on error - just log it
+      // User can recover using recovery phrase
+      if (__DEV__) {
+        console.warn('[useCreateIdentity] Identity creation error (identity may still exist):', error);
+      }
+    },
+    retry: false, // Don't retry identity creation
+    networkMode: 'offlineFirst',
+  });
+}
+
+/**
+ * Hook for importing an identity from recovery phrase
+ * Never deletes identity on error - preserves user data
+ */
+export function useImportIdentity(
+  importIdentityFn: (phrase: string) => Promise<ImportIdentityResult>
+) {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: importIdentityFn,
+    onSuccess: (data) => {
+      queryClient.invalidateQueries({ queryKey: ['user'] });
+      queryClient.invalidateQueries({ queryKey: ['identity'] });
+    },
+    onError: (error) => {
+      // Never delete identity on error - just log it
+      if (__DEV__) {
+        console.warn('[useImportIdentity] Identity import error (identity may still exist):', error);
+      }
+    },
+    retry: false,
+    networkMode: 'offlineFirst',
+  });
+}
+
+/**
+ * Hook for syncing identity with server
+ * Never deletes identity on error - only logs and allows retry
+ */
+export function useSyncIdentity(
+  syncIdentityFn: () => Promise<User>
+) {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: syncIdentityFn,
+    onSuccess: (user) => {
+      // Update user cache
+      queryClient.setQueryData(['user', 'current'], user);
+      queryClient.invalidateQueries({ queryKey: ['user'] });
+      queryClient.invalidateQueries({ queryKey: ['identity'] });
+    },
+    onError: (error) => {
+      // Never delete identity on error - just log it
+      // User can retry sync later or use recovery phrase
+      if (__DEV__) {
+        console.warn('[useSyncIdentity] Sync failed, but identity is preserved:', error);
+      }
+    },
+    retry: (failureCount, error: any) => {
+      // Retry up to 2 times for sync operations
+      // Don't retry if it's a network error - user can retry when online
+      const errorMessage = error instanceof Error ? error.message : String(error);
+      const isNetworkError = 
+        errorMessage.includes('Network') ||
+        errorMessage.includes('Failed to fetch') ||
+        error?.code === 'NETWORK_ERROR';
+      
+      if (isNetworkError) {
+        return false; // Don't retry network errors - user will retry when online
+      }
+      
+      return failureCount < 2;
+    },
+    networkMode: 'offlineFirst',
+  });
+}
+

package/src/ui/hooks/useProfileEditing.ts

@@ -1,8 +1,7 @@
-import { useState, useCallback } from 'react';
-import { useOxy } from '../context/OxyContext';
-import { useAuthStore } from '../stores/authStore';
-import { toast } from '../../lib/sonner';
+import { useCallback } from 'react';
 import { useI18n } from './useI18n';
+import { useUpdateProfile } from './mutations/useAccountMutations';
+import { useAuthStore } from '../stores/authStore';
 
 export interface ProfileUpdateData {
     displayName?: string;
@@ -33,74 +32,61 @@ export interface ProfileUpdateData {
  * Provides functions to update profile fields and handle saving
  */
 export const useProfileEditing = () => {
-    const { oxyServices, activeSessionId } = useOxy();
-    const updateUser = useAuthStore((state) => state.updateUser);
     const { t } = useI18n();
-    const [isSaving, setIsSaving] = useState(false);
+    const updateProfileMutation = useUpdateProfile();
 
     /**
-     * Save profile updates to the server
+     * Save profile updates to the server using TanStack Query
      */
     const saveProfile = useCallback(async (updates: ProfileUpdateData) => {
-        if (!oxyServices) {
-            toast.error(t('editProfile.toasts.serviceUnavailable') || 'Service not available');
-            return false;
-        }
-
-        try {
-            setIsSaving(true);
+        // Prepare update object
+        const updateData: Record<string, any> = {};
 
-            // Prepare update object
-            const updateData: Record<string, any> = {};
-
-            if (updates.username !== undefined) {
-                updateData.username = updates.username;
-            }
-            if (updates.email !== undefined) {
-                updateData.email = updates.email;
-            }
-            if (updates.bio !== undefined) {
-                updateData.bio = updates.bio;
-            }
-            if (updates.location !== undefined || updates.locations !== undefined) {
-                updateData.location = updates.locations && updates.locations.length > 0 
-                    ? updates.locations[0].name 
-                    : updates.location || '';
-                if (updates.locations) {
-                    updateData.locations = updates.locations;
-                }
-            }
-            if (updates.links !== undefined) {
-                updateData.links = updates.links;
-            }
-            if (updates.linksMetadata !== undefined) {
-                updateData.linksMetadata = updates.linksMetadata;
-            }
-            if (updates.avatar !== undefined) {
-                updateData.avatar = updates.avatar;
+        if (updates.username !== undefined) {
+            updateData.username = updates.username;
+        }
+        if (updates.email !== undefined) {
+            updateData.email = updates.email;
+        }
+        if (updates.bio !== undefined) {
+            updateData.bio = updates.bio;
+        }
+        if (updates.location !== undefined || updates.locations !== undefined) {
+            updateData.location = updates.locations && updates.locations.length > 0 
+                ? updates.locations[0].name 
+                : updates.location || '';
+            if (updates.locations) {
+                updateData.locations = updates.locations;
             }
+        }
+        if (updates.links !== undefined) {
+            updateData.links = updates.links;
+        }
+        if (updates.linksMetadata !== undefined) {
+            updateData.linksMetadata = updates.linksMetadata;
+        }
+        if (updates.avatar !== undefined) {
+            updateData.avatar = updates.avatar;
+        }
 
-            // Handle name field
-            if (updates.displayName !== undefined || updates.lastName !== undefined) {
-                const currentUser = useAuthStore.getState().user;
-                const currentName = currentUser?.name;
-                updateData.name = {
-                    first: updates.displayName ?? (typeof currentName === 'object' ? currentName?.first : '') ?? '',
-                    last: updates.lastName ?? (typeof currentName === 'object' ? currentName?.last : '') ?? '',
-                };
-            }
+        // Handle name field
+        if (updates.displayName !== undefined || updates.lastName !== undefined) {
+            const currentUser = useAuthStore.getState().user;
+            const currentName = currentUser?.name;
+            updateData.name = {
+                first: updates.displayName ?? (typeof currentName === 'object' ? currentName?.first : '') ?? '',
+                last: updates.lastName ?? (typeof currentName === 'object' ? currentName?.last : '') ?? '',
+            };
+        }
 
-            await updateUser(updateData, oxyServices);
-            toast.success(t('editProfile.toasts.profileUpdated') || 'Profile updated successfully');
+        try {
+            await updateProfileMutation.mutateAsync(updateData);
             return true;
         } catch (error: any) {
-            console.error('Failed to update profile:', error);
-            toast.error(error?.message || t('editProfile.toasts.updateFailed') || 'Failed to update profile');
+            // Error toast is handled by the mutation
             return false;
-        } finally {
-            setIsSaving(false);
         }
-    }, [oxyServices, updateUser, t]);
+    }, [updateProfileMutation, t]);
 
     /**
      * Update a single profile field
@@ -138,7 +124,7 @@ export const useProfileEditing = () => {
     return {
         saveProfile,
         updateField,
-        isSaving,
+        isSaving: updateProfileMutation.isPending,
     };
 };
 

package/src/ui/hooks/useQueryClient.ts

@@ -0,0 +1,17 @@
+import { useQueryClient as useTanStackQueryClient } from '@tanstack/react-query';
+import type { QueryClient } from '@tanstack/react-query';
+
+/**
+ * Custom hook to access the QueryClient
+ * Provides type safety and ensures client is available
+ */
+export const useQueryClient = (): QueryClient => {
+  const queryClient = useTanStackQueryClient();
+  
+  if (!queryClient) {
+    throw new Error('QueryClient is not available. Make sure OxyProvider is wrapping your app.');
+  }
+  
+  return queryClient;
+};
+

package/src/ui/hooks/useSessionManagement.ts

@@ -6,6 +6,8 @@ import { fetchSessionsWithFallback, mapSessionsToClient, validateSessionBatch }
 import { getStorageKeys, type StorageInterface } from '../utils/storageHelpers';
 import { handleAuthError, isInvalidSessionError } from '../utils/errorHandlers';
 import type { OxyServices } from '../../core';
+import type { QueryClient } from '@tanstack/react-query';
+import { clearQueryCache } from './queryClient.js';
 
 export interface UseSessionManagementOptions {
   oxyServices: OxyServices;
@@ -19,6 +21,7 @@ export interface UseSessionManagementOptions {
   setAuthError?: (message: string | null) => void;
   logger?: (message: string, error?: unknown) => void;
   setTokenReady?: (ready: boolean) => void;
+  queryClient?: QueryClient | null;
 }
 
 export interface UseSessionManagementResult {
@@ -55,6 +58,7 @@ export const useSessionManagement = ({
   setAuthError,
   logger,
   setTokenReady,
+  queryClient,
 }: UseSessionManagementOptions): UseSessionManagementResult => {
   const [sessions, setSessions] = useState<ClientSession[]>([]);
   const [activeSessionId, setActiveSessionId] = useState<string | null>(null);
@@ -140,6 +144,8 @@ export const useSessionManagement = ({
     try {
       await storage.removeItem(storageKeys.activeSessionId);
       await storage.removeItem(storageKeys.sessionIds);
+      // Clear identity sync state
+      await storage.removeItem('oxy_identity_synced').catch(() => {});
     } catch (error) {
       handleAuthError(error, {
         defaultMessage: CLEAR_STORAGE_ERROR,
@@ -155,9 +161,26 @@ export const useSessionManagement = ({
     setSessions([]);
     setActiveSessionId(null);
     logoutStore();
+    
+    // Clear TanStack Query cache (in-memory)
+    if (queryClient) {
+      queryClient.clear();
+    }
+    
+    // Clear persisted query cache
+    if (storage) {
+      try {
+        await clearQueryCache(storage);
+      } catch (error) {
+        if (logger) {
+          logger('Failed to clear persisted query cache', error);
+        }
+      }
+    }
+    
     await clearSessionStorage();
     onAuthStateChange?.(null);
-  }, [clearSessionStorage, logoutStore, onAuthStateChange]);
+  }, [clearSessionStorage, logoutStore, onAuthStateChange, queryClient, storage, logger]);
 
   const activateSession = useCallback(
     async (sessionId: string, user: User): Promise<void> => {

package/src/ui/screens/AccountOverviewScreen.tsx

@@ -27,6 +27,7 @@ import { getDisplayName, getShortDisplayName } from '../utils/user-utils';
 import { useColorScheme } from '../hooks/use-color-scheme';
 import { normalizeTheme } from '../utils/themeUtils';
 import { useOxy } from '../context/OxyContext';
+import { useUsersBySessions } from '../hooks/queries/useAccountQueries';
 import {
     SCREEN_PADDING_HORIZONTAL,
     SECTION_GAP,
@@ -133,53 +134,44 @@ const AccountOverviewScreen: React.FC<BaseScreenProps> = ({
         ), [sessions, activeSessionId, user?.id]
     );
 
-    // Load user profiles for additional accounts
-    React.useEffect(() => {
-        const loadAdditionalAccountsData = async () => {
-            if (!oxyServices || additionalAccounts.length === 0) {
-                setAdditionalAccountsData([]);
-                return;
-            }
-
-            setLoadingAdditionalAccounts(true);
-            try {
-                const accountsData = await Promise.all(
-                    additionalAccounts.map(async (session) => {
-                        try {
-                            const userProfile = await oxyServices.getUserBySession(session.sessionId);
-                            return {
-                                id: session.sessionId,
-                                sessionId: session.sessionId,
-                                username: userProfile.username,
-                                email: userProfile.email,
-                                name: userProfile.name,
-                                avatar: userProfile.avatar,
-                                userProfile
-                            };
-                        } catch (error) {
-                            console.error(`Failed to load profile for session ${session.sessionId}:`, error);
-                            return {
-                                id: session.sessionId,
-                                sessionId: session.sessionId,
-                                username: 'Unknown User',
-                                email: 'No email available',
-                                avatar: null,
-                                userProfile: null
-                            };
-                        }
-                    })
-                );
-                setAdditionalAccountsData(accountsData);
-            } catch (error) {
-                console.error('Failed to load additional accounts:', error);
-                setAdditionalAccountsData([]);
-            } finally {
-                setLoadingAdditionalAccounts(false);
-            }
-        };
+    // Load user profiles for additional accounts using TanStack Query
+    const sessionIds = additionalAccounts.map(s => s.sessionId);
+    const { data: usersData, isLoading: isLoadingUsers } = useUsersBySessions(sessionIds, { 
+        enabled: additionalAccounts.length > 0 
+    });
 
-        loadAdditionalAccountsData();
-    }, [sessions, activeSessionId, user?.id, oxyServices]);
+    React.useEffect(() => {
+        if (usersData && usersData.length > 0) {
+            const accountsData = usersData.map(({ sessionId, user: userProfile }) => {
+                if (!userProfile) {
+                    return {
+                        id: sessionId,
+                        sessionId,
+                        username: 'Unknown User',
+                        email: 'No email available',
+                        avatar: null,
+                        userProfile: null
+                    };
+                }
+                return {
+                    id: sessionId,
+                    sessionId,
+                    username: userProfile.username,
+                    email: userProfile.email,
+                    name: userProfile.name,
+                    avatar: userProfile.avatar,
+                    userProfile
+                };
+            });
+            setAdditionalAccountsData(accountsData);
+            setLoadingAdditionalAccounts(false);
+        } else if (additionalAccounts.length === 0) {
+            setAdditionalAccountsData([]);
+            setLoadingAdditionalAccounts(false);
+        } else if (!isLoadingUsers) {
+            setLoadingAdditionalAccounts(false);
+        }
+    }, [usersData, additionalAccounts.length, isLoadingUsers]);
 
     // Feature settings (with mock values)
     const features = {