1 files changed, 49 insertions, 8 deletions
diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx
index 7afc3fbc..13db60a5 100644
--- a/src/components/profile/Content.tsx
+++ b/src/components/profile/Content.tsx
@@ -11,7 +11,7 @@ import {Moment} from '../moments';
 import ProfileBody from './ProfileBody';
 import ProfileCutout from './ProfileCutout';
 import ProfileHeader from './ProfileHeader';
-import {followOrUnfollowUser} from '../../services';
+import {followOrUnfollowUser, blockOrUnblockUser} from '../../services';
 
 interface ContentProps {
   y: Animated.Value<number>;
@@ -24,10 +24,12 @@ const Content: React.FC<ContentProps> = ({y, isProfileView}) => {
     ? React.useContext(ProfileContext)
     : React.useContext(AuthContext);
 
-  const {logout} = React.useContext(AuthContext);
   const {
+    logout,
     user: loggedInUser,
     updateFollowers: updateLoggedInUserFollowers,
+    blockedUsers,
+    updateBlockedUsers,
   } = React.useContext(AuthContext);
 
   /**
@@ -36,7 +38,8 @@ const Content: React.FC<ContentProps> = ({y, isProfileView}) => {
   const [imagesMap, setImagesMap] = useState<Map<string, MomentType[]>>(
     new Map(),
   );
-  const [followed, setFollowed] = React.useState<boolean>(false);
+  const [isFollowed, setIsFollowed] = React.useState<boolean>(false);
+  const [isBlocked, setIsBlocked] = React.useState<boolean>(false);
 
   /**
    * If own profile is being viewed then do not show the follow button.
@@ -81,11 +84,24 @@ const Content: React.FC<ContentProps> = ({y, isProfileView}) => {
     const isActuallyFollowed = followers.some(
       (follower) => follower.username === loggedInUser.username,
     );
-    if (followed != isActuallyFollowed) {
-      setFollowed(isActuallyFollowed);
+    if (isFollowed != isActuallyFollowed) {
+      setIsFollowed(isActuallyFollowed);
     }
   }, [followers]);
 
+  useEffect(() => {
+    if (!userId) {
+      return;
+    }
+
+    const isActuallyBlocked = blockedUsers.some(
+      (cur_user) => user.username === cur_user.username,
+    );
+    if (isBlocked != isActuallyBlocked) {
+      setIsBlocked(isActuallyBlocked);
+    }
+  }, [blockedUsers]);
+
   /**
    * Handles a click on the follow / unfollow button.
    * updateFollowers and updateLoggedInUerFollowers to make sure that we update followers list / count for both the users in context.
@@ -100,10 +116,33 @@ const Content: React.FC<ContentProps> = ({y, isProfileView}) => {
       loggedInUser.userId,
       userId,
       token,
-      followed,
+      isFollowed,
+    );
+    if (isUpdatedSuccessful) {
+      setIsFollowed(!isFollowed);
+      updateFollowers(true);
+      updateLoggedInUserFollowers(true);
+    }
+  };
+
+  /**
+   * Handles a click on the block / unblock button.
+   */
+  const handleBlockUnblock = async () => {
+    const token = await AsyncStorage.getItem('token');
+    if (!token) {
+      logout();
+      return;
+    }
+    const isUpdatedSuccessful = await blockOrUnblockUser(
+      loggedInUser.userId,
+      userId,
+      token,
+      isBlocked,
     );
     if (isUpdatedSuccessful) {
-      setFollowed(!followed);
+      setIsBlocked(!isBlocked);
+      updateBlockedUsers(true);
       updateFollowers(true);
       updateLoggedInUserFollowers(true);
     }
@@ -126,8 +165,10 @@ const Content: React.FC<ContentProps> = ({y, isProfileView}) => {
           onLayout,
           isProfileView,
           isOwnProfile,
-          followed,
+          isFollowed,
           handleFollowUnfollow,
+          isBlocked,
+          handleBlockUnblock,
         }}
       />
       <TaggsBar {...{y, profileBodyHeight, isProfileView}} />