updated helper function, cleaned up code, prevent friends navigation

7 files changed, 59 insertions, 63 deletions

diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx
index 9fb6f79b..779e0525 100644
--- a/src/components/profile/Content.tsx
+++ b/src/components/profile/Content.tsx
@@ -38,22 +38,23 @@ import TaggsBar from '../taggs/TaggsBar';
 
 const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
   const dispatch = useDispatch();
-
-  const {user = NO_USER, profile = NO_PROFILE} = userXId
-    ? useSelector((state: RootState) => state.userX[screenType][userXId])
-    : useSelector((state: RootState) => state.user);
+  const state: RootState = useStore().getState();
+  const {
+    user = NO_USER,
+    profile = NO_PROFILE,
+  } = useSelector((state: RootState) =>
+    userXId ? state.userX[screenType][userXId] : state.user,
+  );
   const {blockedUsers = EMPTY_PROFILE_PREVIEW_LIST} = useSelector(
     (state: RootState) => state.blocked,
   );
   const {user: loggedInUser = NO_USER} = useSelector(
     (state: RootState) => state.user,
   );
-  const state = useStore().getState();
 
   /**
    * States
    */
-  const [isFriend, setIsFriend] = useState<boolean>(false);
   const [isBlocked, setIsBlocked] = useState<boolean>(false);
   const [profileBodyHeight, setProfileBodyHeight] = useState(0);
   const [shouldBounce, setShouldBounce] = useState<boolean>(true);
@@ -87,10 +88,6 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
     }
   }, [blockedUsers, user]);
 
-  useEffect(() => {
-    setIsFriend(profile.friendship_status === 'friends');
-  }, [profile.friendship_status]);
-
   /**
    * Handles a click on the block / unblock button.
    * loadFriends updates friends list for the logged in user
@@ -151,16 +148,11 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
           onLayout,
           userXId,
           screenType,
-          isFriend,
           handleBlockUnblock,
           isBlocked,
         }}
       />
-      {canViewProfile(
-        loggedInUser.userId === user.userId,
-        profile.is_private,
-        isFriend,
-      ) ? (
+      {canViewProfile(state, userXId, screenType) ? (
         <>
           <TaggsBar
             {...{y, profileBodyHeight, userXId, screenType}}
diff --git a/src/components/profile/FriendsCount.tsx b/src/components/profile/FriendsCount.tsx
index 851dbc3b..a733823f 100644
--- a/src/components/profile/FriendsCount.tsx
+++ b/src/components/profile/FriendsCount.tsx
@@ -3,9 +3,9 @@ import {View, Text, StyleSheet, ViewProps} from 'react-native';
 import {TouchableOpacity} from 'react-native-gesture-handler';
 import {useNavigation} from '@react-navigation/native';
 import {RootState} from '../../store/rootReducer';
-import {useSelector} from 'react-redux';
+import {useSelector, useStore} from 'react-redux';
 import {ScreenType} from '../../types';
-import {normalize} from '../../utils';
+import {canViewProfile, canViewProfileFoo, normalize} from '../../utils';
 
 interface FriendsCountProps extends ViewProps {
   userXId: string | undefined;
@@ -17,9 +17,9 @@ const FriendsCount: React.FC<FriendsCountProps> = ({
   userXId,
   screenType,
 }) => {
-  const {friends} = userXId
-    ? useSelector((state: RootState) => state.userX[screenType][userXId])
-    : useSelector((state: RootState) => state.friends);
+  const {friends} = useSelector((state: RootState) =>
+    userXId ? state.userX[screenType][userXId] : state.friends,
+  );
   const count = friends ? friends.length : 0;
 
   const displayedCount: string =
@@ -32,15 +32,18 @@ const FriendsCount: React.FC<FriendsCountProps> = ({
       : `${count / 1e6}m`;
 
   const navigation = useNavigation();
+  const state: RootState = useStore().getState();
 
   return (
     <TouchableOpacity
-      style={{right: '20%'}}
       onPress={() =>
-        navigation.push('FriendsListScreen', {
+        navigation.navigate('FriendsListScreen', {
           userXId,
           screenType,
         })
+      }
+      disabled={
+        !canViewProfile(state, userXId, screenType) || friends.length === 0
       }>
       <View style={[styles.container, style]}>
         <Text style={styles.count}>{displayedCount}</Text>
diff --git a/src/components/profile/ProfileBody.tsx b/src/components/profile/ProfileBody.tsx
index 3aef5990..b49e71a3 100644
--- a/src/components/profile/ProfileBody.tsx
+++ b/src/components/profile/ProfileBody.tsx
@@ -2,21 +2,17 @@ import React from 'react';
 import {LayoutChangeEvent, Linking, StyleSheet, Text, View} from 'react-native';
 import {normalize} from 'react-native-elements';
 import {useDispatch, useSelector, useStore} from 'react-redux';
-import {
-  TAGG_DARK_BLUE,
-  TAGG_LIGHT_BLUE,
-  TOGGLE_BUTTON_TYPE,
-} from '../../constants';
+import {TAGG_DARK_BLUE, TOGGLE_BUTTON_TYPE} from '../../constants';
 import {
   acceptFriendRequest,
   declineFriendRequest,
   updateUserXFriends,
   updateUserXProfileAllScreens,
 } from '../../store/actions';
-import {NO_PROFILE, NO_USER} from '../../store/initialStates';
+import {NO_PROFILE} from '../../store/initialStates';
 import {RootState} from '../../store/rootReducer';
 import {ScreenType} from '../../types';
-import {getUserAsProfilePreviewType, SCREEN_WIDTH} from '../../utils';
+import {getUserAsProfilePreviewType} from '../../utils';
 import {FriendsButton} from '../common';
 import ToggleButton from './ToggleButton';
 
@@ -34,12 +30,8 @@ const ProfileBody: React.FC<ProfileBodyProps> = ({
   userXId,
   screenType,
 }) => {
-  const {profile = NO_PROFILE, user} = userXId
-    ? useSelector((state: RootState) => state.userX[screenType][userXId])
-    : useSelector((state: RootState) => state.user);
-
-  const {user: loggedInUser = NO_USER} = useSelector(
-    (state: RootState) => state.user,
+  const {profile = NO_PROFILE, user} = useSelector((state: RootState) =>
+    userXId ? state.userX[screenType][userXId] : state.user,
   );
 
   const {
diff --git a/src/components/profile/ProfileHeader.tsx b/src/components/profile/ProfileHeader.tsx
index e5bd9d93..b5dda399 100644
--- a/src/components/profile/ProfileHeader.tsx
+++ b/src/components/profile/ProfileHeader.tsx
@@ -1,7 +1,6 @@
 import React, {useState} from 'react';
 import {StyleSheet, Text, View} from 'react-native';
 import {useSelector} from 'react-redux';
-import UniversityIcon from './UniversityIcon';
 import {PROFILE_CUTOUT_TOP_Y} from '../../constants';
 import {RootState} from '../../store/rootreducer';
 import {ScreenType} from '../../types';
@@ -9,6 +8,7 @@ import {normalize} from '../../utils';
 import Avatar from './Avatar';
 import FriendsCount from './FriendsCount';
 import ProfileMoreInfoDrawer from './ProfileMoreInfoDrawer';
+import UniversityIcon from './UniversityIcon';
 
 type ProfileHeaderProps = {
   userXId: string | undefined;
@@ -26,9 +26,9 @@ const ProfileHeader: React.FC<ProfileHeaderProps> = ({
   const {
     profile: {name = '', university_class = 2021} = {},
     user: {username: userXName = ''},
-  } = userXId
-    ? useSelector((state: RootState) => state.userX[screenType][userXId])
-    : useSelector((state: RootState) => state.user);
+  } = useSelector((state: RootState) =>
+    userXId ? state.userX[screenType][userXId] : state.user,
+  );
   const [drawerVisible, setDrawerVisible] = useState(false);
   const [firstName, lastName] = [...name.split(' ')];
   return (
diff --git a/src/services/UserFriendsService.ts b/src/services/UserFriendsService.ts
index da39380f..5c41e988 100644
--- a/src/services/UserFriendsService.ts
+++ b/src/services/UserFriendsService.ts
@@ -1,17 +1,12 @@
-//Abstracted common friends api calls out here
-
 import AsyncStorage from '@react-native-community/async-storage';
 import {Alert} from 'react-native';
-import {ContactType, FriendshipStatusType} from '../types';
 import {
   FRIENDS_ENDPOINT,
   INVITE_FRIEND_ENDPOINT,
   USERS_FROM_CONTACTS_ENDPOINT,
 } from '../constants';
-import {
-  ERROR_SOMETHING_WENT_WRONG,
-  ERROR_SOMETHING_WENT_WRONG_REFRESH,
-} from '../constants/strings';
+import {ERROR_SOMETHING_WENT_WRONG_REFRESH} from '../constants/strings';
+import {ContactType, FriendshipStatusType} from '../types';
 
 export const loadFriends = async (userId: string, token: string) => {
   try {
diff --git a/src/store/actions/userFriends.ts b/src/store/actions/userFriends.ts
index 9da3cb4a..4183d0f6 100644
--- a/src/store/actions/userFriends.ts
+++ b/src/store/actions/userFriends.ts
@@ -1,25 +1,24 @@
-import {getTokenOrLogout, userXInStore} from '../../utils';
-import {RootState} from '../rootReducer';
-import {
-  FriendshipStatusType,
-  ProfilePreviewType,
-  ScreenType,
-  UserType,
-} from '../../types/types';
+import {Action, ThunkAction} from '@reduxjs/toolkit';
 import {
   acceptFriendRequestService,
   addFriendService,
+  deleteFriendshipService,
   friendOrUnfriendUser,
   loadFriends,
-  deleteFriendshipService,
 } from '../../services';
-import {Action, ThunkAction} from '@reduxjs/toolkit';
 import {
-  userFriendsFetched,
+  FriendshipStatusType,
+  ProfilePreviewType,
+  ScreenType,
+  UserType,
+} from '../../types/types';
+import {getTokenOrLogout, userXInStore} from '../../utils';
+import {
   updateFriends,
+  userFriendsFetched,
   userXFriendshipEdited,
-  userLoggedIn,
 } from '../reducers';
+import {RootState} from '../rootReducer';
 
 export const loadFriendsData = (
   userId: string,
diff --git a/src/utils/users.ts b/src/utils/users.ts
index 6cb6d46c..0b8a0582 100644
--- a/src/utils/users.ts
+++ b/src/utils/users.ts
@@ -176,9 +176,24 @@ export const defaultUserProfile = () => {
 };
 
 export const canViewProfile = (
-  ownProfile: boolean,
-  isPrivate: boolean,
-  isFriend: boolean,
+  state: RootState,
+  userXId: string | undefined,
+  screenType: ScreenType,
 ) => {
-  return ownProfile || isFriend || !isPrivate;
+  // own profile
+  if (!userXId || state.user.user.userId === userXId) {
+    return true;
+  }
+  // not private
+  if (!(userXId && state.userX[screenType][userXId].profile.is_private)) {
+    return true;
+  }
+  // is friend
+  if (
+    userXId &&
+    state.userX[screenType][userXId].profile.friendship_status === 'friends'
+  ) {
+    return true;
+  }
+  return false;
 };