diff options
Diffstat (limited to 'src')
9 files changed, 39 insertions, 221 deletions
diff --git a/src/routes/main/MainStackNavigator.tsx b/src/routes/main/MainStackNavigator.tsx index f848a5ab..26d9943b 100644 --- a/src/routes/main/MainStackNavigator.tsx +++ b/src/routes/main/MainStackNavigator.tsx @@ -87,6 +87,7 @@ export type MainStackParams = { InviteFriendsScreen: { screenType: ScreenType; }; + SPWelcomeScreen: {}; }; export const MainStack = createStackNavigator<MainStackParams>(); diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx index d2f0d460..8cefd3cc 100644 --- a/src/routes/main/MainStackScreen.tsx +++ b/src/routes/main/MainStackScreen.tsx @@ -25,6 +25,7 @@ import { SocialMediaTaggs, SuggestedPeopleScreen, SuggestedPeopleUploadPictureScreen, + SuggestedPeopleWelcomeScreen, } from '../../screens'; import MutualBadgeHolders from '../../screens/suggestedPeople/MutualBadgeHolders'; import {ScreenType} from '../../types'; @@ -262,6 +263,13 @@ const MainStackScreen: React.FC<MainStackProps> = ({route}) => { component={MutualBadgeHolders} options={{...modalStyle}} /> + <MainStack.Screen + name="SPWelcomeScreen" + component={SuggestedPeopleWelcomeScreen} + options={{ + ...headerBarOptions('white', ''), + }} + /> </MainStack.Navigator> ); }; diff --git a/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackNavigator.tsx b/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackNavigator.tsx deleted file mode 100644 index 30a83200..00000000 --- a/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackNavigator.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import {createStackNavigator} from '@react-navigation/stack'; - -export type SuggestedPeopleOnboardingStackParams = { - WelcomeScreen: undefined; - UploadPicture: { - editing: boolean; - }; - BadgeSelection: { - editing: boolean; - }; -}; - -export const SuggestedPeopleOnboardingStack = createStackNavigator<SuggestedPeopleOnboardingStackParams>(); diff --git a/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen.tsx b/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen.tsx deleted file mode 100644 index a02e8373..00000000 --- a/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen.tsx +++ /dev/null @@ -1,46 +0,0 @@ -import React from 'react'; -import {SuggestedPeopleOnboardingStack} from './SuggestedPeopleOnboardingStackNavigator'; -import { - SuggestedPeopleWelcomeScreen, - SuggestedPeopleUploadPictureScreen, - BadgeSelection, -} from '../../screens'; -import {SCREEN_WIDTH} from '../../utils'; -import {headerBarOptions} from '../main'; - -const SuggestedPeopleOnboardingStackScreen: React.FC = () => { - return ( - <SuggestedPeopleOnboardingStack.Navigator - initialRouteName="WelcomeScreen" - screenOptions={{ - headerShown: false, - gestureResponseDistance: {horizontal: SCREEN_WIDTH * 0.6}, - }}> - <SuggestedPeopleOnboardingStack.Screen - name="WelcomeScreen" - component={SuggestedPeopleWelcomeScreen} - options={{ - ...headerBarOptions('white', ''), - }} - /> - <SuggestedPeopleOnboardingStack.Screen - name="UploadPicture" - component={SuggestedPeopleUploadPictureScreen} - initialParams={{editing: false}} - options={{ - ...headerBarOptions('white', ''), - }} - /> - <SuggestedPeopleOnboardingStack.Screen - name="BadgeSelection" - component={BadgeSelection} - initialParams={{editing: false}} - options={{ - ...headerBarOptions('white', ''), - }} - /> - </SuggestedPeopleOnboardingStack.Navigator> - ); -}; - -export default SuggestedPeopleOnboardingStackScreen; diff --git a/src/routes/suggestedPeopleOnboarding/index.ts b/src/routes/suggestedPeopleOnboarding/index.ts deleted file mode 100644 index df711493..00000000 --- a/src/routes/suggestedPeopleOnboarding/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export * from './SuggestedPeopleOnboardingStackNavigator'; -export * from './SuggestedPeopleOnboardingStackScreen'; diff --git a/src/screens/badge/BadgeSelection.tsx b/src/screens/badge/BadgeSelection.tsx index cbd7dd88..3003ec8b 100644 --- a/src/screens/badge/BadgeSelection.tsx +++ b/src/screens/badge/BadgeSelection.tsx @@ -74,6 +74,7 @@ const BadgeSelection: React.FC<BadgeSelectionProps> = ({route}) => { const success = await addBadgesService(selectedBadges); if (success) { dispatch(suggestedPeopleBadgesFinished()); + navigation.navigate('SuggestedPeople'); } } else { dispatch(suggestedPeopleBadgesFinished()); diff --git a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx index 4094b0a3..76889657 100644 --- a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx +++ b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx @@ -1,37 +1,31 @@ import {useFocusEffect, useNavigation} from '@react-navigation/native'; -import React, {useCallback, useEffect, useState, useRef} from 'react'; -import { - FlatList, - RefreshControl, - StatusBar, - StyleSheet, - ViewToken, -} from 'react-native'; - +import React, {useCallback, useEffect, useRef, useState} from 'react'; +import {FlatList, RefreshControl, StatusBar, ViewToken} from 'react-native'; import {useDispatch, useSelector, useStore} from 'react-redux'; -import {TabsGradient, TaggLoadingIndicator, Background} from '../../components'; +import {Background, TabsGradient, TaggLoadingIndicator} from '../../components'; import {SP_PAGE_SIZE} from '../../constants'; +import {MainStack} from '../../routes'; +import MainStackScreen from '../../routes/main/MainStackScreen'; import SuggestedPeopleOnboardingStackScreen from '../../routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen'; import {getSuggestedPeople} from '../../services/SuggestedPeopleService'; import {cancelFriendRequest, resetScreenType} from '../../store/actions'; import {RootState} from '../../store/rootReducer'; import { + BackgroundGradientType, FriendshipStatusType, ProfilePreviewType, ScreenType, SuggestedPeopleDataType, - BackgroundGradientType, } from '../../types'; import { fetchUserX, getUserAsProfilePreviewType, handleAddFriend, - normalize, - SCREEN_HEIGHT, - SCREEN_WIDTH, } from '../../utils'; +import {SuggestedPeopleWelcomeScreen} from '../suggestedPeopleOnboarding'; import {userXInStore} from './../../utils/'; import SPBody from './SPBody'; + /** * Bare bones for suggested people consisting of: * * Image, title, name, username, add friend button [w/o functionality] @@ -209,9 +203,13 @@ const SuggestedPeopleScreen: React.FC = () => { [], ); - return suggested_people_linked === 0 ? ( - <SuggestedPeopleOnboardingStackScreen /> - ) : loading ? ( + useFocusEffect(() => { + if (suggested_people_linked === 0) { + navigation.navigate('SPWelcomeScreen'); + } + }); + + return loading ? ( <> <TaggLoadingIndicator fullscreen /> <Background gradientType={BackgroundGradientType.Dark} /> @@ -245,142 +243,4 @@ const SuggestedPeopleScreen: React.FC = () => { ); }; -const styles = StyleSheet.create({ - mainContainer: { - flexDirection: 'column', - width: SCREEN_WIDTH, - height: SCREEN_HEIGHT, - paddingVertical: '15%', - paddingBottom: '20%', - justifyContent: 'space-between', - alignSelf: 'center', - }, - marginManager: {marginHorizontal: '5%'}, - image: { - position: 'absolute', - width: SCREEN_WIDTH, - height: SCREEN_HEIGHT, - zIndex: 0, - }, - title: { - zIndex: 1, - paddingTop: '3%', - alignSelf: 'center', - fontSize: normalize(22), - lineHeight: normalize(26), - fontWeight: '800', - letterSpacing: normalize(3), - color: '#FFFEFE', - textShadowColor: 'rgba(0, 0, 0, 0.4)', - textShadowOffset: {width: normalize(2), height: normalize(2)}, - textShadowRadius: normalize(2), - }, - firstName: { - color: '#fff', - fontWeight: '800', - fontSize: normalize(24), - lineHeight: normalize(29), - textShadowColor: 'rgba(0, 0, 0, 0.3)', - textShadowOffset: {width: normalize(2), height: normalize(2)}, - textShadowRadius: normalize(2), - letterSpacing: normalize(2.5), - alignSelf: 'baseline', - }, - username: { - color: '#fff', - fontWeight: '600', - fontSize: normalize(15), - lineHeight: normalize(18), - textShadowColor: 'rgba(0, 0, 0, 0.3)', - textShadowOffset: {width: normalize(2), height: normalize(2)}, - textShadowRadius: normalize(2), - letterSpacing: normalize(2), - }, - nameInfoContainer: {}, - addButton: { - justifyContent: 'center', - alignItems: 'center', - width: SCREEN_WIDTH * 0.3, - height: SCREEN_WIDTH * 0.085, - padding: 0, - borderWidth: 2, - borderColor: '#fff', - borderRadius: 1, - marginLeft: '1%', - marginTop: '4%', - shadowColor: 'rgb(0, 0, 0)', - shadowRadius: 2, - shadowOffset: {width: 2, height: 2}, - shadowOpacity: 0.5, - }, - addButtonTitle: { - color: 'white', - padding: 0, - fontSize: normalize(15), - lineHeight: normalize(18), - fontWeight: 'bold', - textAlign: 'center', - letterSpacing: normalize(1), - }, - addUserContainer: { - flexDirection: 'row', - justifyContent: 'space-between', - alignItems: 'flex-start', - marginBottom: '5%', - }, - requestedButton: { - justifyContent: 'center', - alignItems: 'center', - width: SCREEN_WIDTH * 0.3, - height: SCREEN_WIDTH * 0.085, - padding: 0, - borderWidth: 2, - borderColor: 'transparent', - borderRadius: 1, - marginLeft: '1%', - marginTop: '4%', - shadowColor: 'rgb(0, 0, 0)', - shadowRadius: 2, - shadowOffset: {width: 2, height: 2}, - shadowOpacity: 0.5, - }, - requestedButtonTitle: { - backgroundColor: 'transparent', - fontSize: normalize(15), - lineHeight: normalize(18), - fontWeight: 'bold', - textAlign: 'center', - letterSpacing: normalize(1), - }, - body: {}, - - button: { - justifyContent: 'center', - alignItems: 'center', - width: SCREEN_WIDTH * 0.4, - aspectRatio: 154 / 33, - borderWidth: 2, - borderColor: '#fff', - borderRadius: 3, - marginRight: '2%', - marginLeft: '1%', - }, - transparentBG: { - backgroundColor: 'transparent', - }, - lightBlueBG: { - backgroundColor: '#fff', - }, - label: { - fontSize: normalize(15), - fontWeight: '700', - letterSpacing: 1, - }, - blueLabel: { - color: '#fff', - }, - whiteLabel: { - color: 'white', - }, -}); export default SuggestedPeopleScreen; diff --git a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx index 87e22d9e..0a4e5718 100644 --- a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx +++ b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx @@ -98,7 +98,7 @@ const SuggestedPeopleUploadPictureScreen: React.FC<SuggestedPeopleUploadPictureS if (success) { dispatch(uploadedSuggestedPeoplePhoto(image)); if (!editing) { - navigation.push('BadgeSelection', {editing: false}); + navigation.navigate('BadgeSelection', {editing: false}); } } else { Alert.alert(ERROR_UPLOAD); @@ -106,12 +106,12 @@ const SuggestedPeopleUploadPictureScreen: React.FC<SuggestedPeopleUploadPictureS setLoading(false); // Navigated back to Profile if user is editing their Suggested People Picture if (editing) { + navigation.goBack(); setTimeout(() => { Alert.alert(success ? SUCCESS_PIC_UPLOAD : ERROR_UPLOAD_SP_PHOTO); }, 500); } } - navigation.goBack(); }; return ( @@ -161,7 +161,7 @@ const SuggestedPeopleUploadPictureScreen: React.FC<SuggestedPeopleUploadPictureS {editing && ( <TouchableOpacity onPress={() => { - navigation.push('BadgeSelection', {editing: true}); + navigation.navigate('BadgeSelection', {editing: true}); }}> <View style={styles.editBadgesMainContainer}> <View style={styles.editBadgesSubContainer}> diff --git a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleWelcomeScreen.tsx b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleWelcomeScreen.tsx index 10f3b3a5..2f12d909 100644 --- a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleWelcomeScreen.tsx +++ b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleWelcomeScreen.tsx @@ -1,6 +1,6 @@ import {BlurView} from '@react-native-community/blur'; import {useNavigation} from '@react-navigation/native'; -import React from 'react'; +import React, {Fragment, useEffect} from 'react'; import {Image, StatusBar, StyleSheet, TouchableOpacity} from 'react-native'; import {Text} from 'react-native-animatable'; import {SafeAreaView} from 'react-native-safe-area-context'; @@ -9,6 +9,13 @@ import {isIPhoneX, normalize, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils'; const SuggestedPeopleWelcomeScreen: React.FC = () => { const navigation = useNavigation(); + + useEffect(() => { + navigation.setOptions({ + headerBackImage: () => <Fragment />, + }); + }, []); + return ( <> <StatusBar barStyle={'light-content'} /> @@ -35,7 +42,9 @@ const SuggestedPeopleWelcomeScreen: React.FC = () => { </BlurView> <TouchableOpacity style={styles.nextButton} - onPress={() => navigation.push('UploadPicture')}> + onPress={() => + navigation.navigate('UpdateSPPicture', {editing: false}) + }> <UpArrow color={'white'} /> </TouchableOpacity> </> |