aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/assets/ionicons/suggested-outline.svg1
-rw-r--r--src/assets/ionicons/suggested-outlined.pngbin0 -> 178994 bytes
-rw-r--r--src/assets/socials/instagram-icon-white-bg.pngbin531448 -> 26491 bytes
-rw-r--r--src/components/common/FriendsButton.tsx1
-rw-r--r--src/components/common/GenericMoreInfoDrawer.tsx8
-rw-r--r--src/components/common/SocialIcon.tsx7
-rw-r--r--src/components/profile/Content.tsx5
-rw-r--r--src/components/profile/ProfileMoreInfoDrawer.tsx27
-rw-r--r--src/components/taggs/Tagg.tsx32
-rw-r--r--src/components/taggs/TaggsBar.tsx10
-rw-r--r--src/constants/strings.ts1
-rw-r--r--src/routes/main/MainStackNavigator.tsx3
-rw-r--r--src/routes/main/MainStackScreen.tsx9
-rw-r--r--src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackNavigator.tsx4
-rw-r--r--src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen.tsx1
-rw-r--r--src/screens/suggestedPeople/SuggestedPeopleScreen.tsx16
-rw-r--r--src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx41
-rw-r--r--src/services/SuggestedPeopleService.ts28
-rw-r--r--src/store/actions/user.ts4
-rw-r--r--src/store/reducers/userReducer.ts3
20 files changed, 138 insertions, 63 deletions
diff --git a/src/assets/ionicons/suggested-outline.svg b/src/assets/ionicons/suggested-outline.svg
new file mode 100644
index 00000000..05a957f7
--- /dev/null
+++ b/src/assets/ionicons/suggested-outline.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><defs><style>.cls-1{fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:1.41px;}</style></defs><circle class="cls-1" cx="10" cy="10" r="9.18"/><path d="M16.7,10a6.71,6.71,0,0,1-.09,1.1,3.76,3.76,0,0,1-.9,2,2.84,2.84,0,0,1-3.06.6,2.15,2.15,0,0,1-1.32-1.39c-.15-.65.1-1.36-.16-2a1.29,1.29,0,1,0-2.33,1.08,1.34,1.34,0,0,0,1.78.54v1.69a2.89,2.89,0,0,1-2.91-4.6,3,3,0,0,1,3.2-1,3,3,0,0,1,2,2.69A2.62,2.62,0,0,0,13,12a1,1,0,0,0,1.39.09,3.09,3.09,0,0,0,.63-2.68,5.24,5.24,0,0,0-1.15-2.7,5.11,5.11,0,0,0-.45-.48,5.22,5.22,0,0,0-5-1.12A5.21,5.21,0,0,0,5,8.87a5.11,5.11,0,0,0,6.52,6v1.66a6.87,6.87,0,0,1-6.77-2.35A6.85,6.85,0,0,1,3.41,8.72,6.66,6.66,0,0,1,6.59,4.21a6.86,6.86,0,0,1,2.29-.84,6.85,6.85,0,0,1,5.85,1.87A6.89,6.89,0,0,1,16.7,10Z"/><path d="M10,5.4a1.11,1.11,0,1,0,1.11,1.11A1.11,1.11,0,0,0,10,5.4ZM10,7a.51.51,0,1,1,.51-.51A.51.51,0,0,1,10,7Z"/></svg> \ No newline at end of file
diff --git a/src/assets/ionicons/suggested-outlined.png b/src/assets/ionicons/suggested-outlined.png
new file mode 100644
index 00000000..f0ab5297
--- /dev/null
+++ b/src/assets/ionicons/suggested-outlined.png
Binary files differ
diff --git a/src/assets/socials/instagram-icon-white-bg.png b/src/assets/socials/instagram-icon-white-bg.png
index 2d6940ca..b150931f 100644
--- a/src/assets/socials/instagram-icon-white-bg.png
+++ b/src/assets/socials/instagram-icon-white-bg.png
Binary files differ
diff --git a/src/components/common/FriendsButton.tsx b/src/components/common/FriendsButton.tsx
index a1e107c5..46421bd1 100644
--- a/src/components/common/FriendsButton.tsx
+++ b/src/components/common/FriendsButton.tsx
@@ -128,6 +128,7 @@ const styles = StyleSheet.create({
row: {
flex: 1,
flexDirection: 'row',
+ justifyContent: 'space-between',
},
});
diff --git a/src/components/common/GenericMoreInfoDrawer.tsx b/src/components/common/GenericMoreInfoDrawer.tsx
index a23d7736..ff32a464 100644
--- a/src/components/common/GenericMoreInfoDrawer.tsx
+++ b/src/components/common/GenericMoreInfoDrawer.tsx
@@ -11,7 +11,7 @@ import {
import {useSafeAreaInsets} from 'react-native-safe-area-context';
import {BottomDrawer} from '.';
import {TAGG_LIGHT_BLUE} from '../../constants';
-import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
+import {normalize, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
// conforms the JSX onPress attribute type
type OnPressHandler = (event: GestureResponderEvent) => void;
@@ -75,8 +75,10 @@ const styles = StyleSheet.create({
borderTopRightRadius: 20,
},
panelButtonTitle: {
- fontSize: 18,
- fontWeight: 'bold',
+ fontSize: 17,
+ fontWeight: '600',
+ lineHeight: normalize(20),
+ letterSpacing: normalize(0.1),
},
icon: {
height: 25,
diff --git a/src/components/common/SocialIcon.tsx b/src/components/common/SocialIcon.tsx
index 8216b6ff..cb3b926b 100644
--- a/src/components/common/SocialIcon.tsx
+++ b/src/components/common/SocialIcon.tsx
@@ -1,11 +1,10 @@
import React from 'react';
import {Image} from 'react-native';
-import {ScreenType} from '../../types';
interface SocialIconProps {
social: string;
style: object;
- screenType: ScreenType;
+ whiteRing: boolean | undefined;
}
/**
* An image component that returns the <Image> of the icon for a specific social media platform.
@@ -13,12 +12,12 @@ interface SocialIconProps {
const SocialIcon: React.FC<SocialIconProps> = ({
social: social,
style: style,
- screenType,
+ whiteRing,
}) => {
switch (social) {
case 'Instagram':
var icon = require('../../assets/socials/instagram-icon.png');
- if (screenType === ScreenType.SuggestedPeople) {
+ if (whiteRing) {
icon = require('../../assets/socials/instagram-icon-white-bg.png');
}
break;
diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx
index 86d40f1b..e75ae949 100644
--- a/src/components/profile/Content.tsx
+++ b/src/components/profile/Content.tsx
@@ -309,9 +309,7 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
isBlocked,
}}
/>
- <View style={styles.taggsbarContainer}>
- <TaggsBar {...{y, profileBodyHeight, userXId, screenType}} />
- </View>
+ <TaggsBar {...{y, profileBodyHeight, userXId, screenType}} />
<View style={styles.momentsContainer}>
{userXId && moments.length === 0 && (
<View style={styles.plusIconContainer}>
@@ -418,7 +416,6 @@ const styles = StyleSheet.create({
color: 'gray',
marginVertical: '8%',
},
- taggsbarContainer: {paddingHorizontal: 15},
});
export default Content;
diff --git a/src/components/profile/ProfileMoreInfoDrawer.tsx b/src/components/profile/ProfileMoreInfoDrawer.tsx
index daa83eb3..90f5da48 100644
--- a/src/components/profile/ProfileMoreInfoDrawer.tsx
+++ b/src/components/profile/ProfileMoreInfoDrawer.tsx
@@ -1,10 +1,11 @@
import {useNavigation} from '@react-navigation/native';
import React from 'react';
-import {StyleSheet, TouchableOpacity} from 'react-native';
+import {Alert, Image, StyleSheet, TouchableOpacity} from 'react-native';
import {useSelector} from 'react-redux';
import MoreIcon from '../../assets/icons/more_horiz-24px.svg';
import PersonOutline from '../../assets/ionicons/person-outline.svg';
import {TAGG_DARK_BLUE, TAGG_LIGHT_BLUE} from '../../constants';
+import {ERROR_ATTEMPT_EDIT_SP} from '../../constants/strings';
import {RootState} from '../../store/rootreducer';
import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
import {GenericMoreInfoDrawer} from '../common';
@@ -25,6 +26,9 @@ const ProfileMoreInfoDrawer: React.FC<ProfileMoreInfoDrawerProps> = (props) => {
user: {userId, username},
} = useSelector((state: RootState) => state.user);
const isOwnProfile = !userXId || userXName === username;
+ const {suggested_people_linked} = useSelector(
+ (state: RootState) => state.user.profile,
+ );
const goToEditProfile = () => {
navigation.push('EditProfile', {
@@ -34,6 +38,15 @@ const ProfileMoreInfoDrawer: React.FC<ProfileMoreInfoDrawerProps> = (props) => {
setIsOpen(false);
};
+ const goToUpdateSPProfile = () => {
+ if (suggested_people_linked === 0) {
+ Alert.alert(ERROR_ATTEMPT_EDIT_SP);
+ } else {
+ navigation.push('UpdateSPPicture');
+ setIsOpen(false);
+ }
+ };
+
const onBlockUnblock = () => {
handleBlockUnblock(() => setIsOpen(false));
};
@@ -66,6 +79,14 @@ const ProfileMoreInfoDrawer: React.FC<ProfileMoreInfoDrawerProps> = (props) => {
showIcons={true}
textColor={'black'}
buttons={[
+ [
+ 'Edit Suggested',
+ goToUpdateSPProfile,
+ <Image
+ source={require('../../assets/ionicons/suggested-outlined.png')}
+ style={styles.image}
+ />,
+ ],
['Edit Profile', goToEditProfile, <PersonOutline color="black" />],
]}
/>
@@ -109,6 +130,10 @@ const styles = StyleSheet.create({
right: '5%',
zIndex: 1,
},
+ image: {
+ width: 25,
+ height: 25,
+ },
});
export default ProfileMoreInfoDrawer;
diff --git a/src/components/taggs/Tagg.tsx b/src/components/taggs/Tagg.tsx
index 66694132..547a77cb 100644
--- a/src/components/taggs/Tagg.tsx
+++ b/src/components/taggs/Tagg.tsx
@@ -1,5 +1,5 @@
import {useNavigation} from '@react-navigation/native';
-import React, {Fragment, useContext, useEffect, useState} from 'react';
+import React, {Fragment, useState} from 'react';
import {Alert, Linking, StyleSheet, TouchableOpacity, View} from 'react-native';
import PurpleRingPlus from '../../assets/icons/purple_ring+.svg';
import PurpleRing from '../../assets/icons/purple_ring.svg';
@@ -17,7 +17,7 @@ import {
registerNonIntegratedSocialLink,
} from '../../services';
import {SmallSocialIcon, SocialIcon, SocialLinkModal} from '../common';
-import {ScreenType, UserType} from '../../types';
+import {UserType} from '../../types';
import {
ERROR_LINK,
ERROR_UNABLE_TO_FIND_PROFILE,
@@ -33,7 +33,7 @@ interface TaggProps {
setSocialDataNeedUpdate: (social: string, username: string) => void;
userXId: string | undefined;
user: UserType;
- screenType: ScreenType;
+ whiteRing: boolean | undefined;
}
const Tagg: React.FC<TaggProps> = ({
@@ -44,7 +44,7 @@ const Tagg: React.FC<TaggProps> = ({
setSocialDataNeedUpdate,
userXId,
user,
- screenType,
+ whiteRing,
}) => {
const navigation = useNavigation();
const [modalVisible, setModalVisible] = useState(false);
@@ -100,8 +100,9 @@ const Tagg: React.FC<TaggProps> = ({
const pickTheRightRingHere = () => {
if (youMayPass) {
- if (screenType === ScreenType.SuggestedPeople)
+ if (whiteRing) {
return <WhiteRing width={TAGG_RING_DIM} height={TAGG_RING_DIM} />;
+ }
if (social === 'Tagg') {
return <Ring width={TAGG_RING_DIM} height={TAGG_RING_DIM} />;
} else {
@@ -141,23 +142,14 @@ const Tagg: React.FC<TaggProps> = ({
setModalVisible={setModalVisible}
completionCallback={linkNonIntegratedSocial}
/>
- <View
- style={
- screenType === ScreenType.SuggestedPeople
- ? styles.spcontainer
- : styles.container
- }>
+ <View style={whiteRing ? styles.spcontainer : styles.container}>
<TouchableOpacity
style={styles.iconTap}
onPress={modalOrAuthBrowserOrPass}>
- <SocialIcon
- style={styles.icon}
- social={social}
- screenType={screenType}
- />
+ <SocialIcon style={styles.icon} social={social} whiteRing />
{pickTheRightRingHere()}
</TouchableOpacity>
- {screenType !== ScreenType.SuggestedPeople && (
+ {!whiteRing && (
<View style={styles.smallIconContainer}>
<SmallSocialIcon
style={[
@@ -182,13 +174,15 @@ const styles = StyleSheet.create({
spcontainer: {
justifyContent: 'space-between',
alignItems: 'center',
- marginRight: 34,
+ marginRight: 15,
+ marginLeft: 19,
height: normalize(60),
},
container: {
justifyContent: 'space-between',
alignItems: 'center',
- marginRight: 34,
+ marginRight: 15,
+ marginLeft: 15,
height: normalize(90),
},
iconTap: {
diff --git a/src/components/taggs/TaggsBar.tsx b/src/components/taggs/TaggsBar.tsx
index c23f56a9..05ee18bb 100644
--- a/src/components/taggs/TaggsBar.tsx
+++ b/src/components/taggs/TaggsBar.tsx
@@ -20,12 +20,14 @@ interface TaggsBarProps {
profileBodyHeight: number;
userXId: string | undefined;
screenType: ScreenType;
+ whiteRing: boolean | undefined;
}
const TaggsBar: React.FC<TaggsBarProps> = ({
y,
profileBodyHeight,
userXId,
screenType,
+ whiteRing,
}) => {
let [taggs, setTaggs] = useState<Object[]>([]);
let [taggsNeedUpdate, setTaggsNeedUpdate] = useState(true);
@@ -72,12 +74,12 @@ const TaggsBar: React.FC<TaggsBarProps> = ({
isIntegrated={INTEGRATED_SOCIAL_LIST.indexOf(social) !== -1}
setTaggsNeedUpdate={setTaggsNeedUpdate}
setSocialDataNeedUpdate={handleSocialUpdate}
- screenType={screenType}
+ whiteRing={whiteRing ? whiteRing : undefined}
/>,
);
i++;
}
- if (!userXId && screenType !== ScreenType.SuggestedPeople) {
+ if (!userXId && !whiteRing) {
for (let social of unlinkedSocials) {
new_taggs.push(
<Tagg
@@ -89,7 +91,7 @@ const TaggsBar: React.FC<TaggsBarProps> = ({
setSocialDataNeedUpdate={handleSocialUpdate}
userXId={userXId}
user={user}
- screenType={screenType}
+ whiteRing={whiteRing ? whiteRing : undefined}
/>,
);
i++;
@@ -126,7 +128,7 @@ const TaggsBar: React.FC<TaggsBarProps> = ({
return taggs.length > 0 ? (
<View
style={
- screenType === ScreenType.SuggestedPeople
+ whiteRing
? [styles.spContainer]
: [styles.container, {shadowOpacity, paddingTop}]
}>
diff --git a/src/constants/strings.ts b/src/constants/strings.ts
index 0965bad0..5ae19e9c 100644
--- a/src/constants/strings.ts
+++ b/src/constants/strings.ts
@@ -4,6 +4,7 @@
// replace with: $1\t$3
export const ADD_COMMENT_TEXT = (username?: string) => username ? `Reply to ${username}` : 'Add a comment...'
export const COMING_SOON_MSG = 'Creating more fun things for you, surprises coming soon 😉';
+export const ERROR_ATTEMPT_EDIT_SP = 'Can\'t let you do that yet! Please onboard Suggested People first!';
export const ERROR_AUTHENTICATION = 'An error occurred during authentication. Please login again!';
export const ERROR_CATEGORY_CREATION = 'There was a problem creating your categories. Please refresh and try again.';
export const ERROR_CATEGORY_UPDATE = 'There was a problem updating your categories. Please refresh and try again';
diff --git a/src/routes/main/MainStackNavigator.tsx b/src/routes/main/MainStackNavigator.tsx
index 9771c1e6..901dd993 100644
--- a/src/routes/main/MainStackNavigator.tsx
+++ b/src/routes/main/MainStackNavigator.tsx
@@ -69,6 +69,9 @@ export type MainStackParams = {
AnimatedTutorial: {
screenType: ScreenType;
};
+ UpdateSPPicture: {
+ goTo: string;
+ };
};
export const MainStack = createStackNavigator<MainStackParams>();
diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx
index 0b762dff..aec860f2 100644
--- a/src/routes/main/MainStackScreen.tsx
+++ b/src/routes/main/MainStackScreen.tsx
@@ -21,6 +21,7 @@ import {
SearchScreen,
SocialMediaTaggs,
SuggestedPeopleScreen,
+ SuggestedPeopleUploadPictureScreen,
} from '../../screens';
import {ScreenType} from '../../types';
import {AvatarHeaderHeight, SCREEN_WIDTH} from '../../utils';
@@ -222,6 +223,14 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => {
...headerBarOptions('white', 'Edit Profile'),
}}
/>
+ <MainStack.Screen
+ name="UpdateSPPicture"
+ component={SuggestedPeopleUploadPictureScreen}
+ initialParams={{goTo: 'Profile'}}
+ options={{
+ ...headerBarOptions('white', ''),
+ }}
+ />
</MainStack.Navigator>
);
};
diff --git a/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackNavigator.tsx b/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackNavigator.tsx
index e957e48c..85249034 100644
--- a/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackNavigator.tsx
+++ b/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackNavigator.tsx
@@ -2,7 +2,9 @@ import {createStackNavigator} from '@react-navigation/stack';
export type SuggestedPeopleOnboardingStackParams = {
WelcomeScreen: undefined;
- UploadPicture: undefined;
+ UploadPicture: {
+ goTo: string;
+ };
};
export const SuggestedPeopleOnboardingStack = createStackNavigator<SuggestedPeopleOnboardingStackParams>();
diff --git a/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen.tsx b/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen.tsx
index 970982c4..75764a15 100644
--- a/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen.tsx
+++ b/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen.tsx
@@ -25,6 +25,7 @@ const SuggestedPeopleOnboardingStackScreen: React.FC = () => {
<SuggestedPeopleOnboardingStack.Screen
name="UploadPicture"
component={SuggestedPeopleUploadPictureScreen}
+ initialParams={{goTo: 'SP Preview'}}
options={{
...headerBarOptions('white', ''),
}}
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 (
diff --git a/src/services/SuggestedPeopleService.ts b/src/services/SuggestedPeopleService.ts
index 332e2f9a..34a31662 100644
--- a/src/services/SuggestedPeopleService.ts
+++ b/src/services/SuggestedPeopleService.ts
@@ -2,17 +2,17 @@ import AsyncStorage from '@react-native-community/async-storage';
import {
EDIT_PROFILE_ENDPOINT,
SP_UPDATE_PICTURE_ENDPOINT,
- SP_USERS_ENDPOINT,
+ SP_USERS_ENDPOINT
} from '../constants';
-import {SuggestedPeopleDataType} from '../types';
+import { SuggestedPeopleDataType } from '../types';
export const sendSuggestedPeopleLinked = async (
userId: string,
- stage: number,
+ suggested_people_linked: number,
) => {
try {
const request = new FormData();
- request.append('suggested_people_linked', stage);
+ request.append('suggested_people_linked', suggested_people_linked);
const endpoint = EDIT_PROFILE_ENDPOINT + `${userId}/`;
const token = await AsyncStorage.getItem('token');
let response = await fetch(endpoint, {
@@ -76,3 +76,23 @@ export const getSuggestedPeople = async (limit: number, offset: number) => {
return [];
}
};
+
+export const getSuggestedPeopleProfile = async (userId: string) => {
+ try {
+ const token = await AsyncStorage.getItem('token');
+ const response = await fetch(SP_USERS_ENDPOINT + userId + '/', {
+ method: 'GET',
+ headers: {
+ Authorization: 'Token ' + token,
+ },
+ });
+ if (response.status === 200) {
+ const data: SuggestedPeopleDataType = await response.json();
+ return data;
+ } else {
+ return undefined;
+ }
+ } catch (error) {
+ console.log('Error retrieving SP info');
+ return undefined;
+ }
diff --git a/src/store/actions/user.ts b/src/store/actions/user.ts
index ef134dc5..3511dcf3 100644
--- a/src/store/actions/user.ts
+++ b/src/store/actions/user.ts
@@ -172,7 +172,7 @@ export const uploadedSuggestedPeoplePhoto = (): ThunkAction<
try {
dispatch({
type: setSuggestedPeopleLinked.type,
- payload: {stage: 1},
+ payload: {suggested_people_linked: 1},
});
} catch (error) {
console.log(error);
@@ -191,7 +191,7 @@ export const suggestedPeopleAnimatedTutorialFinished = (
// update store first, assume request is successful
dispatch({
type: setSuggestedPeopleLinked.type,
- payload: {stage: 2},
+ payload: {suggested_people_linked: 2},
});
// need to tell the server that the stage is now 2
return await sendSuggestedPeopleLinked(userId, 2);
diff --git a/src/store/reducers/userReducer.ts b/src/store/reducers/userReducer.ts
index 5203fa3c..ea9294ec 100644
--- a/src/store/reducers/userReducer.ts
+++ b/src/store/reducers/userReducer.ts
@@ -47,7 +47,8 @@ const userDataSlice = createSlice({
},
setSuggestedPeopleLinked: (state, action) => {
- state.profile.suggested_people_linked = action.payload.stage;
+ state.profile.suggested_people_linked =
+ action.payload.suggested_people_linked;
},
setIsOnboardedUser: (state, action) => {