1 files changed, 23 insertions, 19 deletions

diff --git a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx
index 195604a3..0a0d352b 100644
--- a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx
+++ b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx
@@ -1,6 +1,6 @@
 import AsyncStorage from '@react-native-community/async-storage';
 import {useFocusEffect, useNavigation} from '@react-navigation/native';
-import React, {useCallback, useEffect, useState} from 'react';
+import React, {useCallback, useEffect, useRef, useState} from 'react';
 import {
   FlatList,
   ListRenderItemInfo,
@@ -29,6 +29,7 @@ import {
 import {
   fetchUserX,
   getUserAsProfilePreviewType,
+  handleOpenSocialUrlOnBrowser,
   normalize,
   SCREEN_HEIGHT,
   SCREEN_WIDTH,
@@ -55,14 +56,24 @@ const SuggestedPeopleScreen: React.FC = () => {
   const [people, setPeople] = useState<SuggestedPeopleDataType[]>([]);
   const [page, setPage] = useState(0);
   const [refreshing, setRefreshing] = useState(false);
+  const [shouldResetData, setShouldResetData] = useState(false);
   const [hideStatusBar, setHideStatusBar] = useState(false);
 
   // loads data and append it to users based on current page
   useEffect(() => {
-    // console.log('current page', page);
-    loadMore(false);
+    loadMore();
   }, [page]);
 
+  useEffect(() => {
+    if (shouldResetData) {
+      if (page !== 0) {
+        setPage(0);
+      } else {
+        loadMore();
+      }
+    }
+  }, [shouldResetData]);
+
   useFocusEffect(() => {
     const appendSelf = async () => {
       AsyncStorage.getItem('suggested_people_url').then((image) => {
@@ -83,34 +94,30 @@ const SuggestedPeopleScreen: React.FC = () => {
     };
     if (suggested_people_linked < 2) {
       if (people.length > 1 && people[0].user.id !== loggedInUserId) {
+        console.log('appending self');
         appendSelf();
       }
     }
   });
 
-  const loadMore = async (resetData: boolean) => {
+  const loadMore = async () => {
     const loadNextPage = async () =>
       await getSuggestedPeople(
         SP_PAGE_SIZE,
-        resetData ? 0 : page * SP_PAGE_SIZE,
+        shouldResetData ? 0 : page * SP_PAGE_SIZE,
       );
 
     loadNextPage().then((newUsers) => {
       loadUserDataToStore(newUsers.map((ppl) => ppl.user));
-      let newPeople = [];
-      if (resetData) {
-        newPeople = newUsers;
-        setPage(0);
-      } else {
-        newPeople = people.concat(newUsers);
-      }
-      setPeople(newPeople);
+      setPeople(shouldResetData ? newUsers : people.concat(newUsers));
+      setShouldResetData(false);
     });
   };
 
   const loadUserDataToStore = async (users: ProfilePreviewType[]) => {
     const loadUserData = async (user: ProfilePreviewType) => {
       if (!userXInStore(state, screenType, user.id)) {
+        console.log(user.username, 'not in store, loading to store');
         await fetchUserX(
           dispatch,
           {userId: user.id, username: user.username},
@@ -120,10 +127,11 @@ const SuggestedPeopleScreen: React.FC = () => {
     };
     await Promise.all(users.map((user) => loadUserData(user)));
   };
-  const resetPage = () => {
+
+  const onRefresh = () => {
     const reset = async () => {
       await dispatch(resetScreenType(screenType));
-      loadMore(true);
+      setShouldResetData(true);
     };
     setRefreshing(true);
     reset().then(() => {
@@ -131,10 +139,6 @@ const SuggestedPeopleScreen: React.FC = () => {
     });
   };
 
-  const onRefresh = useCallback(() => {
-    resetPage();
-  }, []);
-
   useFocusEffect(
     useCallback(() => {
       const navigateToAnimatedTutorial = () => {