rerender profile page after changes

Author: feliciagan

frontend/src/components/ChangePasswordModal/index.tsx

@@ -8,7 +8,7 @@ import { FAILED_PW_UPDATE_MESSAGE, SUCCESS_PW_UPDATE_MESSAGE } from '../../utils
 interface ChangePasswordModalProps {
   handleClose: () => void;
   userId: string;
-  onUpdate: (message: string, isSuccess: boolean) => void;
+  onUpdate: (isProfileEdit: boolean, message: string, isSuccess: boolean) => void;
 }
 
 const ChangePasswordModal = forwardRef<HTMLDivElement, ChangePasswordModalProps>((props, ref) => {
@@ -40,14 +40,14 @@ const ChangePasswordModal = forwardRef<HTMLDivElement, ChangePasswordModalProps>
           },
         });
       handleClose();
-      onUpdate(SUCCESS_PW_UPDATE_MESSAGE, true);
+      onUpdate(false, SUCCESS_PW_UPDATE_MESSAGE, true);
     } catch (error) {
       if (axios.isAxiosError(error)) {
         const message =
           error.response?.data.message || FAILED_PW_UPDATE_MESSAGE;
-        onUpdate(message, false);
+        onUpdate(false, message, false);
       } else {
-        onUpdate(FAILED_PW_UPDATE_MESSAGE, false);
+        onUpdate(false, FAILED_PW_UPDATE_MESSAGE, false);
       }
     }
   };

frontend/src/components/EditProfileModal/index.tsx

@@ -10,7 +10,7 @@ interface EditProfileModalProps {
   currLastName: string;
   currBiography?: string;
   userId: string;
-  onUpdate: (message: string, isSuccess: boolean) => void;
+  onUpdate: (isProfileEdit: boolean, message: string, isSuccess: boolean) => void;
 }
 
 const EditProfileModal = forwardRef<HTMLDivElement, EditProfileModalProps>((props, ref) => {
@@ -54,15 +54,15 @@ const EditProfileModal = forwardRef<HTMLDivElement, EditProfileModalProps>((prop
             },
         });
         handleClose();
-        onUpdate(SUCCESS_PROFILE_UPDATE_MESSAGE, true);
+        onUpdate(true, SUCCESS_PROFILE_UPDATE_MESSAGE, true);
     } catch (error) {
         console.error('Error:', error);
         if (axios.isAxiosError(error)) {
           const message =
             error.response?.data.message || FAILED_PROFILE_UPDATE_MESSAGE;
-          onUpdate(message, false);
+          onUpdate(true, message, false);
         } else {
-          onUpdate(FAILED_PROFILE_UPDATE_MESSAGE, false);
+          onUpdate(true, FAILED_PROFILE_UPDATE_MESSAGE, false);
         }
     }
   };

frontend/src/pages/Profile/index.tsx

@@ -30,6 +30,7 @@ const ProfilePage: React.FC = () => {
   const [changePasswordOpen, setChangePasswordOpen] = useState(false);
   const handleChangePasswordOpen = () => setChangePasswordOpen(true);
   const handleChangePasswordClose = () => setChangePasswordOpen(false);
+  const [isProfileChanged, setIsProfileChanged] = useState(false);
 
   const { userId } = useParams<{ userId: string }>();
   const [userProfile, setUserProfile] = useState<UserProfile | null>(null);
@@ -49,7 +50,7 @@ const ProfilePage: React.FC = () => {
       })
       .catch(() => setUserProfile(null));
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  }, [isProfileChanged]);
 
   if (!userProfile) {
     return (
@@ -60,9 +61,12 @@ const ProfilePage: React.FC = () => {
     );
   }
 
-  const notify = (message: string, isSuccess: boolean) => {
+  const notify = (isProfileEdit: boolean, message: string, isSuccess: boolean) => {
     if (isSuccess) {
       toast.success(message);
+      if (isProfileEdit) {
+        setIsProfileChanged(true);
+      }
     } else {
       toast.error(message);
     }