@oxyhq/services 5.16.0 → 5.16.2

package/lib/commonjs/ui/screens/AccountSettingsScreen.js

@@ -28,6 +28,8 @@ var _EditLinksModal = require("../components/profile/EditLinksModal");
 var _userUtils = require("../utils/user-utils");
 var _cache = require("../../utils/cache");
 var _OxyContext = require("../context/OxyContext");
+var _useAccountQueries = require("../hooks/queries/useAccountQueries");
+var _useAccountMutations = require("../hooks/mutations/useAccountMutations");
 var _spacing = require("../constants/spacing");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -50,9 +52,7 @@ const AccountSettingsScreen = ({
 }) => {
   // Use useOxy() hook for OxyContext values
   const {
-    user: userFromContext,
     oxyServices,
-    isLoading: authLoading,
     isAuthenticated,
     activeSessionId
   } = (0, _OxyContext.useOxy)();
@@ -60,12 +60,23 @@ const AccountSettingsScreen = ({
     t
   } = (0, _useI18n.useI18n)();
   const normalizedTheme = (0, _themeUtils.normalizeTheme)(theme);
-  const updateUser = (0, _authStore.useAuthStore)(state => state.updateUser);
-  // Get user directly from store to ensure reactivity to avatar changes
-  const user = (0, _authStore.useAuthStore)(state => state.user) || userFromContext;
+
+  // Use TanStack Query for user data
+  const {
+    data: user,
+    isLoading: userLoading
+  } = (0, _useAccountQueries.useCurrentUser)({
+    enabled: isAuthenticated
+  });
+  const updateProfileMutation = (0, _useAccountMutations.useUpdateProfile)();
+  const uploadAvatarMutation = (0, _useAccountMutations.useUploadAvatar)();
+
+  // Fallback to store for backward compatibility
+  const userFromStore = (0, _authStore.useAuthStore)(state => state.user);
+  const finalUser = user || userFromStore;
   const [isLoading, setIsLoading] = (0, _react.useState)(false);
-  const [isSaving, setIsSaving] = (0, _react.useState)(false);
-  const [isUpdatingAvatar, setIsUpdatingAvatar] = (0, _react.useState)(false);
+  const isSaving = updateProfileMutation.isPending;
+  const isUpdatingAvatar = uploadAvatarMutation.isPending;
   const [optimisticAvatarId, setOptimisticAvatarId] = (0, _react.useState)(null);
   const scrollViewRef = (0, _react.useRef)(null);
   const avatarSectionRef = (0, _react.useRef)(null);
@@ -164,9 +175,9 @@ const AccountSettingsScreen = ({
 
   // Load user data - only reset fields when user actually changes (not just avatar)
   (0, _react.useEffect)(() => {
-    if (user) {
-      const currentUserId = user.id;
-      const currentAvatar = typeof user.avatar === 'string' ? user.avatar : '';
+    if (finalUser) {
+      const currentUserId = finalUser.id;
+      const currentAvatar = typeof finalUser.avatar === 'string' ? finalUser.avatar : '';
       const isNewUser = previousUserIdRef.current !== currentUserId;
       const isAvatarOnlyUpdate = !isNewUser && previousUserIdRef.current === currentUserId && previousAvatarRef.current !== currentAvatar && previousAvatarRef.current !== null;
       const shouldInitialize = !isInitializedRef.current || isNewUser;
@@ -174,28 +185,28 @@ const AccountSettingsScreen = ({
       // Only reset all fields if it's a new user or first load
       // Skip reset if it's just an avatar update
       if (shouldInitialize && !isAvatarOnlyUpdate) {
-        const userDisplayName = typeof user.name === 'string' ? user.name : user.name?.first || user.name?.full || '';
-        const userLastName = typeof user.name === 'object' ? user.name?.last || '' : '';
+        const userDisplayName = typeof finalUser.name === 'string' ? finalUser.name : finalUser.name?.first || finalUser.name?.full || '';
+        const userLastName = typeof finalUser.name === 'object' ? finalUser.name?.last || '' : '';
         setDisplayName(userDisplayName);
         setLastName(userLastName);
-        setUsername(user.username || '');
-        setEmail(user.email || '');
-        setBio(user.bio || '');
-        setLocation(user.location || '');
+        setUsername(finalUser.username || '');
+        setEmail(finalUser.email || '');
+        setBio(finalUser.bio || '');
+        setLocation(finalUser.location || '');
 
         // Handle locations - convert single location to array format
-        if (user.locations && Array.isArray(user.locations)) {
-          setLocations(user.locations.map((loc, index) => ({
+        if (finalUser.locations && Array.isArray(finalUser.locations)) {
+          setLocations(finalUser.locations.map((loc, index) => ({
             id: loc.id || `existing-${index}`,
             name: loc.name,
             label: loc.label,
             coordinates: loc.coordinates
           })));
-        } else if (user.location) {
+        } else if (finalUser.location) {
           // Convert single location string to array format
           setLocations([{
             id: 'existing-0',
-            name: user.location,
+            name: finalUser.location,
             label: 'Location'
           }]);
         } else {
@@ -203,16 +214,16 @@ const AccountSettingsScreen = ({
         }
 
         // Handle links - simple and direct like other fields
-        if (user.linksMetadata && Array.isArray(user.linksMetadata)) {
-          const urls = user.linksMetadata.map(l => l.url);
+        if (finalUser.linksMetadata && Array.isArray(finalUser.linksMetadata)) {
+          const urls = finalUser.linksMetadata.map(l => l.url);
           setLinks(urls);
-          const metadataWithIds = user.linksMetadata.map((link, index) => ({
+          const metadataWithIds = finalUser.linksMetadata.map((link, index) => ({
             ...link,
             id: link.id || `existing-${index}`
           }));
           setLinksMetadata(metadataWithIds);
-        } else if (Array.isArray(user.links)) {
-          const simpleLinks = user.links.map(l => typeof l === 'string' ? l : l.link).filter(Boolean);
+        } else if (Array.isArray(finalUser.links)) {
+          const simpleLinks = finalUser.links.map(l => typeof l === 'string' ? l : l.link).filter(Boolean);
           setLinks(simpleLinks);
           const linksWithMetadata = simpleLinks.map((url, index) => ({
             url,
@@ -222,12 +233,12 @@ const AccountSettingsScreen = ({
             id: `existing-${index}`
           }));
           setLinksMetadata(linksWithMetadata);
-        } else if (user.website) {
-          setLinks([user.website]);
+        } else if (finalUser.website) {
+          setLinks([finalUser.website]);
           setLinksMetadata([{
-            url: user.website,
-            title: user.website.replace(/^https?:\/\//, '').replace(/\/$/, ''),
-            description: `Link to ${user.website}`,
+            url: finalUser.website,
+            title: finalUser.website.replace(/^https?:\/\//, '').replace(/\/$/, ''),
+            description: `Link to ${finalUser.website}`,
             image: undefined,
             id: 'existing-0'
           }]);
@@ -255,7 +266,7 @@ const AccountSettingsScreen = ({
       previousUserIdRef.current = currentUserId;
       previousAvatarRef.current = currentAvatar;
     }
-  }, [user, avatarFileId, isUpdatingAvatar, optimisticAvatarId]);
+  }, [finalUser, avatarFileId, isUpdatingAvatar, optimisticAvatarId]);
 
   // Set initial editing field if provided via props (e.g., from navigation)
   // Use a ref to track if we've already set the initial field to avoid loops
@@ -312,47 +323,46 @@ const AccountSettingsScreen = ({
   }, []);
   const saveField = (0, _react.useCallback)(async field => {
     if (!field) return;
-    setIsSaving(true);
     try {
       switch (field) {
         case 'displayName':
-          await updateUser({
+          await updateProfileMutation.mutateAsync({
             name: {
               first: tempDisplayName,
               last: tempLastName
             }
-          }, oxyServices);
+          });
           setDisplayName(tempDisplayName);
           setLastName(tempLastName);
           break;
         case 'username':
-          await updateUser({
+          await updateProfileMutation.mutateAsync({
             username: tempUsername
-          }, oxyServices);
+          });
           setUsername(tempUsername);
           break;
         case 'email':
-          await updateUser({
+          await updateProfileMutation.mutateAsync({
             email: tempEmail
-          }, oxyServices);
+          });
           setEmail(tempEmail);
           break;
         case 'bio':
-          await updateUser({
+          await updateProfileMutation.mutateAsync({
             bio: tempBio
-          }, oxyServices);
+          });
           setBio(tempBio);
           break;
         case 'location':
-          await updateUser({
+          await updateProfileMutation.mutateAsync({
             locations: tempLocations
-          }, oxyServices);
+          });
           setLocations(tempLocations);
           break;
         case 'links':
-          await updateUser({
+          await updateProfileMutation.mutateAsync({
             linksMetadata: tempLinksWithMetadata
-          }, oxyServices);
+          });
           setLinksMetadata(tempLinksWithMetadata);
           setLinks(tempLinksWithMetadata.map(l => l.url));
           break;
@@ -360,11 +370,9 @@ const AccountSettingsScreen = ({
       setEditingField(null);
       _sonner.toast.success(t('editProfile.toasts.saved') || 'Saved');
     } catch (error) {
-      _sonner.toast.error(error?.message || t('editProfile.toasts.saveFailed') || 'Failed to save');
-    } finally {
-      setIsSaving(false);
+      // Error is already handled by mutation's onError
     }
-  }, [tempDisplayName, tempLastName, tempUsername, tempEmail, tempBio, tempLocations, tempLinksWithMetadata, updateUser, oxyServices, t]);
+  }, [tempDisplayName, tempLastName, tempUsername, tempEmail, tempBio, tempLocations, tempLinksWithMetadata, updateProfileMutation, t]);
 
   // Helper to get current value for a field
   const getFieldCurrentValue = (0, _react.useCallback)(field => {
@@ -418,9 +426,8 @@ const AccountSettingsScreen = ({
     }
   }, [initialSection, sectionYPositions]);
   const handleSave = async () => {
-    if (!user) return;
+    if (!finalUser) return;
     try {
-      setIsSaving(true);
       animateSaveButton(0.95); // Scale down slightly for animation
 
       const updates = {
@@ -443,10 +450,10 @@ const AccountSettingsScreen = ({
       }
 
       // Handle avatar
-      if (avatarFileId !== (typeof user.avatar === 'string' ? user.avatar : '')) {
+      if (avatarFileId !== (typeof finalUser.avatar === 'string' ? finalUser.avatar : '')) {
         updates.avatar = avatarFileId;
       }
-      await updateUser(updates, oxyServices);
+      await updateProfileMutation.mutateAsync(updates);
       _sonner.toast.success(t('editProfile.toasts.profileUpdated') || 'Profile updated successfully');
       animateSaveButton(1); // Scale back to normal
 
@@ -456,10 +463,8 @@ const AccountSettingsScreen = ({
         goBack();
       }
     } catch (error) {
-      _sonner.toast.error(error.message || t('editProfile.toasts.updateFailed') || 'Failed to update profile');
+      // Error is already handled by mutation's onError
       animateSaveButton(1); // Scale back to normal on error
-    } finally {
-      setIsSaving(false);
     }
   };
   const handleAvatarRemove = () => {
@@ -676,7 +681,7 @@ const AccountSettingsScreen = ({
   };
 
   // Memoize display name for avatar
-  const displayNameForAvatar = (0, _react.useMemo)(() => (0, _userUtils.getDisplayName)(user), [user]);
+  const displayNameForAvatar = (0, _react.useMemo)(() => (0, _userUtils.getDisplayName)(finalUser), [finalUser]);
 
   // Legacy renderEditingField function (fallback)
   const renderEditingField = type => {
@@ -1174,7 +1179,7 @@ const AccountSettingsScreen = ({
       })
     });
   };
-  if (isLoading || !isAuthenticated) {
+  if (userLoading || !isAuthenticated) {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
       style: [styles.container, {
         backgroundColor: themeStyles.backgroundColor,
@@ -1472,7 +1477,7 @@ const AccountSettingsScreen = ({
                 title: t('editProfile.items.previewProfile.title') || 'Preview Profile',
                 subtitle: t('editProfile.items.previewProfile.subtitle') || 'See how your profile looks to others',
                 onPress: () => navigate?.('Profile', {
-                  userId: user?.id
+                  userId: finalUser?.id
                 })
               }, {
                 id: 'privacy-settings',