From 8472bdc50711f7931fbc9a7139c173cad7400fc4 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Wed, 17 Feb 2021 18:44:54 -0500 Subject: updated instagram icon size --- src/assets/socials/instagram-icon-white-bg.png | Bin 531448 -> 26491 bytes 1 file changed, 0 insertions(+), 0 deletions(-) (limited to 'src') diff --git a/src/assets/socials/instagram-icon-white-bg.png b/src/assets/socials/instagram-icon-white-bg.png index 2d6940ca..b150931f 100644 Binary files a/src/assets/socials/instagram-icon-white-bg.png and b/src/assets/socials/instagram-icon-white-bg.png differ -- cgit v1.2.3-70-g09d2 From 5e3be59bce1017c536d9bf232000296d541b2b73 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Thu, 18 Feb 2021 11:30:21 -0800 Subject: justify changed for alignment --- src/components/common/FriendsButton.tsx | 1 + 1 file changed, 1 insertion(+) (limited to 'src') 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', }, }); -- cgit v1.2.3-70-g09d2 From 7695e36491fdd076cd4f388c7258f3bf52cf0a10 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Fri, 19 Feb 2021 11:31:48 -0800 Subject: fixed --- src/components/profile/Content.tsx | 12 +++----- src/components/taggs/Tagg.tsx | 6 ++-- src/routes/Routes.tsx | 2 +- .../suggestedPeople/SuggestedPeopleScreen.tsx | 32 ++++++++++++---------- 4 files changed, 27 insertions(+), 25 deletions(-) (limited to 'src') diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx index 86d40f1b..d047cc2f 100644 --- a/src/components/profile/Content.tsx +++ b/src/components/profile/Content.tsx @@ -109,10 +109,9 @@ const Content: React.FC = ({y, userXId, screenType}) => { const [isStageOnePromptClosed, setIsStageOnePromptClosed] = useState( false, ); - const [ - isStageThreePromptClosed, - setIsStageThreePromptClosed, - ] = useState(false); + const [isStageThreePromptClosed, setIsStageThreePromptClosed] = useState< + boolean + >(false); const onRefresh = useCallback(() => { const refrestState = async () => { @@ -309,9 +308,7 @@ const Content: React.FC = ({y, userXId, screenType}) => { isBlocked, }} /> - - - + {userXId && moments.length === 0 && ( @@ -418,7 +415,6 @@ const styles = StyleSheet.create({ color: 'gray', marginVertical: '8%', }, - taggsbarContainer: {paddingHorizontal: 15}, }); export default Content; diff --git a/src/components/taggs/Tagg.tsx b/src/components/taggs/Tagg.tsx index 66694132..1ab09055 100644 --- a/src/components/taggs/Tagg.tsx +++ b/src/components/taggs/Tagg.tsx @@ -182,13 +182,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/routes/Routes.tsx b/src/routes/Routes.tsx index 1cbc9bc5..bf137445 100644 --- a/src/routes/Routes.tsx +++ b/src/routes/Routes.tsx @@ -39,7 +39,7 @@ const Routes: React.FC = () => { }); if (!userId) { - userLogin(dispatch, {userId: '', username: ''}); + // userLogin(dispatch, {userId: '', username: ''}); } else { SplashScreen.hide(); } diff --git a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx index 3437cd85..129ea1e8 100644 --- a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx +++ b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx @@ -59,18 +59,20 @@ const SuggestedPeopleScreen: React.FC = () => { Suggested People - - - {firstName} - {username} - - console.log('Call add friend function')}> - - {'Add Friend'} + + + + {firstName} + {username} - + console.log('Call add friend function')}> + + {'Add Friend'} + + + { profileBodyHeight={0} screenType={ScreenType.SuggestedPeople} /> - + + + @@ -95,12 +99,12 @@ const SuggestedPeopleScreen: React.FC = () => { const styles = StyleSheet.create({ mainContainer: { flexDirection: 'column', - width: SCREEN_WIDTH * 0.9, + width: SCREEN_WIDTH, height: isIPhoneX() ? SCREEN_HEIGHT * 0.85 : SCREEN_HEIGHT * 0.88, justifyContent: 'space-between', alignSelf: 'center', - marginHorizontal: '5%', }, + marginManager: {marginHorizontal: '5%'}, image: { position: 'absolute', width: SCREEN_WIDTH, -- cgit v1.2.3-70-g09d2 From 69aa9b8bffbdf5e3ad062c29316e2a01c8a7d384 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Fri, 19 Feb 2021 12:53:18 -0800 Subject: Added option to bottom drawer on profile screen --- src/assets/ionicons/suggested-outlined.png | Bin 0 -> 178994 bytes src/components/profile/ProfileMoreInfoDrawer.tsx | 19 ++++++++++++++++++- 2 files changed, 18 insertions(+), 1 deletion(-) create mode 100644 src/assets/ionicons/suggested-outlined.png (limited to 'src') diff --git a/src/assets/ionicons/suggested-outlined.png b/src/assets/ionicons/suggested-outlined.png new file mode 100644 index 00000000..f0ab5297 Binary files /dev/null and b/src/assets/ionicons/suggested-outlined.png differ diff --git a/src/components/profile/ProfileMoreInfoDrawer.tsx b/src/components/profile/ProfileMoreInfoDrawer.tsx index daa83eb3..99b55685 100644 --- a/src/components/profile/ProfileMoreInfoDrawer.tsx +++ b/src/components/profile/ProfileMoreInfoDrawer.tsx @@ -1,6 +1,6 @@ import {useNavigation} from '@react-navigation/native'; import React from 'react'; -import {StyleSheet, TouchableOpacity} from 'react-native'; +import {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'; @@ -34,6 +34,11 @@ const ProfileMoreInfoDrawer: React.FC = (props) => { setIsOpen(false); }; + const goToUpdateSPProfile = () => { + navigation.push('UpdateSPPicture'); + setIsOpen(false); + }; + const onBlockUnblock = () => { handleBlockUnblock(() => setIsOpen(false)); }; @@ -66,6 +71,14 @@ const ProfileMoreInfoDrawer: React.FC = (props) => { showIcons={true} textColor={'black'} buttons={[ + [ + 'Edit Suggested', + goToUpdateSPProfile, + , + ], ['Edit Profile', goToEditProfile, ], ]} /> @@ -109,6 +122,10 @@ const styles = StyleSheet.create({ right: '5%', zIndex: 1, }, + image: { + width: 20, + height: 20, + }, }); export default ProfileMoreInfoDrawer; -- cgit v1.2.3-70-g09d2 From fda38b87676d9ecc7adb889bc1fb52b3b6286a0e Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Fri, 19 Feb 2021 12:53:52 -0800 Subject: Added screen to main stack nav --- src/routes/main/MainStackNavigator.tsx | 3 +++ src/routes/main/MainStackScreen.tsx | 6 ++++++ 2 files changed, 9 insertions(+) (limited to 'src') 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(); diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx index 0b762dff..8811de3e 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,11 @@ const MainStackScreen: React.FC = ({route}) => { ...headerBarOptions('white', 'Edit Profile'), }} /> + ); }; -- cgit v1.2.3-70-g09d2 From bba853571d95da9ad828f26825200e7df70cf243 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Fri, 19 Feb 2021 12:54:38 -0800 Subject: Updated suggested stack with additional parameter --- .../SuggestedPeopleOnboardingStackNavigator.tsx | 4 +++- .../SuggestedPeopleOnboardingStackScreen.tsx | 1 + 2 files changed, 4 insertions(+), 1 deletion(-) (limited to 'src') 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(); 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 = () => { Date: Fri, 19 Feb 2021 12:56:56 -0800 Subject: conditionally navigating after uploading picture --- .../SuggestedPeopleUploadPictureScreen.tsx | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) (limited to 'src') diff --git a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx index 1b30c72f..5b616c4a 100644 --- a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx +++ b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx @@ -1,3 +1,4 @@ +import { useNavigation } from '@react-navigation/native'; import React, {useState} from 'react'; import { Alert, @@ -19,10 +20,12 @@ import {sendSuggestedPeoplePhoto} from '../../services'; import {uploadedSuggestedPeoplePhoto} from '../../store/actions'; 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(undefined); const [loading, setLoading] = useState(false); const dispatch = useDispatch(); + const navigation = useNavigation(); const openImagePicker = () => { ImagePicker.openPicker({ @@ -52,12 +55,16 @@ const SuggestedPeopleUploadPictureScreen: React.FC = () => { if (image) { const success = await sendSuggestedPeoplePhoto(image); if (success) { - dispatch(uploadedSuggestedPeoplePhoto()); + const suggested_people_linked = 1; + dispatch(uploadedSuggestedPeoplePhoto(suggested_people_linked)); } else { Alert.alert(ERROR_UPLOAD); } } setLoading(false); + if (goTo === 'Profile') { + navigation.goBack(); + } }; return ( -- cgit v1.2.3-70-g09d2 From 00c5763a4533b1105ffa4d04921906e0687aa201 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Fri, 19 Feb 2021 12:57:27 -0800 Subject: Minor change for better understanding of code --- src/screens/suggestedPeople/AnimatedTutorial.tsx | 8 +++++++- src/services/SuggestedPeopleService.ts | 4 ++-- src/store/actions/user.ts | 16 ++++++++-------- src/store/reducers/userReducer.ts | 2 +- 4 files changed, 18 insertions(+), 12 deletions(-) (limited to 'src') diff --git a/src/screens/suggestedPeople/AnimatedTutorial.tsx b/src/screens/suggestedPeople/AnimatedTutorial.tsx index bf34ba6e..d827829c 100644 --- a/src/screens/suggestedPeople/AnimatedTutorial.tsx +++ b/src/screens/suggestedPeople/AnimatedTutorial.tsx @@ -15,7 +15,13 @@ const AnimatedTutorial: React.FC = () => { const {user} = useSelector((state: RootState) => state.user); const handleCloseAnimationTutorial = async () => { - dispatch(suggestedPeopleAnimatedTutorialFinished(user.userId)); + const suggested_people_linked = 2; + dispatch( + suggestedPeopleAnimatedTutorialFinished( + user.userId, + suggested_people_linked, + ), + ); navigation.pop(); }; return ( diff --git a/src/services/SuggestedPeopleService.ts b/src/services/SuggestedPeopleService.ts index 7e43c3b6..5dbf1963 100644 --- a/src/services/SuggestedPeopleService.ts +++ b/src/services/SuggestedPeopleService.ts @@ -3,11 +3,11 @@ import {EDIT_PROFILE_ENDPOINT, SP_UPDATE_PICTURE} from '../constants'; 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, { diff --git a/src/store/actions/user.ts b/src/store/actions/user.ts index ef134dc5..30dfe8ba 100644 --- a/src/store/actions/user.ts +++ b/src/store/actions/user.ts @@ -163,16 +163,15 @@ export const logout = (): ThunkAction< } }; -export const uploadedSuggestedPeoplePhoto = (): ThunkAction< - Promise, - RootState, - unknown, - Action -> => async (dispatch) => { +export const uploadedSuggestedPeoplePhoto = ( + suggested_people_linked: number, +): ThunkAction, RootState, unknown, Action> => async ( + dispatch, +) => { try { dispatch({ type: setSuggestedPeopleLinked.type, - payload: {stage: 1}, + payload: suggested_people_linked, }); } catch (error) { console.log(error); @@ -181,6 +180,7 @@ export const uploadedSuggestedPeoplePhoto = (): ThunkAction< export const suggestedPeopleAnimatedTutorialFinished = ( userId: string, + suggested_people_linked: number, ): ThunkAction< Promise, RootState, @@ -194,7 +194,7 @@ export const suggestedPeopleAnimatedTutorialFinished = ( payload: {stage: 2}, }); // need to tell the server that the stage is now 2 - return await sendSuggestedPeopleLinked(userId, 2); + return await sendSuggestedPeopleLinked(userId, suggested_people_linked); } catch (error) { console.log('Error while updating suggested people linked state: ', error); } diff --git a/src/store/reducers/userReducer.ts b/src/store/reducers/userReducer.ts index 5203fa3c..5653d26d 100644 --- a/src/store/reducers/userReducer.ts +++ b/src/store/reducers/userReducer.ts @@ -47,7 +47,7 @@ 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) => { -- cgit v1.2.3-70-g09d2 From 6df3c098816b865932b74f514732bba698731809 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Fri, 19 Feb 2021 13:26:42 -0800 Subject: comment imp --- .../suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx | 2 ++ 1 file changed, 2 insertions(+) (limited to 'src') diff --git a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx index 5b616c4a..f16146ad 100644 --- a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx +++ b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx @@ -62,6 +62,8 @@ const SuggestedPeopleUploadPictureScreen: React.FC = ({route}) => { } } setLoading(false); + + // Navigated back to Profile if user is editing their Suggested People Picture if (goTo === 'Profile') { navigation.goBack(); } -- cgit v1.2.3-70-g09d2 From bd2df22d84c1c685802356fef52c8f26c44c188d Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Fri, 19 Feb 2021 14:29:00 -0800 Subject: restyled to match figma --- src/assets/ionicons/suggested-outline.svg | 1 + src/components/common/GenericMoreInfoDrawer.tsx | 7 +++++-- src/components/profile/ProfileMoreInfoDrawer.tsx | 7 ++++--- src/screens/suggestedPeople/SuggestedPeopleScreen.tsx | 2 +- 4 files changed, 11 insertions(+), 6 deletions(-) create mode 100644 src/assets/ionicons/suggested-outline.svg (limited to 'src') 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 @@ + \ No newline at end of file diff --git a/src/components/common/GenericMoreInfoDrawer.tsx b/src/components/common/GenericMoreInfoDrawer.tsx index a23d7736..b91c38c8 100644 --- a/src/components/common/GenericMoreInfoDrawer.tsx +++ b/src/components/common/GenericMoreInfoDrawer.tsx @@ -8,6 +8,7 @@ import { ViewProps, ViewStyle, } from 'react-native'; +import { normalize } from 'react-native-elements'; import {useSafeAreaInsets} from 'react-native-safe-area-context'; import {BottomDrawer} from '.'; import {TAGG_LIGHT_BLUE} from '../../constants'; @@ -75,8 +76,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/profile/ProfileMoreInfoDrawer.tsx b/src/components/profile/ProfileMoreInfoDrawer.tsx index 99b55685..f9cd81a7 100644 --- a/src/components/profile/ProfileMoreInfoDrawer.tsx +++ b/src/components/profile/ProfileMoreInfoDrawer.tsx @@ -1,9 +1,10 @@ import {useNavigation} from '@react-navigation/native'; import React from 'react'; -import {Image, StyleSheet, TouchableOpacity} from 'react-native'; +import {Image, StyleSheet, TouchableOpacity, View} 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 SuggestedOutline from '../../assets/ionicons/suggested-outline.svg'; import {TAGG_DARK_BLUE, TAGG_LIGHT_BLUE} from '../../constants'; import {RootState} from '../../store/rootreducer'; import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils'; @@ -123,8 +124,8 @@ const styles = StyleSheet.create({ zIndex: 1, }, image: { - width: 20, - height: 20, + width: 25, + height: 25, }, }); diff --git a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx index 3437cd85..69aa6c87 100644 --- a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx +++ b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx @@ -78,7 +78,7 @@ const SuggestedPeopleScreen: React.FC = () => { profileBodyHeight={0} screenType={ScreenType.SuggestedPeople} /> - + {/* */} -- cgit v1.2.3-70-g09d2 From 921cf232551ea6e04bc2d845805f4b59419df085 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Fri, 19 Feb 2021 22:04:46 -0800 Subject: white ring on profile screen fixed --- src/components/common/SocialIcon.tsx | 7 +++--- src/components/taggs/Tagg.tsx | 26 ++++++++-------------- src/components/taggs/TaggsBar.tsx | 11 +++++---- .../suggestedPeople/SuggestedPeopleScreen.tsx | 1 + 4 files changed, 20 insertions(+), 25 deletions(-) (limited to 'src') 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 of the icon for a specific social media platform. @@ -13,12 +12,12 @@ interface SocialIconProps { const SocialIcon: React.FC = ({ 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/taggs/Tagg.tsx b/src/components/taggs/Tagg.tsx index 66694132..50651f74 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 = ({ @@ -44,7 +44,7 @@ const Tagg: React.FC = ({ setSocialDataNeedUpdate, userXId, user, - screenType, + whiteRing, }) => { const navigation = useNavigation(); const [modalVisible, setModalVisible] = useState(false); @@ -100,8 +100,9 @@ const Tagg: React.FC = ({ const pickTheRightRingHere = () => { if (youMayPass) { - if (screenType === ScreenType.SuggestedPeople) + if (whiteRing) { return ; + } if (social === 'Tagg') { return ; } else { @@ -141,23 +142,14 @@ const Tagg: React.FC = ({ setModalVisible={setModalVisible} completionCallback={linkNonIntegratedSocial} /> - + - + {pickTheRightRingHere()} - {screenType !== ScreenType.SuggestedPeople && ( + {!whiteRing && ( = ({ y, profileBodyHeight, userXId, screenType, + whiteRing, }) => { let [taggs, setTaggs] = useState([]); let [taggsNeedUpdate, setTaggsNeedUpdate] = useState(true); @@ -61,6 +63,7 @@ const TaggsBar: React.FC = ({ ); let new_taggs = []; let i = 0; + console.log('whiteRing in taggsbar: ', whiteRing); for (let social of linkedSocials) { new_taggs.push( = ({ 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( = ({ setSocialDataNeedUpdate={handleSocialUpdate} userXId={userXId} user={user} - screenType={screenType} + whiteRing ={whiteRing ? whiteRing : undefined} />, ); i++; @@ -126,7 +129,7 @@ const TaggsBar: React.FC = ({ return taggs.length > 0 ? ( diff --git a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx index 3437cd85..c81c4f8c 100644 --- a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx +++ b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx @@ -77,6 +77,7 @@ const SuggestedPeopleScreen: React.FC = () => { userXId={undefined} profileBodyHeight={0} screenType={ScreenType.SuggestedPeople} + whiteRing={true} /> -- cgit v1.2.3-70-g09d2 From 064437a278cf368038c79816319e076d477397e4 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Sat, 20 Feb 2021 10:31:14 -0500 Subject: fixed issues --- src/components/profile/Content.tsx | 7 ++++--- src/routes/Routes.tsx | 2 +- 2 files changed, 5 insertions(+), 4 deletions(-) (limited to 'src') diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx index d047cc2f..e75ae949 100644 --- a/src/components/profile/Content.tsx +++ b/src/components/profile/Content.tsx @@ -109,9 +109,10 @@ const Content: React.FC = ({y, userXId, screenType}) => { const [isStageOnePromptClosed, setIsStageOnePromptClosed] = useState( false, ); - const [isStageThreePromptClosed, setIsStageThreePromptClosed] = useState< - boolean - >(false); + const [ + isStageThreePromptClosed, + setIsStageThreePromptClosed, + ] = useState(false); const onRefresh = useCallback(() => { const refrestState = async () => { diff --git a/src/routes/Routes.tsx b/src/routes/Routes.tsx index bf137445..1cbc9bc5 100644 --- a/src/routes/Routes.tsx +++ b/src/routes/Routes.tsx @@ -39,7 +39,7 @@ const Routes: React.FC = () => { }); if (!userId) { - // userLogin(dispatch, {userId: '', username: ''}); + userLogin(dispatch, {userId: '', username: ''}); } else { SplashScreen.hide(); } -- cgit v1.2.3-70-g09d2 From a2cd0be38858241b00956a5aa5715b3213084db0 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Sat, 20 Feb 2021 10:44:24 -0500 Subject: linting and removed logging --- src/components/taggs/TaggsBar.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'src') diff --git a/src/components/taggs/TaggsBar.tsx b/src/components/taggs/TaggsBar.tsx index aaf9a531..05ee18bb 100644 --- a/src/components/taggs/TaggsBar.tsx +++ b/src/components/taggs/TaggsBar.tsx @@ -63,7 +63,6 @@ const TaggsBar: React.FC = ({ ); let new_taggs = []; let i = 0; - console.log('whiteRing in taggsbar: ', whiteRing); for (let social of linkedSocials) { new_taggs.push( = ({ setSocialDataNeedUpdate={handleSocialUpdate} userXId={userXId} user={user} - whiteRing ={whiteRing ? whiteRing : undefined} + whiteRing={whiteRing ? whiteRing : undefined} />, ); i++; -- cgit v1.2.3-70-g09d2 From f099df4589515da84a62c16d284bdee058ea5454 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Sat, 20 Feb 2021 11:56:32 -0500 Subject: check if onboarded, added header, loads current sp image --- src/components/profile/ProfileMoreInfoDrawer.tsx | 15 ++++++--- src/constants/api.ts | 1 + src/constants/strings.ts | 1 + src/routes/main/MainStackScreen.tsx | 3 ++ src/screens/suggestedPeople/AnimatedTutorial.tsx | 8 +---- .../SuggestedPeopleUploadPictureScreen.tsx | 36 +++++++++++++++++----- src/services/SuggestedPeopleService.ts | 28 ++++++++++++++++- src/store/actions/user.ts | 18 +++++------ src/store/reducers/userReducer.ts | 3 +- src/types/types.ts | 15 +++++++++ 10 files changed, 99 insertions(+), 29 deletions(-) (limited to 'src') diff --git a/src/components/profile/ProfileMoreInfoDrawer.tsx b/src/components/profile/ProfileMoreInfoDrawer.tsx index f9cd81a7..90f5da48 100644 --- a/src/components/profile/ProfileMoreInfoDrawer.tsx +++ b/src/components/profile/ProfileMoreInfoDrawer.tsx @@ -1,11 +1,11 @@ import {useNavigation} from '@react-navigation/native'; import React from 'react'; -import {Image, StyleSheet, TouchableOpacity, View} 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 SuggestedOutline from '../../assets/ionicons/suggested-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'; @@ -26,6 +26,9 @@ const ProfileMoreInfoDrawer: React.FC = (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', { @@ -36,8 +39,12 @@ const ProfileMoreInfoDrawer: React.FC = (props) => { }; const goToUpdateSPProfile = () => { - navigation.push('UpdateSPPicture'); - setIsOpen(false); + if (suggested_people_linked === 0) { + Alert.alert(ERROR_ATTEMPT_EDIT_SP); + } else { + navigation.push('UpdateSPPicture'); + setIsOpen(false); + } }; const onBlockUnblock = () => { diff --git a/src/constants/api.ts b/src/constants/api.ts index 215dadc0..6e2b28ec 100644 --- a/src/constants/api.ts +++ b/src/constants/api.ts @@ -35,6 +35,7 @@ export const COMMENT_THREAD_ENDPOINT: string = API_URL + 'reply/'; // Suggested People export const SP_UPDATE_PICTURE: string = API_URL + 'suggested_people/update_picture/'; +export const SP_BASE_ENDPOINT: string = API_URL + 'suggested_people/'; // Register as FCM device export const FCM_ENDPOINT: string = API_URL + 'fcm/'; 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/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx index 8811de3e..aec860f2 100644 --- a/src/routes/main/MainStackScreen.tsx +++ b/src/routes/main/MainStackScreen.tsx @@ -227,6 +227,9 @@ const MainStackScreen: React.FC = ({route}) => { name="UpdateSPPicture" component={SuggestedPeopleUploadPictureScreen} initialParams={{goTo: 'Profile'}} + options={{ + ...headerBarOptions('white', ''), + }} /> ); diff --git a/src/screens/suggestedPeople/AnimatedTutorial.tsx b/src/screens/suggestedPeople/AnimatedTutorial.tsx index d827829c..bf34ba6e 100644 --- a/src/screens/suggestedPeople/AnimatedTutorial.tsx +++ b/src/screens/suggestedPeople/AnimatedTutorial.tsx @@ -15,13 +15,7 @@ const AnimatedTutorial: React.FC = () => { const {user} = useSelector((state: RootState) => state.user); const handleCloseAnimationTutorial = async () => { - const suggested_people_linked = 2; - dispatch( - suggestedPeopleAnimatedTutorialFinished( - user.userId, - suggested_people_linked, - ), - ); + dispatch(suggestedPeopleAnimatedTutorialFinished(user.userId)); navigation.pop(); }; return ( diff --git a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx index f16146ad..b49761a0 100644 --- a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx +++ b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx @@ -1,5 +1,5 @@ -import { useNavigation } from '@react-navigation/native'; -import React, {useState} from 'react'; +import {useNavigation} from '@react-navigation/native'; +import React, {useEffect, useState} from 'react'; import { Alert, Image, @@ -11,13 +11,17 @@ 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 = ({route}) => { @@ -26,6 +30,22 @@ const SuggestedPeopleUploadPictureScreen: React.FC = ({route}) => { 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({ @@ -55,8 +75,7 @@ const SuggestedPeopleUploadPictureScreen: React.FC = ({route}) => { if (image) { const success = await sendSuggestedPeoplePhoto(image); if (success) { - const suggested_people_linked = 1; - dispatch(uploadedSuggestedPeoplePhoto(suggested_people_linked)); + dispatch(uploadedSuggestedPeoplePhoto()); } else { Alert.alert(ERROR_UPLOAD); } @@ -66,6 +85,9 @@ const SuggestedPeopleUploadPictureScreen: React.FC = ({route}) => { // Navigated back to Profile if user is editing their Suggested People Picture if (goTo === 'Profile') { navigation.goBack(); + setTimeout(() => { + Alert.alert(SUCCESS_PIC_UPLOAD); + }, 500); } }; diff --git a/src/services/SuggestedPeopleService.ts b/src/services/SuggestedPeopleService.ts index 5dbf1963..525c68b1 100644 --- a/src/services/SuggestedPeopleService.ts +++ b/src/services/SuggestedPeopleService.ts @@ -1,5 +1,10 @@ import AsyncStorage from '@react-native-community/async-storage'; -import {EDIT_PROFILE_ENDPOINT, SP_UPDATE_PICTURE} from '../constants'; +import { + EDIT_PROFILE_ENDPOINT, + SP_BASE_ENDPOINT, + SP_UPDATE_PICTURE, +} from '../constants'; +import {SuggestedPeopleDataType} from '../types'; export const sendSuggestedPeopleLinked = async ( userId: string, @@ -48,3 +53,24 @@ export const sendSuggestedPeoplePhoto = async (photoUri: string) => { return false; } }; + +export const getSuggestedPeopleProfile = async (userId: string) => { + try { + const token = await AsyncStorage.getItem('token'); + const response = await fetch(SP_BASE_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 30dfe8ba..3511dcf3 100644 --- a/src/store/actions/user.ts +++ b/src/store/actions/user.ts @@ -163,15 +163,16 @@ export const logout = (): ThunkAction< } }; -export const uploadedSuggestedPeoplePhoto = ( - suggested_people_linked: number, -): ThunkAction, RootState, unknown, Action> => async ( - dispatch, -) => { +export const uploadedSuggestedPeoplePhoto = (): ThunkAction< + Promise, + RootState, + unknown, + Action +> => async (dispatch) => { try { dispatch({ type: setSuggestedPeopleLinked.type, - payload: suggested_people_linked, + payload: {suggested_people_linked: 1}, }); } catch (error) { console.log(error); @@ -180,7 +181,6 @@ export const uploadedSuggestedPeoplePhoto = ( export const suggestedPeopleAnimatedTutorialFinished = ( userId: string, - suggested_people_linked: number, ): ThunkAction< Promise, RootState, @@ -191,10 +191,10 @@ 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, suggested_people_linked); + return await sendSuggestedPeopleLinked(userId, 2); } catch (error) { console.log('Error while updating suggested people linked state: ', error); } diff --git a/src/store/reducers/userReducer.ts b/src/store/reducers/userReducer.ts index 5653d26d..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.suggested_people_linked; + state.profile.suggested_people_linked = + action.payload.suggested_people_linked; }, setIsOnboardedUser: (state, action) => { diff --git a/src/types/types.ts b/src/types/types.ts index 3c17cfa4..8e9e8a60 100644 --- a/src/types/types.ts +++ b/src/types/types.ts @@ -222,3 +222,18 @@ export type TypeOfNotification = | 'MOM_3+' // notification_object is MomentType | 'MOM_FRIEND'; + +export type UniversityBadge = { + id: string; + name: string; + university: string; + category: string; +}; + +export type SuggestedPeopleDataType = { + user: ProfilePreviewType; + mutual_friends: ProfilePreviewType[]; + badges: UniversityBadge[]; + social_links: string[]; + suggested_people_url: string; +}; -- cgit v1.2.3-70-g09d2 From a59eee6d4b95ef16e18321bb48072af16f4018dd Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Sat, 20 Feb 2021 12:01:00 -0500 Subject: fixed normalize import --- src/components/common/GenericMoreInfoDrawer.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'src') diff --git a/src/components/common/GenericMoreInfoDrawer.tsx b/src/components/common/GenericMoreInfoDrawer.tsx index b91c38c8..ff32a464 100644 --- a/src/components/common/GenericMoreInfoDrawer.tsx +++ b/src/components/common/GenericMoreInfoDrawer.tsx @@ -8,11 +8,10 @@ import { ViewProps, ViewStyle, } from 'react-native'; -import { normalize } from 'react-native-elements'; 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; -- cgit v1.2.3-70-g09d2 From d671ce2a0dfc9d2ca181b5a21769c0cbd3be2fd3 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Sat, 20 Feb 2021 12:05:13 -0500 Subject: uncomment --- src/screens/suggestedPeople/SuggestedPeopleScreen.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src') diff --git a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx index 69aa6c87..3437cd85 100644 --- a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx +++ b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx @@ -78,7 +78,7 @@ const SuggestedPeopleScreen: React.FC = () => { profileBodyHeight={0} screenType={ScreenType.SuggestedPeople} /> - {/* */} + -- cgit v1.2.3-70-g09d2