2 files changed, 37 insertions, 20 deletions

diff --git a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx
index 78b810d1..b9dee55a 100644
--- a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx
+++ b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx
@@ -45,15 +45,6 @@ const SuggestedPeopleScreen: React.FC = () => {
   const [page, setPage] = useState(0);
   const [refreshing, setRefreshing] = useState(false);
   const [hideStatusBar, setHideStatusBar] = useState(false);
-  // const [onFirstPage, setOnFirstPage] = useState(false);
-
-  // DEBUG
-  // useEffect(() => {
-  //   console.log(
-  //     'people updated',
-  //     people.map((ppl) => ppl.user.username),
-  //   );
-  // }, [people]);
 
   // loads data and append it to users based on current page
   useEffect(() => {
@@ -85,7 +76,6 @@ const SuggestedPeopleScreen: React.FC = () => {
       }
     };
     await Promise.all(users.map((user) => loadUserData(user)));
-    // console.log('done loading');
   };
   const resetPage = () => {
     const reset = async () => {
@@ -130,14 +120,11 @@ const SuggestedPeopleScreen: React.FC = () => {
     const firstItem = item.index === 0;
     return (
       <>
-        {/* {statusBar} */}
-        {/* <StatusBar barStyle={'light-content'} hidden={item.index !== 0} /> */}
         <StatusBar barStyle={'light-content'} hidden={hideStatusBar} />
         <Image
           source={{
             uri: data.suggested_people_url,
           }}
-          // source={require('../../assets/images/sarah_miller_full.jpeg')}
           style={styles.image}
         />
         <View style={styles.mainContainer}>
@@ -175,7 +162,6 @@ const SuggestedPeopleScreen: React.FC = () => {
     <SuggestedPeopleOnboardingStackScreen />
   ) : (
     <>
-      {/* <StatusBar barStyle={'light-content'} hidden/> */}
       <FlatList
         data={people}
         renderItem={(item) => <SPBody item={item} />}
@@ -202,8 +188,8 @@ const styles = StyleSheet.create({
     paddingBottom: '20%',
     justifyContent: 'space-between',
     alignSelf: 'center',
-    marginHorizontal: '5%',
   },
+  marginManager: {marginHorizontal: '5%'},
   image: {
     position: 'absolute',
     width: SCREEN_WIDTH,
diff --git a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx
index 1b30c72f..b49761a0 100644
--- a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx
+++ b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx
@@ -1,4 +1,5 @@
-import React, {useState} from 'react';
+import {useNavigation} from '@react-navigation/native';
+import React, {useEffect, useState} from 'react';
 import {
   Alert,
   Image,
@@ -10,19 +11,41 @@ import {Text} from 'react-native-animatable';
 import {TouchableOpacity} from 'react-native-gesture-handler';
 import ImagePicker from 'react-native-image-crop-picker';
 import {SafeAreaView} from 'react-native-safe-area-context';
-import {useDispatch} from 'react-redux';
+import {useDispatch, useSelector} from 'react-redux';
 import {TaggSquareButton} from '../../components';
 import TaggLoadingIndicator from '../../components/common/TaggLoadingIndicator';
 import {SP_HEIGHT, SP_WIDTH} from '../../constants';
-import {ERROR_UPLOAD} from '../../constants/strings';
-import {sendSuggestedPeoplePhoto} from '../../services';
+import {ERROR_UPLOAD, SUCCESS_PIC_UPLOAD} from '../../constants/strings';
+import {
+  getSuggestedPeopleProfile,
+  sendSuggestedPeoplePhoto,
+} from '../../services';
 import {uploadedSuggestedPeoplePhoto} from '../../store/actions';
+import {RootState} from '../../store/rootReducer';
 import {normalize, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
 
-const SuggestedPeopleUploadPictureScreen: React.FC = () => {
+const SuggestedPeopleUploadPictureScreen: React.FC = ({route}) => {
+  const {goTo} = route.params;
   const [image, setImage] = useState<string | undefined>(undefined);
   const [loading, setLoading] = useState(false);
   const dispatch = useDispatch();
+  const navigation = useNavigation();
+  const {userId: loggedInUserId} = useSelector(
+    (state: RootState) => state.user.user,
+  );
+
+  useEffect(() => {
+    const loadData = async () => {
+      const response = await getSuggestedPeopleProfile(loggedInUserId);
+      if (response) {
+        setImage(response.suggested_people_url);
+      }
+    };
+    // if we're in edit SP, attempt to load current sp image
+    if (goTo === 'Profile') {
+      loadData();
+    }
+  }, []);
 
   const openImagePicker = () => {
     ImagePicker.openPicker({
@@ -58,6 +81,14 @@ const SuggestedPeopleUploadPictureScreen: React.FC = () => {
       }
     }
     setLoading(false);
+
+    // Navigated back to Profile if user is editing their Suggested People Picture
+    if (goTo === 'Profile') {
+      navigation.goBack();
+      setTimeout(() => {
+        Alert.alert(SUCCESS_PIC_UPLOAD);
+      }, 500);
+    }
   };
 
   return (