@oxyhq/auth 1.0.0

package/src/hooks/mutations/useAccountMutations.ts

@@ -0,0 +1,344 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import type { User } from '@oxyhq/core';
+import { queryKeys, invalidateAccountQueries, invalidateUserQueries } from '../queries/queryKeys';
+import { useWebOxy } from '../../WebOxyProvider';
+import { toast } from 'sonner';
+import { refreshAvatarInStore } from '../../utils/avatarUtils';
+import { useAuthStore } from '../../stores/authStore';
+import { authenticatedApiCall } from '../../utils/authHelpers';
+
+/**
+ * Update user profile with optimistic updates and offline queue support
+ */
+export const useUpdateProfile = () => {
+  const { oxyServices, activeSessionId, user } = useWebOxy();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (updates: Partial<User>) => {
+      return authenticatedApiCall<User>(
+        oxyServices,
+        activeSessionId,
+        () => oxyServices.updateProfile(updates)
+      );
+    },
+    // Optimistic update
+    onMutate: async (updates) => {
+      // Cancel outgoing refetches
+      await queryClient.cancelQueries({ queryKey: queryKeys.accounts.current() });
+
+      // Snapshot previous value
+      const previousUser = queryClient.getQueryData<User>(queryKeys.accounts.current());
+
+      // Optimistically update
+      if (previousUser) {
+        queryClient.setQueryData<User>(queryKeys.accounts.current(), {
+          ...previousUser,
+          ...updates,
+        });
+
+        // Also update profile query if sessionId is available
+        if (activeSessionId) {
+          queryClient.setQueryData<User>(queryKeys.users.profile(activeSessionId), {
+            ...previousUser,
+            ...updates,
+          });
+        }
+      }
+
+      return { previousUser };
+    },
+    // On error, rollback
+    onError: (error, updates, context) => {
+      if (context?.previousUser) {
+        queryClient.setQueryData(queryKeys.accounts.current(), context.previousUser);
+        if (activeSessionId) {
+          queryClient.setQueryData(queryKeys.users.profile(activeSessionId), context.previousUser);
+        }
+      }
+      toast.error(error instanceof Error ? error.message : 'Failed to update profile');
+    },
+    // On success, invalidate and refetch
+    onSuccess: (data, updates) => {
+      // Update cache with server response
+      queryClient.setQueryData(queryKeys.accounts.current(), data);
+      if (activeSessionId) {
+        queryClient.setQueryData(queryKeys.users.profile(activeSessionId), data);
+      }
+      
+      // Update authStore so frontend components see the changes immediately
+      useAuthStore.getState().setUser(data);
+      
+      // If avatar was updated, refresh accountStore with cache-busted URL
+      if (updates.avatar && activeSessionId && oxyServices) {
+        refreshAvatarInStore(activeSessionId, updates.avatar, oxyServices);
+      }
+      
+      // Invalidate all related queries to refresh everywhere
+      invalidateUserQueries(queryClient);
+      invalidateAccountQueries(queryClient);
+    },
+  });
+};
+
+/**
+ * Upload avatar with progress tracking and offline queue support
+ */
+export const useUploadAvatar = () => {
+  const { oxyServices, activeSessionId } = useWebOxy();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (file: { uri: string; type?: string; name?: string; size?: number }) => {
+      return authenticatedApiCall<User>(oxyServices, activeSessionId, async () => {
+        // Upload file first
+        const uploadResult = await oxyServices.assetUpload(file as any, 'public');
+        const fileId = uploadResult?.file?.id || uploadResult?.id || uploadResult;
+
+        if (!fileId || typeof fileId !== 'string') {
+          throw new Error('Failed to get file ID from upload result');
+        }
+
+        // Update profile with file ID
+        return await oxyServices.updateProfile({ avatar: fileId });
+      });
+    },
+    onMutate: async (file) => {
+      await queryClient.cancelQueries({ queryKey: queryKeys.accounts.current() });
+      const previousUser = queryClient.getQueryData<User>(queryKeys.accounts.current());
+
+      // Optimistically set a temporary avatar (using file URI as placeholder)
+      if (previousUser) {
+        const optimisticUser = {
+          ...previousUser,
+          avatar: file.uri, // Temporary, will be replaced with fileId
+        };
+        queryClient.setQueryData<User>(queryKeys.accounts.current(), optimisticUser);
+        if (activeSessionId) {
+          queryClient.setQueryData<User>(queryKeys.users.profile(activeSessionId), optimisticUser);
+        }
+      }
+
+      return { previousUser };
+    },
+    onError: (error, file, context) => {
+      if (context?.previousUser) {
+        queryClient.setQueryData(queryKeys.accounts.current(), context.previousUser);
+        if (activeSessionId) {
+          queryClient.setQueryData(queryKeys.users.profile(activeSessionId), context.previousUser);
+        }
+      }
+      toast.error(error instanceof Error ? error.message : 'Failed to upload avatar');
+    },
+    onSuccess: (data) => {
+      queryClient.setQueryData(queryKeys.accounts.current(), data);
+      if (activeSessionId) {
+        queryClient.setQueryData(queryKeys.users.profile(activeSessionId), data);
+      }
+      
+      // Update authStore so frontend components see the changes immediately
+      useAuthStore.getState().setUser(data);
+      
+      // Refresh accountStore with cache-busted URL if avatar was updated
+      if (data?.avatar && activeSessionId && oxyServices) {
+        refreshAvatarInStore(activeSessionId, data.avatar, oxyServices);
+      }
+      
+      // Invalidate all related queries to refresh everywhere
+      invalidateUserQueries(queryClient);
+      invalidateAccountQueries(queryClient);
+      toast.success('Avatar updated successfully');
+    },
+  });
+};
+
+/**
+ * Update account settings
+ */
+export const useUpdateAccountSettings = () => {
+  const { oxyServices, activeSessionId } = useWebOxy();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (settings: Record<string, any>) => {
+      return await oxyServices.updateProfile({ privacySettings: settings });
+    },
+    onMutate: async (settings) => {
+      await queryClient.cancelQueries({ queryKey: queryKeys.accounts.settings() });
+      const previousUser = queryClient.getQueryData<User>(queryKeys.accounts.current());
+
+      if (previousUser) {
+        queryClient.setQueryData<User>(queryKeys.accounts.current(), {
+          ...previousUser,
+          privacySettings: {
+            ...previousUser.privacySettings,
+            ...settings,
+          },
+        });
+      }
+
+      return { previousUser };
+    },
+    onError: (error, settings, context) => {
+      if (context?.previousUser) {
+        queryClient.setQueryData(queryKeys.accounts.current(), context.previousUser);
+      }
+      toast.error(error instanceof Error ? error.message : 'Failed to update settings');
+    },
+    onSuccess: (data) => {
+      queryClient.setQueryData(queryKeys.accounts.current(), data);
+      
+      // Update authStore so frontend components see the changes immediately
+      useAuthStore.getState().setUser(data);
+      
+      invalidateAccountQueries(queryClient);
+      toast.success('Settings updated successfully');
+    },
+    onSettled: () => {
+      queryClient.invalidateQueries({ queryKey: queryKeys.accounts.settings() });
+    },
+  });
+};
+
+/**
+ * Update privacy settings with optimistic updates and authentication handling
+ */
+export const useUpdatePrivacySettings = () => {
+  const { oxyServices, activeSessionId, user } = useWebOxy();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({ settings, userId }: { settings: Record<string, any>; userId?: string }) => {
+      const targetUserId = userId || user?.id;
+      if (!targetUserId) {
+        throw new Error('User ID is required');
+      }
+
+      return authenticatedApiCall<Record<string, unknown>>(
+        oxyServices,
+        activeSessionId,
+        () => oxyServices.updatePrivacySettings(settings, targetUserId)
+      );
+    },
+    // Optimistic update
+    onMutate: async ({ settings, userId }) => {
+      const targetUserId = userId || user?.id;
+      if (!targetUserId) return;
+
+      // Cancel outgoing refetches
+      await queryClient.cancelQueries({ queryKey: queryKeys.privacy.settings(targetUserId) });
+      await queryClient.cancelQueries({ queryKey: queryKeys.accounts.current() });
+
+      // Snapshot previous values
+      const previousPrivacySettings = queryClient.getQueryData(queryKeys.privacy.settings(targetUserId));
+      const previousUser = queryClient.getQueryData<User>(queryKeys.accounts.current());
+
+      // Optimistically update privacy settings
+      if (previousPrivacySettings) {
+        queryClient.setQueryData(queryKeys.privacy.settings(targetUserId), {
+          ...previousPrivacySettings,
+          ...settings,
+        });
+      }
+
+      // Also update user query if available
+      if (previousUser) {
+        queryClient.setQueryData<User>(queryKeys.accounts.current(), {
+          ...previousUser,
+          privacySettings: {
+            ...previousUser.privacySettings,
+            ...settings,
+          },
+        });
+      }
+
+      return { previousPrivacySettings, previousUser };
+    },
+    // On error, rollback
+    onError: (error, { userId }, context) => {
+      const targetUserId = userId || user?.id;
+      if (context?.previousPrivacySettings && targetUserId) {
+        queryClient.setQueryData(queryKeys.privacy.settings(targetUserId), context.previousPrivacySettings);
+      }
+      if (context?.previousUser) {
+        queryClient.setQueryData(queryKeys.accounts.current(), context.previousUser);
+      }
+      toast.error(error instanceof Error ? error.message : 'Failed to update privacy settings');
+    },
+    // On success, invalidate and refetch
+    onSuccess: (data, { userId }) => {
+      const targetUserId = userId || user?.id;
+      if (targetUserId) {
+        queryClient.setQueryData(queryKeys.privacy.settings(targetUserId), data);
+      }
+      // Also update account query if it contains privacy settings
+      const currentUser = queryClient.getQueryData<User>(queryKeys.accounts.current());
+      if (currentUser) {
+        const updatedUser: User = {
+          ...currentUser,
+          privacySettings: data as { [key: string]: unknown },
+        };
+        queryClient.setQueryData<User>(queryKeys.accounts.current(), updatedUser);
+
+        // Update authStore so frontend components see the changes immediately
+        useAuthStore.getState().setUser(updatedUser);
+      }
+      invalidateAccountQueries(queryClient);
+    },
+    // Always refetch after error or success
+    onSettled: (data, error, { userId }) => {
+      const targetUserId = userId || user?.id;
+      if (targetUserId) {
+        queryClient.invalidateQueries({ queryKey: queryKeys.privacy.settings(targetUserId) });
+      }
+      queryClient.invalidateQueries({ queryKey: queryKeys.accounts.current() });
+    },
+  });
+};
+
+/** Uploaded file data structure from API */
+interface UploadedFile {
+  id: string;
+  originalName?: string;
+  sha256?: string;
+  mime?: string;
+  size?: number;
+  createdAt?: string;
+  metadata?: Record<string, unknown>;
+  variants?: Array<{ type: string; key: string; width?: number; height?: number; readyAt?: string; metadata?: Record<string, unknown> }>;
+}
+
+/** Upload result type that supports both single file and batch responses */
+interface UploadResult {
+  file?: UploadedFile;
+  files?: UploadedFile[];
+  id?: string;
+}
+
+/**
+ * Upload file with authentication handling and progress tracking
+ */
+export const useUploadFile = () => {
+  const { oxyServices, activeSessionId } = useWebOxy();
+
+  return useMutation({
+    mutationFn: async ({
+      file,
+      visibility,
+      metadata,
+      onProgress
+    }: {
+      file: File;
+      visibility?: 'private' | 'public' | 'unlisted';
+      metadata?: Record<string, any>;
+      onProgress?: (progress: number) => void;
+    }) => {
+      return authenticatedApiCall<UploadResult>(
+        oxyServices,
+        activeSessionId,
+        () => oxyServices.assetUpload(file as any, visibility, metadata, onProgress)
+      );
+    },
+  });
+};
+

package/src/hooks/mutations/useServicesMutations.ts

@@ -0,0 +1,164 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import type { User } from '@oxyhq/core';
+import { queryKeys, invalidateSessionQueries } from '../queries/queryKeys';
+import { useWebOxy } from '../../WebOxyProvider';
+import { toast } from 'sonner';
+
+/**
+ * Switch active session
+ */
+export const useSwitchSession = () => {
+  const { switchSession, activeSessionId } = useWebOxy();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (sessionId: string) => {
+      return await switchSession(sessionId);
+    },
+    onSuccess: (user) => {
+      // Invalidate all session queries
+      invalidateSessionQueries(queryClient);
+      
+      // Update current user query
+      queryClient.setQueryData(queryKeys.accounts.current(), user);
+      
+      // Invalidate account queries
+      queryClient.invalidateQueries({ queryKey: queryKeys.accounts.all });
+    },
+    onError: (error) => {
+      toast.error(error instanceof Error ? error.message : 'Failed to switch session');
+    },
+  });
+};
+
+/**
+ * Logout from a session
+ */
+export const useLogoutSession = () => {
+  const { oxyServices, activeSessionId, sessions } = useWebOxy();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (targetSessionId?: string) => {
+      if (!activeSessionId) {
+        throw new Error('No active session');
+      }
+      
+      const sessionToLogout = targetSessionId || activeSessionId;
+      await oxyServices.logoutSession(activeSessionId, sessionToLogout);
+      
+      return sessionToLogout;
+    },
+    onMutate: async (targetSessionId) => {
+      // Cancel outgoing queries
+      await queryClient.cancelQueries({ queryKey: queryKeys.sessions.all });
+      
+      // Snapshot previous sessions
+      const previousSessions = queryClient.getQueryData(queryKeys.sessions.list());
+      
+      // Optimistically remove session
+      if (previousSessions) {
+        const sessionToLogout = targetSessionId || activeSessionId;
+        const updatedSessions = (previousSessions as any[]).filter(
+          (s: any) => s.sessionId !== sessionToLogout
+        );
+        queryClient.setQueryData(queryKeys.sessions.list(), updatedSessions);
+      }
+      
+      return { previousSessions };
+    },
+    onError: (error, targetSessionId, context) => {
+      // Rollback on error
+      if (context?.previousSessions) {
+        queryClient.setQueryData(queryKeys.sessions.list(), context.previousSessions);
+      }
+      toast.error(error instanceof Error ? error.message : 'Failed to logout');
+    },
+    onSuccess: () => {
+      // Invalidate all session queries
+      invalidateSessionQueries(queryClient);
+    },
+    onSettled: () => {
+      queryClient.invalidateQueries({ queryKey: queryKeys.sessions.all });
+    },
+  });
+};
+
+/**
+ * Logout from all sessions
+ */
+export const useLogoutAll = () => {
+  const { oxyServices, activeSessionId, clearSessionState } = useWebOxy();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async () => {
+      if (!activeSessionId) {
+        throw new Error('No active session');
+      }
+      
+      await oxyServices.logoutAllSessions(activeSessionId);
+      await clearSessionState();
+    },
+    onSuccess: () => {
+      // Clear all queries
+      queryClient.clear();
+      toast.success('Logged out from all sessions');
+    },
+    onError: (error) => {
+      toast.error(error instanceof Error ? error.message : 'Failed to logout from all sessions');
+    },
+  });
+};
+
+/**
+ * Update device name
+ */
+export const useUpdateDeviceName = () => {
+  const { oxyServices, activeSessionId } = useWebOxy();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (deviceName: string) => {
+      if (!activeSessionId) {
+        throw new Error('No active session');
+      }
+      
+      return await oxyServices.updateDeviceName(activeSessionId, deviceName);
+    },
+    onSuccess: () => {
+      // Invalidate device and session queries
+      queryClient.invalidateQueries({ queryKey: queryKeys.devices.all });
+      queryClient.invalidateQueries({ queryKey: queryKeys.sessions.all });
+      toast.success('Device name updated');
+    },
+    onError: (error) => {
+      toast.error(error instanceof Error ? error.message : 'Failed to update device name');
+    },
+  });
+};
+
+/**
+ * Remove a device
+ */
+export const useRemoveDevice = () => {
+  const { oxyServices } = useWebOxy();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (deviceId: string) => {
+      await oxyServices.removeDevice(deviceId);
+      return deviceId;
+    },
+    onSuccess: () => {
+      // Invalidate device queries
+      queryClient.invalidateQueries({ queryKey: queryKeys.devices.all });
+      queryClient.invalidateQueries({ queryKey: queryKeys.sessions.all });
+      toast.success('Device removed');
+    },
+    onError: (error) => {
+      toast.error(error instanceof Error ? error.message : 'Failed to remove device');
+    },
+  });
+};
+

package/src/hooks/queries/index.ts

@@ -0,0 +1,36 @@
+/**
+ * Query Hooks
+ * 
+ * TanStack Query hooks for fetching Oxy services data.
+ * All hooks follow the same pattern with optional `enabled` parameter.
+ */
+
+// Account and user query hooks
+export {
+  useUserProfile,
+  useUserProfiles,
+  useCurrentUser,
+  useUserById,
+  useUserByUsername,
+  useUsersBySessions,
+  usePrivacySettings,
+} from './useAccountQueries';
+
+// Service query hooks (sessions, devices, security)
+export {
+  useSessions,
+  useSession,
+  useDeviceSessions,
+  useUserDevices,
+  useSecurityInfo,
+} from './useServicesQueries';
+
+// Security activity query hooks
+export {
+  useSecurityActivity,
+  useRecentSecurityActivity,
+} from './useSecurityQueries';
+
+// Query keys and invalidation helpers (for advanced usage)
+export { queryKeys, invalidateAccountQueries, invalidateUserQueries, invalidateSessionQueries } from './queryKeys';
+

package/src/hooks/queries/queryKeys.ts

@@ -0,0 +1,88 @@
+/**
+ * Centralized query keys for TanStack Query
+ * 
+ * Following best practices:
+ * - Use arrays for hierarchical keys
+ * - Include all parameters in the key
+ * - Use consistent naming conventions
+ */
+
+export const queryKeys = {
+  // Account queries
+  accounts: {
+    all: ['accounts'] as const,
+    lists: () => [...queryKeys.accounts.all, 'list'] as const,
+    list: (sessionIds: string[]) => [...queryKeys.accounts.lists(), sessionIds] as const,
+    details: () => [...queryKeys.accounts.all, 'detail'] as const,
+    detail: (sessionId: string) => [...queryKeys.accounts.details(), sessionId] as const,
+    current: () => [...queryKeys.accounts.all, 'current'] as const,
+    settings: () => [...queryKeys.accounts.all, 'settings'] as const,
+  },
+
+  // User queries
+  users: {
+    all: ['users'] as const,
+    lists: () => [...queryKeys.users.all, 'list'] as const,
+    list: (userIds: string[]) => [...queryKeys.users.lists(), userIds] as const,
+    details: () => [...queryKeys.users.all, 'detail'] as const,
+    detail: (userId: string) => [...queryKeys.users.details(), userId] as const,
+    profile: (sessionId: string) => [...queryKeys.users.details(), sessionId, 'profile'] as const,
+  },
+
+  // Session queries
+  sessions: {
+    all: ['sessions'] as const,
+    lists: () => [...queryKeys.sessions.all, 'list'] as const,
+    list: (userId?: string) => [...queryKeys.sessions.lists(), userId] as const,
+    details: () => [...queryKeys.sessions.all, 'detail'] as const,
+    detail: (sessionId: string) => [...queryKeys.sessions.details(), sessionId] as const,
+    active: () => [...queryKeys.sessions.all, 'active'] as const,
+    device: (deviceId: string) => [...queryKeys.sessions.all, 'device', deviceId] as const,
+  },
+
+  // Device queries
+  devices: {
+    all: ['devices'] as const,
+    lists: () => [...queryKeys.devices.all, 'list'] as const,
+    list: (userId?: string) => [...queryKeys.devices.lists(), userId] as const,
+    details: () => [...queryKeys.devices.all, 'detail'] as const,
+    detail: (deviceId: string) => [...queryKeys.devices.details(), deviceId] as const,
+  },
+
+  // Privacy settings queries
+  privacy: {
+    all: ['privacy'] as const,
+    settings: (userId?: string) => [...queryKeys.privacy.all, 'settings', userId || 'current'] as const,
+  },
+
+  // Security activity queries
+  security: {
+    all: ['security'] as const,
+    activity: (limit?: number, offset?: number, eventType?: string) =>
+      [...queryKeys.security.all, 'activity', limit, offset, eventType] as const,
+    recent: (limit: number) =>
+      [...queryKeys.security.all, 'recent', limit] as const,
+  },
+} as const;
+
+/**
+ * Helper to invalidate all account-related queries
+ */
+export const invalidateAccountQueries = (queryClient: any) => {
+  queryClient.invalidateQueries({ queryKey: queryKeys.accounts.all });
+};
+
+/**
+ * Helper to invalidate all user-related queries
+ */
+export const invalidateUserQueries = (queryClient: any) => {
+  queryClient.invalidateQueries({ queryKey: queryKeys.users.all });
+};
+
+/**
+ * Helper to invalidate all session-related queries
+ */
+export const invalidateSessionQueries = (queryClient: any) => {
+  queryClient.invalidateQueries({ queryKey: queryKeys.sessions.all });
+};
+