From f662d1cd85447de0f6be945a350d1f2d1be5033e Mon Sep 17 00:00:00 2001 From: ankit-thanekar007 Date: Wed, 17 Mar 2021 11:07:45 -0700 Subject: Separated Private and Public Profiles --- src/assets/images/private-profile.png | Bin 0 -> 3750 bytes src/assets/images/private-profile@2x.png | Bin 0 -> 7999 bytes src/assets/images/private-profile@3x.png | Bin 0 -> 10081 bytes src/components/common/TaggPrompt.tsx | 2 +- src/components/profile/Content.tsx | 281 ++--------------------------- src/components/profile/PrivateProfile.tsx | 33 ++++ src/components/profile/PublicProfile.tsx | 284 ++++++++++++++++++++++++++++++ src/constants/strings.ts | 1 + src/types/types.ts | 7 + 9 files changed, 342 insertions(+), 266 deletions(-) create mode 100644 src/assets/images/private-profile.png create mode 100644 src/assets/images/private-profile@2x.png create mode 100644 src/assets/images/private-profile@3x.png create mode 100644 src/components/profile/PrivateProfile.tsx create mode 100644 src/components/profile/PublicProfile.tsx (limited to 'src') diff --git a/src/assets/images/private-profile.png b/src/assets/images/private-profile.png new file mode 100644 index 00000000..820ba287 Binary files /dev/null and b/src/assets/images/private-profile.png differ diff --git a/src/assets/images/private-profile@2x.png b/src/assets/images/private-profile@2x.png new file mode 100644 index 00000000..cdcf44d5 Binary files /dev/null and b/src/assets/images/private-profile@2x.png differ diff --git a/src/assets/images/private-profile@3x.png b/src/assets/images/private-profile@3x.png new file mode 100644 index 00000000..f909fe2a Binary files /dev/null and b/src/assets/images/private-profile@3x.png differ diff --git a/src/components/common/TaggPrompt.tsx b/src/components/common/TaggPrompt.tsx index d65e30c6..6169b3f1 100644 --- a/src/components/common/TaggPrompt.tsx +++ b/src/components/common/TaggPrompt.tsx @@ -66,7 +66,7 @@ const styles = StyleSheet.create({ justifyContent: 'center', alignItems: 'center', backgroundColor: 'white', - height: SCREEN_HEIGHT / 4.5, + height: SCREEN_HEIGHT / 4, }, closeButton: { position: 'relative', diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx index 1a5a205c..860e16c5 100644 --- a/src/components/profile/Content.tsx +++ b/src/components/profile/Content.tsx @@ -1,62 +1,39 @@ -import {useFocusEffect, useNavigation} from '@react-navigation/native'; import React, {useCallback, useEffect, useState} from 'react'; import { - Alert, LayoutChangeEvent, NativeScrollEvent, NativeSyntheticEvent, RefreshControl, StyleSheet, - Text, - View, } from 'react-native'; -import {TouchableOpacity} from 'react-native-gesture-handler'; import Animated from 'react-native-reanimated'; import {useDispatch, useSelector, useStore} from 'react-redux'; -import Cover from './Cover'; -import GreyPlusLogo from '../../assets/icons/grey-plus-logo.svg'; -import {COVER_HEIGHT, TAGG_LIGHT_BLUE} from '../../constants'; -import { - UPLOAD_MOMENT_PROMPT_THREE_HEADER, - UPLOAD_MOMENT_PROMPT_THREE_MESSAGE, - UPLOAD_MOMENT_PROMPT_TWO_HEADER, - UPLOAD_MOMENT_PROMPT_TWO_MESSAGE, -} from '../../constants/strings'; +import {COVER_HEIGHT} from '../../constants'; import { blockUnblockUser, - deleteUserMomentsForCategory, loadFriendsData, - updateMomentCategories, updateUserXFriends, } from '../../store/actions'; import { - EMPTY_MOMENTS_LIST, EMPTY_PROFILE_PREVIEW_LIST, NO_PROFILE, NO_USER, } from '../../store/initialStates'; import {RootState} from '../../store/rootreducer'; -import {CategorySelectionScreenType, MomentType, ScreenType} from '../../types'; +import {ContentProps} from '../../types'; import { fetchUserX, getUserAsProfilePreviewType, - moveCategory, - normalize, SCREEN_HEIGHT, userLogin, } from '../../utils'; -import {TaggPrompt} from '../common'; -import {Moment} from '../moments'; -import TaggsBar from '../taggs/TaggsBar'; +import Cover from './Cover'; +import PrivateProfile from './PrivateProfile'; import ProfileBody from './ProfileBody'; import ProfileCutout from './ProfileCutout'; import ProfileHeader from './ProfileHeader'; - -interface ContentProps { - y: Animated.Value; - userXId: string | undefined; - screenType: ScreenType; -} +import PublicProfile from './PublicProfile'; +import TaggsBar from '../taggs/TaggsBar'; const Content: React.FC = ({y, userXId, screenType}) => { const dispatch = useDispatch(); @@ -65,22 +42,6 @@ const Content: React.FC = ({y, userXId, screenType}) => { ? useSelector((state: RootState) => state.userX[screenType][userXId]) : useSelector((state: RootState) => state.user); - const {friends = EMPTY_PROFILE_PREVIEW_LIST} = userXId - ? useSelector((state: RootState) => state.userX[screenType][userXId]) - : useSelector((state: RootState) => state.friends); - - const { - friends: friendsLoggedInUser = EMPTY_PROFILE_PREVIEW_LIST, - } = useSelector((state: RootState) => state.friends); - - const {moments = EMPTY_MOMENTS_LIST} = userXId - ? useSelector((state: RootState) => state.userX[screenType][userXId]) - : useSelector((state: RootState) => state.moments); - - const {momentCategories = []} = userXId - ? useSelector((state: RootState) => state.userX[screenType][userXId]) - : useSelector((state: RootState) => state.momentCategories); - const {blockedUsers = EMPTY_PROFILE_PREVIEW_LIST} = useSelector( (state: RootState) => state.blocked, ); @@ -89,31 +50,16 @@ const Content: React.FC = ({y, userXId, screenType}) => { ); const state = useStore().getState(); - const navigation = useNavigation(); - /** * States */ - const [imagesMap, setImagesMap] = useState>( - new Map(), - ); const [isFriend, setIsFriend] = useState(false); const [isBlocked, setIsBlocked] = useState(false); + const [isPrivate, setIsPrivate] = useState(true); const [profileBodyHeight, setProfileBodyHeight] = useState(0); const [shouldBounce, setShouldBounce] = useState(true); const [refreshing, setRefreshing] = useState(false); - const [isStageTwoPromptClosed, setIsStageTwoPromptClosed] = useState( - false, - ); - const [isStageOnePromptClosed, setIsStageOnePromptClosed] = useState( - false, - ); - const [ - isStageThreePromptClosed, - setIsStageThreePromptClosed, - ] = useState(false); - const onRefresh = useCallback(() => { const refrestState = async () => { if (!userXId) { @@ -133,78 +79,6 @@ const Content: React.FC = ({y, userXId, screenType}) => { setProfileBodyHeight(height); }; - const createImagesMap = useCallback(() => { - var map = new Map(); - moments.forEach(function (imageObject) { - var moment_category = imageObject.moment_category; - if (map.has(moment_category)) { - map.get(moment_category).push(imageObject); - } else { - map.set(moment_category, [imageObject]); - } - }); - setImagesMap(map); - }, [moments]); - - useEffect(() => { - createImagesMap(); - }, [createImagesMap]); - - const move = (direction: 'up' | 'down', title: string) => { - let categories = [...momentCategories]; - categories = moveCategory(categories, title, direction === 'up'); - dispatch(updateMomentCategories(categories, false)); - }; - - /** - * Prompt user to perform an activity based on their profile completion stage - * To fire 2 seconds after the screen comes in focus - * 1 means STAGE_1: - * The user must upload a moment, so take them to a screen guiding them to post a moment - * 2 means STAGE_2: - * The user must create another category so show a prompt on top of the screen - * 3 means STAGE_3: - * The user must upload a moment to the second category, so show a prompt on top of the screen - * Else, profile is complete and no prompt needs to be shown - */ - useFocusEffect( - useCallback(() => { - const navigateToMomentUploadPrompt = () => { - switch (profile.profile_completion_stage) { - case 1: - if ( - momentCategories && - momentCategories[0] && - !isStageOnePromptClosed - ) { - navigation.navigate('MomentUploadPrompt', { - screenType, - momentCategory: momentCategories[0], - }); - setIsStageOnePromptClosed(true); - } - break; - case 2: - setIsStageTwoPromptClosed(false); - break; - case 3: - setIsStageThreePromptClosed(false); - break; - default: - break; - } - }; - if (!userXId) { - setTimeout(navigateToMomentUploadPrompt, 2000); - } - }, [ - profile.profile_completion_stage, - momentCategories, - userXId, - isStageOnePromptClosed, - ]), - ); - useEffect(() => { const isActuallyBlocked = blockedUsers.some( (cur_user) => user.username === cur_user.username, @@ -234,37 +108,6 @@ const Content: React.FC = ({y, userXId, screenType}) => { } }; - /** - * Handle deletion of a category - * Confirm with user before deleting the category - * @param category category to be deleted - */ - const handleCategoryDeletion = (category: string) => { - Alert.alert( - 'Category Deletion', - `Are you sure that you want to delete the category ${category} ?`, - [ - { - text: 'Cancel', - style: 'cancel', - }, - { - text: 'Yes', - onPress: () => { - dispatch( - updateMomentCategories( - momentCategories.filter((mc) => mc !== category), - false, - ), - ); - dispatch(deleteUserMomentsForCategory(category)); - }, - }, - ], - {cancelable: true}, - ); - }; - const handleScroll = (e: NativeSyntheticEvent) => { /** * Set the new y position @@ -285,6 +128,7 @@ const Content: React.FC = ({y, userXId, screenType}) => { return ( handleScroll(e)} bounces={shouldBounce} @@ -309,115 +153,22 @@ const Content: React.FC = ({y, userXId, screenType}) => { isBlocked, }} /> - - - {userXId && moments.length === 0 && ( - - - {`Looks like ${ - profile.name.split(' ')[0] - } has not posted any moments yet`} - - )} - {!userXId && - profile.profile_completion_stage === 2 && - !isStageTwoPromptClosed && ( - { - setIsStageTwoPromptClosed(true); - }} - /> - )} - {!userXId && - profile.profile_completion_stage === 3 && - !isStageThreePromptClosed && ( - { - setIsStageThreePromptClosed(true); - }} - /> - )} - {momentCategories.map( - (title, index) => - (!userXId || imagesMap.get(title)) && ( - 1} - showUpButton={index !== 0} - showDownButton={index !== momentCategories.length - 1} - move={move} - /> - ), - )} - {!userXId && ( - - navigation.push('CategorySelection', { - screenType: CategorySelectionScreenType.Profile, - user: loggedInUser, - }) - } - style={styles.createCategoryButton}> - - Create a new category - - - )} - + {isPrivate ? ( + + ) : ( + <> + + + + )} ); }; const styles = StyleSheet.create({ container: { - flex: 1, backgroundColor: '#fff', - }, - momentsContainer: { - backgroundColor: '#f2f2f2', - paddingBottom: SCREEN_HEIGHT / 10, flex: 1, - flexDirection: 'column', - }, - createCategoryButton: { - backgroundColor: TAGG_LIGHT_BLUE, - justifyContent: 'center', - alignItems: 'center', - width: '70%', - height: 30, - marginTop: '15%', - alignSelf: 'center', - }, - createCategoryButtonLabel: { - fontSize: normalize(16), - fontWeight: '500', - color: 'white', - }, - plusIconContainer: { - flexDirection: 'column', - justifyContent: 'center', - alignItems: 'center', - marginVertical: '10%', - }, - noMomentsText: { - fontSize: normalize(14), - fontWeight: 'bold', - color: 'gray', - marginVertical: '8%', }, }); diff --git a/src/components/profile/PrivateProfile.tsx b/src/components/profile/PrivateProfile.tsx new file mode 100644 index 00000000..efa7ff39 --- /dev/null +++ b/src/components/profile/PrivateProfile.tsx @@ -0,0 +1,33 @@ +import React from 'react'; +import {Image, StyleSheet, Text, View} from 'react-native'; +import {PRIVATE_ACCOUNT} from '../../constants/strings'; +import {normalize, SCREEN_HEIGHT} from '../../utils'; + +const PrivateProfile: React.FC = () => { + return ( + + + + {PRIVATE_ACCOUNT} + + + ); +}; + +const styles = StyleSheet.create({ + container: { + backgroundColor: '#F9F9F9', + alignItems: 'center', + justifyContent: 'center', + height: SCREEN_HEIGHT * 0.3, + }, + privateAccountTextContainer: {marginTop: '8%'}, + privateAccountTextStyle: { + fontWeight: '600', + fontSize: normalize(18), + lineHeight: normalize(25), + color: '#828282', + }, +}); + +export default PrivateProfile; diff --git a/src/components/profile/PublicProfile.tsx b/src/components/profile/PublicProfile.tsx new file mode 100644 index 00000000..f453d05b --- /dev/null +++ b/src/components/profile/PublicProfile.tsx @@ -0,0 +1,284 @@ +import {useFocusEffect, useNavigation} from '@react-navigation/native'; +import React, {useCallback, useEffect, useState} from 'react'; +import {Alert, StyleSheet, Text, View} from 'react-native'; +import {TouchableOpacity} from 'react-native-gesture-handler'; +import {useDispatch, useSelector, useStore} from 'react-redux'; +import GreyPlusLogo from '../../assets/icons/grey-plus-logo.svg'; +import {TAGG_LIGHT_BLUE} from '../../constants'; +import { + UPLOAD_MOMENT_PROMPT_THREE_HEADER, + UPLOAD_MOMENT_PROMPT_THREE_MESSAGE, + UPLOAD_MOMENT_PROMPT_TWO_HEADER, + UPLOAD_MOMENT_PROMPT_TWO_MESSAGE, +} from '../../constants/strings'; +import { + deleteUserMomentsForCategory, + updateMomentCategories, +} from '../../store/actions'; +import { + EMPTY_MOMENTS_LIST, + EMPTY_PROFILE_PREVIEW_LIST, + NO_PROFILE, + NO_USER, +} from '../../store/initialStates'; +import {RootState} from '../../store/rootreducer'; +import { + CategorySelectionScreenType, + ContentProps, + MomentType, +} from '../../types'; +import {moveCategory, normalize, SCREEN_HEIGHT} from '../../utils'; +import {TaggPrompt} from '../common'; +import {Moment} from '../moments'; + +const PublicProfile: React.FC = ({y, userXId, screenType}) => { + const dispatch = useDispatch(); + + const {profile = NO_PROFILE} = userXId + ? useSelector((state: RootState) => state.userX[screenType][userXId]) + : useSelector((state: RootState) => state.user); + + const {moments = EMPTY_MOMENTS_LIST} = userXId + ? useSelector((state: RootState) => state.userX[screenType][userXId]) + : useSelector((state: RootState) => state.moments); + + const {momentCategories = []} = userXId + ? useSelector((state: RootState) => state.userX[screenType][userXId]) + : useSelector((state: RootState) => state.momentCategories); + + const {user: loggedInUser = NO_USER} = useSelector( + (state: RootState) => state.user, + ); + + const navigation = useNavigation(); + + /** + * States + */ + const [imagesMap, setImagesMap] = useState>( + new Map(), + ); + + const [isStageTwoPromptClosed, setIsStageTwoPromptClosed] = useState( + false, + ); + const [isStageOnePromptClosed, setIsStageOnePromptClosed] = useState( + false, + ); + const [ + isStageThreePromptClosed, + setIsStageThreePromptClosed, + ] = useState(false); + + const move = (direction: 'up' | 'down', title: string) => { + let categories = [...momentCategories]; + categories = moveCategory(categories, title, direction === 'up'); + dispatch(updateMomentCategories(categories, false)); + }; + + /** + * Prompt user to perform an activity based on their profile completion stage + * To fire 2 seconds after the screen comes in focus + * 1 means STAGE_1: + * The user must upload a moment, so take them to a screen guiding them to post a moment + * 2 means STAGE_2: + * The user must create another category so show a prompt on top of the screen + * 3 means STAGE_3: + * The user must upload a moment to the second category, so show a prompt on top of the screen + * Else, profile is complete and no prompt needs to be shown + */ + useFocusEffect( + useCallback(() => { + const navigateToMomentUploadPrompt = () => { + switch (profile.profile_completion_stage) { + case 1: + if ( + momentCategories && + momentCategories[0] && + !isStageOnePromptClosed + ) { + navigation.navigate('MomentUploadPrompt', { + screenType, + momentCategory: momentCategories[0], + }); + setIsStageOnePromptClosed(true); + } + break; + case 2: + setIsStageTwoPromptClosed(false); + break; + case 3: + setIsStageThreePromptClosed(false); + break; + default: + break; + } + }; + if (!userXId) { + setTimeout(navigateToMomentUploadPrompt, 2000); + } + }, [ + profile.profile_completion_stage, + momentCategories, + userXId, + isStageOnePromptClosed, + ]), + ); + + /** + * Handle deletion of a category + * Confirm with user before deleting the category + * @param category category to be deleted + */ + const handleCategoryDeletion = (category: string) => { + Alert.alert( + 'Category Deletion', + `Are you sure that you want to delete the category ${category} ?`, + [ + { + text: 'Cancel', + style: 'cancel', + }, + { + text: 'Yes', + onPress: () => { + dispatch( + updateMomentCategories( + momentCategories.filter((mc) => mc !== category), + false, + ), + ); + dispatch(deleteUserMomentsForCategory(category)); + }, + }, + ], + {cancelable: true}, + ); + }; + + const createImagesMap = useCallback(() => { + let map = new Map(); + moments.forEach(function (imageObject) { + let moment_category = imageObject.moment_category; + if (map.has(moment_category)) { + map.get(moment_category).push(imageObject); + } else { + map.set(moment_category, [imageObject]); + } + }); + setImagesMap(map); + }, [moments]); + + useEffect(() => { + createImagesMap(); + }, [createImagesMap]); + + return ( + + {userXId && moments.length === 0 && ( + + + {`Looks like ${ + profile.name.split(' ')[0] + } has not posted any moments yet`} + + )} + {!userXId && + profile.profile_completion_stage === 2 && + !isStageTwoPromptClosed && ( + { + setIsStageTwoPromptClosed(true); + }} + /> + )} + {!userXId && + profile.profile_completion_stage === 3 && + !isStageThreePromptClosed && ( + { + setIsStageThreePromptClosed(true); + }} + /> + )} + {momentCategories.map( + (title, index) => + (!userXId || imagesMap.get(title)) && ( + 1} + showUpButton={index !== 0} + showDownButton={index !== momentCategories.length - 1} + move={move} + /> + ), + )} + {!userXId && ( + + navigation.push('CategorySelection', { + screenType: CategorySelectionScreenType.Profile, + user: loggedInUser, + }) + } + style={styles.createCategoryButton}> + + Create a new category + + + )} + + ); +}; + +const styles = StyleSheet.create({ + container: { + flex: 1, + backgroundColor: '#fff', + }, + momentsContainer: { + backgroundColor: '#f2f2f2', + paddingBottom: SCREEN_HEIGHT / 10, + flex: 1, + flexDirection: 'column', + }, + createCategoryButton: { + backgroundColor: TAGG_LIGHT_BLUE, + justifyContent: 'center', + alignItems: 'center', + width: '70%', + height: 30, + marginTop: '15%', + alignSelf: 'center', + }, + createCategoryButtonLabel: { + fontSize: normalize(16), + fontWeight: '500', + color: 'white', + }, + plusIconContainer: { + flexDirection: 'column', + justifyContent: 'center', + alignItems: 'center', + marginVertical: '10%', + }, + noMomentsText: { + fontSize: normalize(14), + fontWeight: 'bold', + color: 'gray', + marginVertical: '8%', + }, +}); + +export default PublicProfile; diff --git a/src/constants/strings.ts b/src/constants/strings.ts index cb442b7b..fa1aeb25 100644 --- a/src/constants/strings.ts +++ b/src/constants/strings.ts @@ -54,6 +54,7 @@ export const MARKED_AS_MSG = (str: string) => `Marked as ${str}`; export const MOMENT_DELETED_MSG = 'Moment deleted....Some moments have to go, to create space for greater ones'; export const NO_NEW_NOTIFICATIONS = 'You have no new notifications'; export const NO_RESULTS_FOUND = 'No Results Found!'; +export const PRIVATE_ACCOUNT = 'This account is private'; export const SUCCESS_CATEGORY_DELETE = 'Category successfully deleted, but its memory will live on'; export const SUCCESS_INVITATION_CODE = 'Welcome to Tagg!'; export const SUCCESS_LINK = (str: string) => `Successfully linked ${str} 🎉`; diff --git a/src/types/types.ts b/src/types/types.ts index 9a40e4c0..e96d35a9 100644 --- a/src/types/types.ts +++ b/src/types/types.ts @@ -1,3 +1,5 @@ +import Animated from 'react-native-reanimated'; + export interface UserType { userId: string; username: string; @@ -198,6 +200,11 @@ export interface CommentNotificationType { export interface ThreadNotificationType extends CommentNotificationType { parent_comment: string; } +export interface ContentProps { + y: Animated.Value; + userXId: string | undefined; + screenType: ScreenType; +} export type NotificationType = { actor: ProfilePreviewType; -- cgit v1.2.3-70-g09d2 From 82acd049763452decdab0c40e6cf7286dd2ed57d Mon Sep 17 00:00:00 2001 From: ankit-thanekar007 Date: Thu, 25 Mar 2021 17:09:45 -0700 Subject: Private account toggle changes --- src/components/profile/Content.tsx | 29 ++++++++++++++++++++++------- src/components/profile/PrivateProfile.tsx | 4 ++-- src/components/profile/ProfileBody.tsx | 1 + src/components/profile/PublicProfile.tsx | 2 +- 4 files changed, 26 insertions(+), 10 deletions(-) (limited to 'src') diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx index 860e16c5..8d77d798 100644 --- a/src/components/profile/Content.tsx +++ b/src/components/profile/Content.tsx @@ -41,7 +41,6 @@ const Content: React.FC = ({y, userXId, screenType}) => { const {user = NO_USER, profile = NO_PROFILE} = userXId ? useSelector((state: RootState) => state.userX[screenType][userXId]) : useSelector((state: RootState) => state.user); - const {blockedUsers = EMPTY_PROFILE_PREVIEW_LIST} = useSelector( (state: RootState) => state.blocked, ); @@ -55,20 +54,19 @@ const Content: React.FC = ({y, userXId, screenType}) => { */ const [isFriend, setIsFriend] = useState(false); const [isBlocked, setIsBlocked] = useState(false); - const [isPrivate, setIsPrivate] = useState(true); const [profileBodyHeight, setProfileBodyHeight] = useState(0); const [shouldBounce, setShouldBounce] = useState(true); const [refreshing, setRefreshing] = useState(false); const onRefresh = useCallback(() => { const refrestState = async () => { + setRefreshing(true); if (!userXId) { await userLogin(dispatch, loggedInUser); } else { await fetchUserX(dispatch, user, screenType); } }; - setRefreshing(true); refrestState().then(() => { setRefreshing(false); }); @@ -88,6 +86,10 @@ const Content: React.FC = ({y, userXId, screenType}) => { } }, [blockedUsers, user]); + useEffect(() => { + setIsFriend(profile.friendship_status === 'friends'); + }, [profile.friendship_status]); + /** * Handles a click on the block / unblock button. * loadFriends updates friends list for the logged in user @@ -108,6 +110,16 @@ const Content: React.FC = ({y, userXId, screenType}) => { } }; + const canViewProfile = () => { + if (loggedInUser.userId === user.userId) { + return true; + } else if (profile.is_private && !isFriend) { + return false; + } else { + return true; + } + }; + const handleScroll = (e: NativeSyntheticEvent) => { /** * Set the new y position @@ -153,13 +165,16 @@ const Content: React.FC = ({y, userXId, screenType}) => { isBlocked, }} /> - {isPrivate ? ( - - ) : ( + {canViewProfile() ? ( <> - + + ) : ( + )} ); diff --git a/src/components/profile/PrivateProfile.tsx b/src/components/profile/PrivateProfile.tsx index efa7ff39..07a0dccc 100644 --- a/src/components/profile/PrivateProfile.tsx +++ b/src/components/profile/PrivateProfile.tsx @@ -16,10 +16,10 @@ const PrivateProfile: React.FC = () => { const styles = StyleSheet.create({ container: { - backgroundColor: '#F9F9F9', alignItems: 'center', justifyContent: 'center', - height: SCREEN_HEIGHT * 0.3, + backgroundColor: '#F9F9F9', + height: SCREEN_HEIGHT * 0.35, }, privateAccountTextContainer: {marginTop: '8%'}, privateAccountTextStyle: { diff --git a/src/components/profile/ProfileBody.tsx b/src/components/profile/ProfileBody.tsx index 646be3e0..3aef5990 100644 --- a/src/components/profile/ProfileBody.tsx +++ b/src/components/profile/ProfileBody.tsx @@ -119,6 +119,7 @@ const styles = StyleSheet.create({ flex: 1, paddingTop: '3.5%', paddingBottom: '2%', + width: '50%', }, container: { paddingVertical: '1%', diff --git a/src/components/profile/PublicProfile.tsx b/src/components/profile/PublicProfile.tsx index f453d05b..4b5166f0 100644 --- a/src/components/profile/PublicProfile.tsx +++ b/src/components/profile/PublicProfile.tsx @@ -227,7 +227,7 @@ const PublicProfile: React.FC = ({y, userXId, screenType}) => { {!userXId && ( - navigation.push('CategorySelection', { + navigation.navigate('CategorySelection', { screenType: CategorySelectionScreenType.Profile, user: loggedInUser, }) -- cgit v1.2.3-70-g09d2 From 64f8829ab55bfe6851f10ca933043877769c56bf Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Fri, 26 Mar 2021 17:28:23 -0400 Subject: show taggsbar, prevent taggsbar navigation on profile and SP --- src/components/profile/Content.tsx | 28 +++++++++++++++------------- src/components/profile/PublicProfile.tsx | 5 ++--- src/components/taggs/Tagg.tsx | 30 +++++++++++++++++------------- src/components/taggs/TaggsBar.tsx | 4 ++++ src/screens/suggestedPeople/SPBody.tsx | 14 +++++++++++++- src/types/types.ts | 1 + src/utils/users.ts | 8 ++++++++ 7 files changed, 60 insertions(+), 30 deletions(-) (limited to 'src') diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx index 8d77d798..9fb6f79b 100644 --- a/src/components/profile/Content.tsx +++ b/src/components/profile/Content.tsx @@ -22,6 +22,7 @@ import { import {RootState} from '../../store/rootreducer'; import {ContentProps} from '../../types'; import { + canViewProfile, fetchUserX, getUserAsProfilePreviewType, SCREEN_HEIGHT, @@ -81,7 +82,7 @@ const Content: React.FC = ({y, userXId, screenType}) => { const isActuallyBlocked = blockedUsers.some( (cur_user) => user.username === cur_user.username, ); - if (isBlocked != isActuallyBlocked) { + if (isBlocked !== isActuallyBlocked) { setIsBlocked(isActuallyBlocked); } }, [blockedUsers, user]); @@ -110,16 +111,6 @@ const Content: React.FC = ({y, userXId, screenType}) => { } }; - const canViewProfile = () => { - if (loggedInUser.userId === user.userId) { - return true; - } else if (profile.is_private && !isFriend) { - return false; - } else { - return true; - } - }; - const handleScroll = (e: NativeSyntheticEvent) => { /** * Set the new y position @@ -165,7 +156,11 @@ const Content: React.FC = ({y, userXId, screenType}) => { isBlocked, }} /> - {canViewProfile() ? ( + {canViewProfile( + loggedInUser.userId === user.userId, + profile.is_private, + isFriend, + ) ? ( <> = ({y, userXId, screenType}) => { ) : ( - + <> + + + )} ); diff --git a/src/components/profile/PublicProfile.tsx b/src/components/profile/PublicProfile.tsx index 4b5166f0..a70e8e50 100644 --- a/src/components/profile/PublicProfile.tsx +++ b/src/components/profile/PublicProfile.tsx @@ -2,7 +2,7 @@ import {useFocusEffect, useNavigation} from '@react-navigation/native'; import React, {useCallback, useEffect, useState} from 'react'; import {Alert, StyleSheet, Text, View} from 'react-native'; import {TouchableOpacity} from 'react-native-gesture-handler'; -import {useDispatch, useSelector, useStore} from 'react-redux'; +import {useDispatch, useSelector} from 'react-redux'; import GreyPlusLogo from '../../assets/icons/grey-plus-logo.svg'; import {TAGG_LIGHT_BLUE} from '../../constants'; import { @@ -17,7 +17,6 @@ import { } from '../../store/actions'; import { EMPTY_MOMENTS_LIST, - EMPTY_PROFILE_PREVIEW_LIST, NO_PROFILE, NO_USER, } from '../../store/initialStates'; @@ -159,7 +158,7 @@ const PublicProfile: React.FC = ({y, userXId, screenType}) => { const createImagesMap = useCallback(() => { let map = new Map(); moments.forEach(function (imageObject) { - let moment_category = imageObject.moment_category; + let moment_category = imageObject.moment_category; if (map.has(moment_category)) { map.get(moment_category).push(imageObject); } else { diff --git a/src/components/taggs/Tagg.tsx b/src/components/taggs/Tagg.tsx index 547a77cb..ae9ab091 100644 --- a/src/components/taggs/Tagg.tsx +++ b/src/components/taggs/Tagg.tsx @@ -34,6 +34,7 @@ interface TaggProps { userXId: string | undefined; user: UserType; whiteRing: boolean | undefined; + allowNavigation?: boolean; } const Tagg: React.FC = ({ @@ -45,6 +46,7 @@ const Tagg: React.FC = ({ userXId, user, whiteRing, + allowNavigation = true, }) => { const navigation = useNavigation(); const [modalVisible, setModalVisible] = useState(false); @@ -70,19 +72,21 @@ const Tagg: React.FC = ({ const modalOrAuthBrowserOrPass = async () => { if (youMayPass) { - if (INTEGRATED_SOCIAL_LIST.indexOf(social) !== -1) { - navigation.push('SocialMediaTaggs', { - socialMediaType: social, - userXId, - }); - } else { - getNonIntegratedURL(social, user.userId).then((socialURL) => { - if (socialURL) { - Linking.openURL(socialURL); - } else { - Alert.alert(ERROR_UNABLE_TO_FIND_PROFILE); - } - }); + if (allowNavigation) { + if (INTEGRATED_SOCIAL_LIST.indexOf(social) !== -1) { + navigation.push('SocialMediaTaggs', { + socialMediaType: social, + userXId, + }); + } else { + getNonIntegratedURL(social, user.userId).then((socialURL) => { + if (socialURL) { + Linking.openURL(socialURL); + } else { + Alert.alert(ERROR_UNABLE_TO_FIND_PROFILE); + } + }); + } } } else { if (isIntegrated) { diff --git a/src/components/taggs/TaggsBar.tsx b/src/components/taggs/TaggsBar.tsx index f952c53f..a9c428b2 100644 --- a/src/components/taggs/TaggsBar.tsx +++ b/src/components/taggs/TaggsBar.tsx @@ -22,6 +22,7 @@ interface TaggsBarProps { screenType: ScreenType; whiteRing: boolean | undefined; linkedSocials?: string[]; + allowNavigation?: boolean; } const TaggsBar: React.FC = ({ y, @@ -30,6 +31,7 @@ const TaggsBar: React.FC = ({ screenType, whiteRing, linkedSocials, + allowNavigation = true, }) => { let [taggs, setTaggs] = useState([]); let [taggsNeedUpdate, setTaggsNeedUpdate] = useState(true); @@ -79,6 +81,7 @@ const TaggsBar: React.FC = ({ setTaggsNeedUpdate={setTaggsNeedUpdate} setSocialDataNeedUpdate={handleSocialUpdate} whiteRing={whiteRing ? whiteRing : undefined} + allowNavigation={allowNavigation} />, ); i++; @@ -96,6 +99,7 @@ const TaggsBar: React.FC = ({ userXId={userXId} user={user} whiteRing={whiteRing ? whiteRing : undefined} + allowNavigation={allowNavigation} />, ); i++; diff --git a/src/screens/suggestedPeople/SPBody.tsx b/src/screens/suggestedPeople/SPBody.tsx index 8e0801c2..7bedb137 100644 --- a/src/screens/suggestedPeople/SPBody.tsx +++ b/src/screens/suggestedPeople/SPBody.tsx @@ -14,7 +14,13 @@ import { SuggestedPeopleDataType, UniversityBadge, } from '../../types'; -import {isIPhoneX, normalize, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils'; +import { + canViewProfile, + isIPhoneX, + normalize, + SCREEN_HEIGHT, + SCREEN_WIDTH, +} from '../../utils'; interface SPBodyProps { item: SuggestedPeopleDataType; @@ -32,6 +38,7 @@ const SPBody: React.FC = ({ suggested_people_url, friendship, badges, + is_private, }, itemIndex, onAddFriend, @@ -156,6 +163,11 @@ const SPBody: React.FC = ({ screenType={screenType} whiteRing={true} linkedSocials={social_links} + allowNavigation={canViewProfile( + loggedInUserId === user.id, + is_private, + friendship.status === 'friends', + )} /> diff --git a/src/types/types.ts b/src/types/types.ts index e96d35a9..b2d39cd9 100644 --- a/src/types/types.ts +++ b/src/types/types.ts @@ -251,6 +251,7 @@ export type SuggestedPeopleDataType = { social_links: string[]; suggested_people_url: string; friendship: FriendshipType; + is_private: boolean; }; export type FriendshipType = { diff --git a/src/utils/users.ts b/src/utils/users.ts index d5e44b36..6cb6d46c 100644 --- a/src/utils/users.ts +++ b/src/utils/users.ts @@ -174,3 +174,11 @@ export const defaultUserProfile = () => { const defaultImage = require('../assets/images/avatar-placeholder.png'); return defaultImage; }; + +export const canViewProfile = ( + ownProfile: boolean, + isPrivate: boolean, + isFriend: boolean, +) => { + return ownProfile || isFriend || !isPrivate; +}; -- cgit v1.2.3-70-g09d2 From e8324a7278a82d926acceedc10921f0b14e6d403 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Mon, 29 Mar 2021 14:00:39 -0400 Subject: updated helper function, cleaned up code, prevent friends navigation --- src/components/profile/Content.tsx | 24 ++++++++---------------- src/components/profile/FriendsCount.tsx | 17 ++++++++++------- src/components/profile/ProfileBody.tsx | 18 +++++------------- src/components/profile/ProfileHeader.tsx | 8 ++++---- src/services/UserFriendsService.ts | 9 ++------- src/store/actions/userFriends.ts | 23 +++++++++++------------ src/utils/users.ts | 23 +++++++++++++++++++---- 7 files changed, 59 insertions(+), 63 deletions(-) (limited to 'src') diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx index 9fb6f79b..779e0525 100644 --- a/src/components/profile/Content.tsx +++ b/src/components/profile/Content.tsx @@ -38,22 +38,23 @@ import TaggsBar from '../taggs/TaggsBar'; const Content: React.FC = ({y, userXId, screenType}) => { const dispatch = useDispatch(); - - const {user = NO_USER, profile = NO_PROFILE} = userXId - ? useSelector((state: RootState) => state.userX[screenType][userXId]) - : useSelector((state: RootState) => state.user); + const state: RootState = useStore().getState(); + const { + user = NO_USER, + profile = NO_PROFILE, + } = useSelector((state: RootState) => + userXId ? state.userX[screenType][userXId] : state.user, + ); const {blockedUsers = EMPTY_PROFILE_PREVIEW_LIST} = useSelector( (state: RootState) => state.blocked, ); const {user: loggedInUser = NO_USER} = useSelector( (state: RootState) => state.user, ); - const state = useStore().getState(); /** * States */ - const [isFriend, setIsFriend] = useState(false); const [isBlocked, setIsBlocked] = useState(false); const [profileBodyHeight, setProfileBodyHeight] = useState(0); const [shouldBounce, setShouldBounce] = useState(true); @@ -87,10 +88,6 @@ const Content: React.FC = ({y, userXId, screenType}) => { } }, [blockedUsers, user]); - useEffect(() => { - setIsFriend(profile.friendship_status === 'friends'); - }, [profile.friendship_status]); - /** * Handles a click on the block / unblock button. * loadFriends updates friends list for the logged in user @@ -151,16 +148,11 @@ const Content: React.FC = ({y, userXId, screenType}) => { onLayout, userXId, screenType, - isFriend, handleBlockUnblock, isBlocked, }} /> - {canViewProfile( - loggedInUser.userId === user.userId, - profile.is_private, - isFriend, - ) ? ( + {canViewProfile(state, userXId, screenType) ? ( <> = ({ userXId, screenType, }) => { - const {friends} = userXId - ? useSelector((state: RootState) => state.userX[screenType][userXId]) - : useSelector((state: RootState) => state.friends); + const {friends} = useSelector((state: RootState) => + userXId ? state.userX[screenType][userXId] : state.friends, + ); const count = friends ? friends.length : 0; const displayedCount: string = @@ -32,15 +32,18 @@ const FriendsCount: React.FC = ({ : `${count / 1e6}m`; const navigation = useNavigation(); + const state: RootState = useStore().getState(); return ( - navigation.push('FriendsListScreen', { + navigation.navigate('FriendsListScreen', { userXId, screenType, }) + } + disabled={ + !canViewProfile(state, userXId, screenType) || friends.length === 0 }> {displayedCount} diff --git a/src/components/profile/ProfileBody.tsx b/src/components/profile/ProfileBody.tsx index 3aef5990..b49e71a3 100644 --- a/src/components/profile/ProfileBody.tsx +++ b/src/components/profile/ProfileBody.tsx @@ -2,21 +2,17 @@ import React from 'react'; import {LayoutChangeEvent, Linking, StyleSheet, Text, View} from 'react-native'; import {normalize} from 'react-native-elements'; import {useDispatch, useSelector, useStore} from 'react-redux'; -import { - TAGG_DARK_BLUE, - TAGG_LIGHT_BLUE, - TOGGLE_BUTTON_TYPE, -} from '../../constants'; +import {TAGG_DARK_BLUE, TOGGLE_BUTTON_TYPE} from '../../constants'; import { acceptFriendRequest, declineFriendRequest, updateUserXFriends, updateUserXProfileAllScreens, } from '../../store/actions'; -import {NO_PROFILE, NO_USER} from '../../store/initialStates'; +import {NO_PROFILE} from '../../store/initialStates'; import {RootState} from '../../store/rootReducer'; import {ScreenType} from '../../types'; -import {getUserAsProfilePreviewType, SCREEN_WIDTH} from '../../utils'; +import {getUserAsProfilePreviewType} from '../../utils'; import {FriendsButton} from '../common'; import ToggleButton from './ToggleButton'; @@ -34,12 +30,8 @@ const ProfileBody: React.FC = ({ userXId, screenType, }) => { - const {profile = NO_PROFILE, user} = userXId - ? useSelector((state: RootState) => state.userX[screenType][userXId]) - : useSelector((state: RootState) => state.user); - - const {user: loggedInUser = NO_USER} = useSelector( - (state: RootState) => state.user, + const {profile = NO_PROFILE, user} = useSelector((state: RootState) => + userXId ? state.userX[screenType][userXId] : state.user, ); const { diff --git a/src/components/profile/ProfileHeader.tsx b/src/components/profile/ProfileHeader.tsx index e5bd9d93..b5dda399 100644 --- a/src/components/profile/ProfileHeader.tsx +++ b/src/components/profile/ProfileHeader.tsx @@ -1,7 +1,6 @@ import React, {useState} from 'react'; import {StyleSheet, Text, View} from 'react-native'; import {useSelector} from 'react-redux'; -import UniversityIcon from './UniversityIcon'; import {PROFILE_CUTOUT_TOP_Y} from '../../constants'; import {RootState} from '../../store/rootreducer'; import {ScreenType} from '../../types'; @@ -9,6 +8,7 @@ import {normalize} from '../../utils'; import Avatar from './Avatar'; import FriendsCount from './FriendsCount'; import ProfileMoreInfoDrawer from './ProfileMoreInfoDrawer'; +import UniversityIcon from './UniversityIcon'; type ProfileHeaderProps = { userXId: string | undefined; @@ -26,9 +26,9 @@ const ProfileHeader: React.FC = ({ const { profile: {name = '', university_class = 2021} = {}, user: {username: userXName = ''}, - } = userXId - ? useSelector((state: RootState) => state.userX[screenType][userXId]) - : useSelector((state: RootState) => state.user); + } = useSelector((state: RootState) => + userXId ? state.userX[screenType][userXId] : state.user, + ); const [drawerVisible, setDrawerVisible] = useState(false); const [firstName, lastName] = [...name.split(' ')]; return ( diff --git a/src/services/UserFriendsService.ts b/src/services/UserFriendsService.ts index da39380f..5c41e988 100644 --- a/src/services/UserFriendsService.ts +++ b/src/services/UserFriendsService.ts @@ -1,17 +1,12 @@ -//Abstracted common friends api calls out here - import AsyncStorage from '@react-native-community/async-storage'; import {Alert} from 'react-native'; -import {ContactType, FriendshipStatusType} from '../types'; import { FRIENDS_ENDPOINT, INVITE_FRIEND_ENDPOINT, USERS_FROM_CONTACTS_ENDPOINT, } from '../constants'; -import { - ERROR_SOMETHING_WENT_WRONG, - ERROR_SOMETHING_WENT_WRONG_REFRESH, -} from '../constants/strings'; +import {ERROR_SOMETHING_WENT_WRONG_REFRESH} from '../constants/strings'; +import {ContactType, FriendshipStatusType} from '../types'; export const loadFriends = async (userId: string, token: string) => { try { diff --git a/src/store/actions/userFriends.ts b/src/store/actions/userFriends.ts index 9da3cb4a..4183d0f6 100644 --- a/src/store/actions/userFriends.ts +++ b/src/store/actions/userFriends.ts @@ -1,25 +1,24 @@ -import {getTokenOrLogout, userXInStore} from '../../utils'; -import {RootState} from '../rootReducer'; -import { - FriendshipStatusType, - ProfilePreviewType, - ScreenType, - UserType, -} from '../../types/types'; +import {Action, ThunkAction} from '@reduxjs/toolkit'; import { acceptFriendRequestService, addFriendService, + deleteFriendshipService, friendOrUnfriendUser, loadFriends, - deleteFriendshipService, } from '../../services'; -import {Action, ThunkAction} from '@reduxjs/toolkit'; import { - userFriendsFetched, + FriendshipStatusType, + ProfilePreviewType, + ScreenType, + UserType, +} from '../../types/types'; +import {getTokenOrLogout, userXInStore} from '../../utils'; +import { updateFriends, + userFriendsFetched, userXFriendshipEdited, - userLoggedIn, } from '../reducers'; +import {RootState} from '../rootReducer'; export const loadFriendsData = ( userId: string, diff --git a/src/utils/users.ts b/src/utils/users.ts index 6cb6d46c..0b8a0582 100644 --- a/src/utils/users.ts +++ b/src/utils/users.ts @@ -176,9 +176,24 @@ export const defaultUserProfile = () => { }; export const canViewProfile = ( - ownProfile: boolean, - isPrivate: boolean, - isFriend: boolean, + state: RootState, + userXId: string | undefined, + screenType: ScreenType, ) => { - return ownProfile || isFriend || !isPrivate; + // own profile + if (!userXId || state.user.user.userId === userXId) { + return true; + } + // not private + if (!(userXId && state.userX[screenType][userXId].profile.is_private)) { + return true; + } + // is friend + if ( + userXId && + state.userX[screenType][userXId].profile.friendship_status === 'friends' + ) { + return true; + } + return false; }; -- cgit v1.2.3-70-g09d2 From 8e4fc71e625e8818773ebfa3d93bbee32b3ffe99 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Mon, 29 Mar 2021 14:02:44 -0400 Subject: disabled press animation --- src/components/taggs/Tagg.tsx | 31 +++++++++++++++---------------- 1 file changed, 15 insertions(+), 16 deletions(-) (limited to 'src') diff --git a/src/components/taggs/Tagg.tsx b/src/components/taggs/Tagg.tsx index ae9ab091..4e4987fb 100644 --- a/src/components/taggs/Tagg.tsx +++ b/src/components/taggs/Tagg.tsx @@ -72,21 +72,19 @@ const Tagg: React.FC = ({ const modalOrAuthBrowserOrPass = async () => { if (youMayPass) { - if (allowNavigation) { - if (INTEGRATED_SOCIAL_LIST.indexOf(social) !== -1) { - navigation.push('SocialMediaTaggs', { - socialMediaType: social, - userXId, - }); - } else { - getNonIntegratedURL(social, user.userId).then((socialURL) => { - if (socialURL) { - Linking.openURL(socialURL); - } else { - Alert.alert(ERROR_UNABLE_TO_FIND_PROFILE); - } - }); - } + if (INTEGRATED_SOCIAL_LIST.indexOf(social) !== -1) { + navigation.push('SocialMediaTaggs', { + socialMediaType: social, + userXId, + }); + } else { + getNonIntegratedURL(social, user.userId).then((socialURL) => { + if (socialURL) { + Linking.openURL(socialURL); + } else { + Alert.alert(ERROR_UNABLE_TO_FIND_PROFILE); + } + }); } } else { if (isIntegrated) { @@ -149,7 +147,8 @@ const Tagg: React.FC = ({ + onPress={modalOrAuthBrowserOrPass} + disabled={!allowNavigation}> {pickTheRightRingHere()} -- cgit v1.2.3-70-g09d2 From f16ab73dbda9ac345c85837b48966ef6574876ed Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Mon, 29 Mar 2021 14:07:05 -0400 Subject: code cleanup, prevent navigation from SP taggs bar --- src/components/profile/FriendsCount.tsx | 8 ++++---- src/screens/suggestedPeople/SPBody.tsx | 10 ++++++---- 2 files changed, 10 insertions(+), 8 deletions(-) (limited to 'src') diff --git a/src/components/profile/FriendsCount.tsx b/src/components/profile/FriendsCount.tsx index a733823f..4790743b 100644 --- a/src/components/profile/FriendsCount.tsx +++ b/src/components/profile/FriendsCount.tsx @@ -1,11 +1,11 @@ +import {useNavigation} from '@react-navigation/native'; import React from 'react'; -import {View, Text, StyleSheet, ViewProps} from 'react-native'; +import {StyleSheet, Text, View, ViewProps} from 'react-native'; import {TouchableOpacity} from 'react-native-gesture-handler'; -import {useNavigation} from '@react-navigation/native'; -import {RootState} from '../../store/rootReducer'; import {useSelector, useStore} from 'react-redux'; +import {RootState} from '../../store/rootReducer'; import {ScreenType} from '../../types'; -import {canViewProfile, canViewProfileFoo, normalize} from '../../utils'; +import {canViewProfile, normalize} from '../../utils'; interface FriendsCountProps extends ViewProps { userXId: string | undefined; diff --git a/src/screens/suggestedPeople/SPBody.tsx b/src/screens/suggestedPeople/SPBody.tsx index f38945f7..297f76c0 100644 --- a/src/screens/suggestedPeople/SPBody.tsx +++ b/src/screens/suggestedPeople/SPBody.tsx @@ -4,10 +4,12 @@ import {StyleSheet, Text, View} from 'react-native'; import {Image} from 'react-native-animatable'; import {TouchableOpacity} from 'react-native-gesture-handler'; import Animated from 'react-native-reanimated'; +import {useStore} from 'react-redux'; import RequestedButton from '../../assets/ionicons/requested-button.svg'; import {TaggsBar} from '../../components'; import {BadgesDropdown, MutualFriends} from '../../components/suggestedPeople'; import {BADGE_DATA} from '../../constants/badges'; +import {RootState} from '../../store/rootReducer'; import { ProfilePreviewType, ScreenType, @@ -39,7 +41,6 @@ const SPBody: React.FC = ({ suggested_people_url, friendship, badges, - is_private, }, itemIndex, onAddFriend, @@ -55,6 +56,7 @@ const SPBody: React.FC = ({ }[] >([]); const navigation = useNavigation(); + const state: RootState = useStore().getState(); useEffect(() => { const newBadges: {badge: UniversityBadge; img: any}[] = []; const findBadgeIcons = (badge: UniversityBadge) => { @@ -165,9 +167,9 @@ const SPBody: React.FC = ({ whiteRing={true} linkedSocials={social_links} allowNavigation={canViewProfile( - loggedInUserId === user.id, - is_private, - friendship.status === 'friends', + state, + loggedInUserId === user.id ? undefined : user.id, + screenType, )} /> -- cgit v1.2.3-70-g09d2 From 59f64faa456b7f4852eef3d9281afde8d8f46e9a Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Mon, 29 Mar 2021 14:13:06 -0400 Subject: fix linter warnings --- src/components/profile/PublicProfile.tsx | 28 +++++++++++++++------------- 1 file changed, 15 insertions(+), 13 deletions(-) (limited to 'src') diff --git a/src/components/profile/PublicProfile.tsx b/src/components/profile/PublicProfile.tsx index a70e8e50..8d597986 100644 --- a/src/components/profile/PublicProfile.tsx +++ b/src/components/profile/PublicProfile.tsx @@ -30,20 +30,20 @@ import {moveCategory, normalize, SCREEN_HEIGHT} from '../../utils'; import {TaggPrompt} from '../common'; import {Moment} from '../moments'; -const PublicProfile: React.FC = ({y, userXId, screenType}) => { +const PublicProfile: React.FC = ({userXId, screenType}) => { const dispatch = useDispatch(); - const {profile = NO_PROFILE} = userXId - ? useSelector((state: RootState) => state.userX[screenType][userXId]) - : useSelector((state: RootState) => state.user); + const {profile = NO_PROFILE} = useSelector((state: RootState) => + userXId ? state.userX[screenType][userXId] : state.user, + ); - const {moments = EMPTY_MOMENTS_LIST} = userXId - ? useSelector((state: RootState) => state.userX[screenType][userXId]) - : useSelector((state: RootState) => state.moments); + const {moments = EMPTY_MOMENTS_LIST} = useSelector((state: RootState) => + userXId ? state.userX[screenType][userXId] : state.moments, + ); - const {momentCategories = []} = userXId - ? useSelector((state: RootState) => state.userX[screenType][userXId]) - : useSelector((state: RootState) => state.momentCategories); + const {momentCategories = []} = useSelector((state: RootState) => + userXId ? state.userX[screenType][userXId] : state.momentCategories, + ); const {user: loggedInUser = NO_USER} = useSelector( (state: RootState) => state.user, @@ -117,10 +117,12 @@ const PublicProfile: React.FC = ({y, userXId, screenType}) => { setTimeout(navigateToMomentUploadPrompt, 2000); } }, [ + userXId, profile.profile_completion_stage, momentCategories, - userXId, isStageOnePromptClosed, + navigation, + screenType, ]), ); @@ -188,7 +190,7 @@ const PublicProfile: React.FC = ({y, userXId, screenType}) => { { setIsStageTwoPromptClosed(true); }} @@ -200,7 +202,7 @@ const PublicProfile: React.FC = ({y, userXId, screenType}) => { { setIsStageThreePromptClosed(true); }} -- cgit v1.2.3-70-g09d2 From 872a3e8dbb7182e532d7878f3b1f316b3ca69386 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Mon, 29 Mar 2021 14:14:01 -0400 Subject: cleaned up code --- src/components/profile/PublicProfile.tsx | 11 +++-------- 1 file changed, 3 insertions(+), 8 deletions(-) (limited to 'src') diff --git a/src/components/profile/PublicProfile.tsx b/src/components/profile/PublicProfile.tsx index 8d597986..3272bca1 100644 --- a/src/components/profile/PublicProfile.tsx +++ b/src/components/profile/PublicProfile.tsx @@ -58,16 +58,11 @@ const PublicProfile: React.FC = ({userXId, screenType}) => { new Map(), ); - const [isStageTwoPromptClosed, setIsStageTwoPromptClosed] = useState( + const [isStageTwoPromptClosed, setIsStageTwoPromptClosed] = useState(false); + const [isStageOnePromptClosed, setIsStageOnePromptClosed] = useState(false); + const [isStageThreePromptClosed, setIsStageThreePromptClosed] = useState( false, ); - const [isStageOnePromptClosed, setIsStageOnePromptClosed] = useState( - false, - ); - const [ - isStageThreePromptClosed, - setIsStageThreePromptClosed, - ] = useState(false); const move = (direction: 'up' | 'down', title: string) => { let categories = [...momentCategories]; -- cgit v1.2.3-70-g09d2 From 641a98cd5d184efb5639952812f24c56c90e7f62 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Mon, 29 Mar 2021 14:18:00 -0400 Subject: code cleanup --- src/components/profile/Content.tsx | 1 - src/components/taggs/TaggsBar.tsx | 18 +++++++++--------- src/screens/suggestedPeople/SPBody.tsx | 5 ----- 3 files changed, 9 insertions(+), 15 deletions(-) (limited to 'src') diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx index 779e0525..cf2b7d28 100644 --- a/src/components/profile/Content.tsx +++ b/src/components/profile/Content.tsx @@ -165,7 +165,6 @@ const Content: React.FC = ({y, userXId, screenType}) => { diff --git a/src/components/taggs/TaggsBar.tsx b/src/components/taggs/TaggsBar.tsx index a9c428b2..567b58de 100644 --- a/src/components/taggs/TaggsBar.tsx +++ b/src/components/taggs/TaggsBar.tsx @@ -2,7 +2,7 @@ import React, {Fragment, useEffect, useState} from 'react'; import {StyleSheet} from 'react-native'; import Animated from 'react-native-reanimated'; import {useSafeAreaInsets} from 'react-native-safe-area-context'; -import {useDispatch, useSelector} from 'react-redux'; +import {useDispatch, useSelector, useStore} from 'react-redux'; import { INTEGRATED_SOCIAL_LIST, PROFILE_CUTOUT_BOTTOM_Y, @@ -12,6 +12,7 @@ import {getLinkedSocials} from '../../services'; import {loadIndividualSocial, updateSocial} from '../../store/actions'; import {RootState} from '../../store/rootReducer'; import {ScreenType} from '../../types'; +import {canViewProfile} from '../../utils'; import Tagg from './Tagg'; const {View, ScrollView, interpolate, Extrapolate} = Animated; @@ -22,7 +23,6 @@ interface TaggsBarProps { screenType: ScreenType; whiteRing: boolean | undefined; linkedSocials?: string[]; - allowNavigation?: boolean; } const TaggsBar: React.FC = ({ y, @@ -31,14 +31,14 @@ const TaggsBar: React.FC = ({ screenType, whiteRing, linkedSocials, - allowNavigation = true, }) => { let [taggs, setTaggs] = useState([]); let [taggsNeedUpdate, setTaggsNeedUpdate] = useState(true); - - const {user} = userXId - ? useSelector((state: RootState) => state.userX[screenType][userXId]) - : useSelector((state: RootState) => state.user); + const {user} = useSelector((state: RootState) => + userXId ? state.userX[screenType][userXId] : state.user, + ); + const state: RootState = useStore().getState(); + const allowTaggsNavigation = canViewProfile(state, userXId, screenType); const dispatch = useDispatch(); @@ -81,7 +81,7 @@ const TaggsBar: React.FC = ({ setTaggsNeedUpdate={setTaggsNeedUpdate} setSocialDataNeedUpdate={handleSocialUpdate} whiteRing={whiteRing ? whiteRing : undefined} - allowNavigation={allowNavigation} + allowNavigation={allowTaggsNavigation} />, ); i++; @@ -99,7 +99,7 @@ const TaggsBar: React.FC = ({ userXId={userXId} user={user} whiteRing={whiteRing ? whiteRing : undefined} - allowNavigation={allowNavigation} + allowNavigation={allowTaggsNavigation} />, ); i++; diff --git a/src/screens/suggestedPeople/SPBody.tsx b/src/screens/suggestedPeople/SPBody.tsx index 297f76c0..824f8b1c 100644 --- a/src/screens/suggestedPeople/SPBody.tsx +++ b/src/screens/suggestedPeople/SPBody.tsx @@ -166,11 +166,6 @@ const SPBody: React.FC = ({ screenType={screenType} whiteRing={true} linkedSocials={social_links} - allowNavigation={canViewProfile( - state, - loggedInUserId === user.id ? undefined : user.id, - screenType, - )} /> -- cgit v1.2.3-70-g09d2 From cfd760db7c4d6b7c3f9f9aa8fe53ed4bf2f3affc Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Mon, 29 Mar 2021 14:20:52 -0400 Subject: added comments --- src/utils/users.ts | 9 +++++++++ 1 file changed, 9 insertions(+) (limited to 'src') diff --git a/src/utils/users.ts b/src/utils/users.ts index 0b8a0582..f9d6d6b7 100644 --- a/src/utils/users.ts +++ b/src/utils/users.ts @@ -175,6 +175,15 @@ export const defaultUserProfile = () => { return defaultImage; }; +/** + * Used to determine whether the logged-in user is able to view userX's private + * information or not. + * + * @param state redux store's root state + * @param userXId target userX's id + * @param screenType current screen type + * @returns true if abel to view private info, false otherwise + */ export const canViewProfile = ( state: RootState, userXId: string | undefined, -- cgit v1.2.3-70-g09d2 From decacdda9f9f7e7b7649422ed86005fe7ab4adcf Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Mon, 29 Mar 2021 14:32:06 -0400 Subject: fixed taggs bar and added padding for private accounts --- src/components/profile/Content.tsx | 26 +++++++++++--------------- 1 file changed, 11 insertions(+), 15 deletions(-) (limited to 'src') diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx index cf2b7d28..c9a87ad1 100644 --- a/src/components/profile/Content.tsx +++ b/src/components/profile/Content.tsx @@ -128,7 +128,7 @@ const Content: React.FC = ({y, userXId, screenType}) => { return ( handleScroll(e)} bounces={shouldBounce} @@ -152,22 +152,14 @@ const Content: React.FC = ({y, userXId, screenType}) => { isBlocked, }} /> + {canViewProfile(state, userXId, screenType) ? ( - <> - - - + ) : ( - <> - - - + )} ); @@ -178,6 +170,10 @@ const styles = StyleSheet.create({ backgroundColor: '#fff', flex: 1, }, + contentContainer: { + flexGrow: 1, + paddingBottom: SCREEN_HEIGHT * 0.1, + }, }); export default Content; -- cgit v1.2.3-70-g09d2 From ee80ddfb8a486fea31d845aba4e0b4847fe637e9 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Mon, 29 Mar 2021 14:43:35 -0400 Subject: updated padding --- src/components/profile/Content.tsx | 1 - src/components/profile/PrivateProfile.tsx | 3 ++- src/components/profile/PublicProfile.tsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) (limited to 'src') diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx index c9a87ad1..a22b9728 100644 --- a/src/components/profile/Content.tsx +++ b/src/components/profile/Content.tsx @@ -172,7 +172,6 @@ const styles = StyleSheet.create({ }, contentContainer: { flexGrow: 1, - paddingBottom: SCREEN_HEIGHT * 0.1, }, }); diff --git a/src/components/profile/PrivateProfile.tsx b/src/components/profile/PrivateProfile.tsx index 07a0dccc..bc75a18a 100644 --- a/src/components/profile/PrivateProfile.tsx +++ b/src/components/profile/PrivateProfile.tsx @@ -19,7 +19,8 @@ const styles = StyleSheet.create({ alignItems: 'center', justifyContent: 'center', backgroundColor: '#F9F9F9', - height: SCREEN_HEIGHT * 0.35, + height: SCREEN_HEIGHT * 0.4, + paddingBottom: SCREEN_HEIGHT * 0.1, }, privateAccountTextContainer: {marginTop: '8%'}, privateAccountTextStyle: { diff --git a/src/components/profile/PublicProfile.tsx b/src/components/profile/PublicProfile.tsx index 3272bca1..9683d8f2 100644 --- a/src/components/profile/PublicProfile.tsx +++ b/src/components/profile/PublicProfile.tsx @@ -245,7 +245,7 @@ const styles = StyleSheet.create({ }, momentsContainer: { backgroundColor: '#f2f2f2', - paddingBottom: SCREEN_HEIGHT / 10, + paddingBottom: SCREEN_HEIGHT * 0.15, flex: 1, flexDirection: 'column', }, -- cgit v1.2.3-70-g09d2 From ad70d44fd106c475ff3ecd680ebb41946e4dc363 Mon Sep 17 00:00:00 2001 From: ankit-thanekar007 Date: Wed, 17 Mar 2021 15:59:53 -0700 Subject: Tma 701 - New screens added, refactoring pending --- src/assets/images/blocked-white@3x.png | Bin 0 -> 1020 bytes src/assets/images/edit-profile@3x.png | Bin 0 -> 770 bytes src/assets/images/privacypolicy@3x.png | Bin 0 -> 519 bytes src/assets/images/settings/blocked-white.png | Bin 0 -> 367 bytes src/assets/images/settings/blocked-white@2x.png | Bin 0 -> 685 bytes src/assets/images/settings/edit-profile.png | Bin 0 -> 341 bytes src/assets/images/settings/edit-profile@2x.png | Bin 0 -> 582 bytes src/assets/images/settings/privacypolicy.png | Bin 0 -> 283 bytes src/assets/images/settings/privacypolicy@2x.png | Bin 0 -> 371 bytes src/assets/images/settings/settings-white.png | Bin 0 -> 400 bytes src/assets/images/settings/settings-white@2x.png | Bin 0 -> 871 bytes src/assets/images/settings/settings-white@3x.png | Bin 0 -> 1393 bytes src/assets/images/settings/settings.png | Bin 0 -> 508 bytes src/assets/images/settings/settings@2x.png | Bin 0 -> 967 bytes src/assets/images/settings/termsofuse.png | Bin 0 -> 373 bytes src/assets/images/settings/termsofuse@2x.png | Bin 0 -> 600 bytes src/assets/images/settings/white-arrow.png | Bin 0 -> 240 bytes src/assets/images/settings/white-arrow@2x.png | Bin 0 -> 355 bytes src/assets/images/settings/white-arrow@3x.png | Bin 0 -> 415 bytes src/assets/images/settings@3x.png | Bin 0 -> 1433 bytes src/assets/images/termsofuse@3x.png | Bin 0 -> 939 bytes src/components/profile/ProfileMoreInfoDrawer.tsx | 22 +-- src/routes/main/MainStackNavigator.tsx | 3 + src/routes/main/MainStackScreen.tsx | 24 +++ src/screens/profile/AccountType.tsx | 87 +++++++++++ src/screens/profile/PrivacyScreen.tsx | 159 ++++++++++++++++++++ src/screens/profile/SettingsScreen.tsx | 184 +++++++++++++++++++++++ src/screens/profile/index.ts | 3 + src/store/actions/user.ts | 2 + 29 files changed, 475 insertions(+), 9 deletions(-) create mode 100644 src/assets/images/blocked-white@3x.png create mode 100644 src/assets/images/edit-profile@3x.png create mode 100644 src/assets/images/privacypolicy@3x.png create mode 100644 src/assets/images/settings/blocked-white.png create mode 100644 src/assets/images/settings/blocked-white@2x.png create mode 100644 src/assets/images/settings/edit-profile.png create mode 100644 src/assets/images/settings/edit-profile@2x.png create mode 100644 src/assets/images/settings/privacypolicy.png create mode 100644 src/assets/images/settings/privacypolicy@2x.png create mode 100644 src/assets/images/settings/settings-white.png create mode 100644 src/assets/images/settings/settings-white@2x.png create mode 100644 src/assets/images/settings/settings-white@3x.png create mode 100644 src/assets/images/settings/settings.png create mode 100644 src/assets/images/settings/settings@2x.png create mode 100644 src/assets/images/settings/termsofuse.png create mode 100644 src/assets/images/settings/termsofuse@2x.png create mode 100644 src/assets/images/settings/white-arrow.png create mode 100644 src/assets/images/settings/white-arrow@2x.png create mode 100644 src/assets/images/settings/white-arrow@3x.png create mode 100644 src/assets/images/settings@3x.png create mode 100644 src/assets/images/termsofuse@3x.png create mode 100644 src/screens/profile/AccountType.tsx create mode 100644 src/screens/profile/PrivacyScreen.tsx create mode 100644 src/screens/profile/SettingsScreen.tsx (limited to 'src') diff --git a/src/assets/images/blocked-white@3x.png b/src/assets/images/blocked-white@3x.png new file mode 100644 index 00000000..06eeb651 Binary files /dev/null and b/src/assets/images/blocked-white@3x.png differ diff --git a/src/assets/images/edit-profile@3x.png b/src/assets/images/edit-profile@3x.png new file mode 100644 index 00000000..8ba76b18 Binary files /dev/null and b/src/assets/images/edit-profile@3x.png differ diff --git a/src/assets/images/privacypolicy@3x.png b/src/assets/images/privacypolicy@3x.png new file mode 100644 index 00000000..aa3402b2 Binary files /dev/null and b/src/assets/images/privacypolicy@3x.png differ diff --git a/src/assets/images/settings/blocked-white.png b/src/assets/images/settings/blocked-white.png new file mode 100644 index 00000000..ec3750af Binary files /dev/null and b/src/assets/images/settings/blocked-white.png differ diff --git a/src/assets/images/settings/blocked-white@2x.png b/src/assets/images/settings/blocked-white@2x.png new file mode 100644 index 00000000..1f39ba06 Binary files /dev/null and b/src/assets/images/settings/blocked-white@2x.png differ diff --git a/src/assets/images/settings/edit-profile.png b/src/assets/images/settings/edit-profile.png new file mode 100644 index 00000000..c096a32a Binary files /dev/null and b/src/assets/images/settings/edit-profile.png differ diff --git a/src/assets/images/settings/edit-profile@2x.png b/src/assets/images/settings/edit-profile@2x.png new file mode 100644 index 00000000..4753e0a3 Binary files /dev/null and b/src/assets/images/settings/edit-profile@2x.png differ diff --git a/src/assets/images/settings/privacypolicy.png b/src/assets/images/settings/privacypolicy.png new file mode 100644 index 00000000..47792a3d Binary files /dev/null and b/src/assets/images/settings/privacypolicy.png differ diff --git a/src/assets/images/settings/privacypolicy@2x.png b/src/assets/images/settings/privacypolicy@2x.png new file mode 100644 index 00000000..31a1aeb2 Binary files /dev/null and b/src/assets/images/settings/privacypolicy@2x.png differ diff --git a/src/assets/images/settings/settings-white.png b/src/assets/images/settings/settings-white.png new file mode 100644 index 00000000..f571e4b0 Binary files /dev/null and b/src/assets/images/settings/settings-white.png differ diff --git a/src/assets/images/settings/settings-white@2x.png b/src/assets/images/settings/settings-white@2x.png new file mode 100644 index 00000000..6d59c672 Binary files /dev/null and b/src/assets/images/settings/settings-white@2x.png differ diff --git a/src/assets/images/settings/settings-white@3x.png b/src/assets/images/settings/settings-white@3x.png new file mode 100644 index 00000000..0019b29c Binary files /dev/null and b/src/assets/images/settings/settings-white@3x.png differ diff --git a/src/assets/images/settings/settings.png b/src/assets/images/settings/settings.png new file mode 100644 index 00000000..7445b8bf Binary files /dev/null and b/src/assets/images/settings/settings.png differ diff --git a/src/assets/images/settings/settings@2x.png b/src/assets/images/settings/settings@2x.png new file mode 100644 index 00000000..8a152c70 Binary files /dev/null and b/src/assets/images/settings/settings@2x.png differ diff --git a/src/assets/images/settings/termsofuse.png b/src/assets/images/settings/termsofuse.png new file mode 100644 index 00000000..82e90148 Binary files /dev/null and b/src/assets/images/settings/termsofuse.png differ diff --git a/src/assets/images/settings/termsofuse@2x.png b/src/assets/images/settings/termsofuse@2x.png new file mode 100644 index 00000000..5e0fe642 Binary files /dev/null and b/src/assets/images/settings/termsofuse@2x.png differ diff --git a/src/assets/images/settings/white-arrow.png b/src/assets/images/settings/white-arrow.png new file mode 100644 index 00000000..7c60d262 Binary files /dev/null and b/src/assets/images/settings/white-arrow.png differ diff --git a/src/assets/images/settings/white-arrow@2x.png b/src/assets/images/settings/white-arrow@2x.png new file mode 100644 index 00000000..13cce59a Binary files /dev/null and b/src/assets/images/settings/white-arrow@2x.png differ diff --git a/src/assets/images/settings/white-arrow@3x.png b/src/assets/images/settings/white-arrow@3x.png new file mode 100644 index 00000000..48ed872a Binary files /dev/null and b/src/assets/images/settings/white-arrow@3x.png differ diff --git a/src/assets/images/settings@3x.png b/src/assets/images/settings@3x.png new file mode 100644 index 00000000..4844d30f Binary files /dev/null and b/src/assets/images/settings@3x.png differ diff --git a/src/assets/images/termsofuse@3x.png b/src/assets/images/termsofuse@3x.png new file mode 100644 index 00000000..7d253196 Binary files /dev/null and b/src/assets/images/termsofuse@3x.png differ diff --git a/src/components/profile/ProfileMoreInfoDrawer.tsx b/src/components/profile/ProfileMoreInfoDrawer.tsx index a77a2e84..d62063a7 100644 --- a/src/components/profile/ProfileMoreInfoDrawer.tsx +++ b/src/components/profile/ProfileMoreInfoDrawer.tsx @@ -3,7 +3,6 @@ import React from 'react'; 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'; @@ -29,7 +28,7 @@ const ProfileMoreInfoDrawer: React.FC = (props) => { const isOwnProfile = !userXId || userXName === username; const goToEditProfile = () => { - navigation.push('EditProfile', { + navigation.navigate('EditProfile', { userId: userId, username: username, }); @@ -41,9 +40,7 @@ const ProfileMoreInfoDrawer: React.FC = (props) => { Alert.alert(ERROR_ATTEMPT_EDIT_SP); } else { // Sending undefined for updatedSelectedBadges to mark that there was no update yet - navigation.push('UpdateSPPicture', { - editing: true, - }); + navigation.navigate('SettingsScreen'); setIsOpen(false); } }; @@ -81,14 +78,21 @@ const ProfileMoreInfoDrawer: React.FC = (props) => { textColor={'black'} buttons={[ [ - 'Edit Suggested', - goToUpdateSPProfile, + 'Settings', + goToSettingsPage, , + ], + [ + 'Edit Profile', + goToEditProfile, + , ], - ['Edit Profile', goToEditProfile, ], ]} /> )} diff --git a/src/routes/main/MainStackNavigator.tsx b/src/routes/main/MainStackNavigator.tsx index 26d9943b..4563ec95 100644 --- a/src/routes/main/MainStackNavigator.tsx +++ b/src/routes/main/MainStackNavigator.tsx @@ -28,6 +28,9 @@ export type MainStackParams = { userXId: string | undefined; screenType: ScreenType; }; + SettingsScreen: {}; + PrivacyScreen: {}; + AccountTypeScreen: {}; SocialMediaTaggs: { socialMediaType: string; userXId: string | undefined; diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx index 8cefd3cc..d855f0df 100644 --- a/src/routes/main/MainStackScreen.tsx +++ b/src/routes/main/MainStackScreen.tsx @@ -6,6 +6,7 @@ import {StyleSheet, Text} from 'react-native'; import {normalize} from 'react-native-elements'; import BackIcon from '../../assets/icons/back-arrow.svg'; import { + AccountType, AnimatedTutorial, BadgeSelection, CaptionScreen, @@ -20,12 +21,14 @@ import { MomentUploadPromptScreen, NotificationsScreen, ProfileScreen, + PrivacyScreen, RequestContactsAccess, SearchScreen, SocialMediaTaggs, SuggestedPeopleScreen, SuggestedPeopleUploadPictureScreen, SuggestedPeopleWelcomeScreen, + SettingsScreen, } from '../../screens'; import MutualBadgeHolders from '../../screens/suggestedPeople/MutualBadgeHolders'; import {ScreenType} from '../../types'; @@ -150,6 +153,27 @@ const MainStackScreen: React.FC = ({route}) => { ...headerBarOptions('white', 'Discover Users'), }} /> + + + { + const [isPrivateAccount, setIsPrivateAccount] = useState(false); + const switchAccountType = () => + setIsPrivateAccount((previousState) => !previousState); + + useEffect(() => { + // Fetching from Redux and Set the result + // setIsPrivateAccount(true); + }, []); + + const getAccountText = () => { + return isPrivateAccount ? 'Private Account' : 'Public Account'; + }; + + return ( + <> + + + + + + {getAccountText()} + + + + + + Enabling a public account will: + + + {'\n'}Everyone can view my posts{'\n'} + {'\n'}Everyone can send me friend requests{'\n'} + {'\n'}Everyone can tagg me{'\n'} + {'\n'}Everyone can send me direct messages + + + + + + + ); +}; + +const styles = StyleSheet.create({ + container: { + flex: 1, + }, + title: { + fontSize: normalize(18), + fontWeight: '600', + lineHeight: normalize(17.9), + color: 'white', + }, + + detailTitleStyle: { + fontSize: normalize(19), + fontWeight: '700', + lineHeight: normalize(22.67), + color: 'white', + }, + detailContentStyle: { + fontSize: normalize(14), + fontWeight: '600', + lineHeight: normalize(16.71), + color: 'white', + }, +}); + +export default AccountType; diff --git a/src/screens/profile/PrivacyScreen.tsx b/src/screens/profile/PrivacyScreen.tsx new file mode 100644 index 00000000..e92769fc --- /dev/null +++ b/src/screens/profile/PrivacyScreen.tsx @@ -0,0 +1,159 @@ +import React from 'react'; +import { + Alert, + Image, + SectionList, + StatusBar, + StyleSheet, + Text, + TouchableOpacity, + View, +} from 'react-native'; +import {SafeAreaView} from 'react-native-safe-area-context'; +import {normalize} from '../../utils/layouts'; +import {Background} from '../../components'; +import {BackgroundGradientType} from '../../types'; +import {logout} from '../../store/actions'; +import {useDispatch, useSelector} from 'react-redux'; +import {useNavigation} from '@react-navigation/core'; +import {RootState} from 'src/store/rootReducer'; +import {ERROR_ATTEMPT_EDIT_SP} from '../../constants/strings'; + +const DATA = [ + { + title: '', + data: [ + { + title: 'Account Type', + preimage: require('../../assets/images/tagg-logo.png'), + postimage: require('../../assets/images/settings/white-arrow.png'), + }, + { + title: 'Blocked Accounts', + preimage: require('../../assets/images/settings/blocked-white.png'), + postimage: require('../../assets/images/settings/white-arrow.png'), + }, + ], + }, +]; + +const PrivacyScreen: React.FC = () => { + const dispatch = useDispatch(); + const navigation = useNavigation(); + const {suggested_people_linked} = useSelector( + (state: RootState) => state.user.profile, + ); + const goToUpdateSPProfile = () => { + if (suggested_people_linked === 0) { + Alert.alert(ERROR_ATTEMPT_EDIT_SP); + } else { + // Sending undefined for updatedSelectedBadges to mark that there was no update yet + navigation.navigate('UpdateSPPicture', { + editing: true, + }); + } + }; + + const getActions = (type: string) => { + switch (type) { + case 'Account Type': + navigateTo('AccountTypeScreen', {}); + break + case 'Blocked Accounts': + navigateTo('Blocked Accounts', {}); + break + default: + break; + } + }; + + const navigateTo = (screen: string, options: object) => { + navigation.navigate(screen, options); + }; + + const Item = ({ + title, + preimage, + postimage, + }: { + title: string; + preimage: number; + postimage: number; + }) => ( + getActions(title)} style={styles.item}> + + + {title} + + + {title === 'Account Type' && ( + + {'Private'} + + )} + + + + ); + + return ( + <> + + + + + item.title + index} + renderItem={({item: {title, preimage, postimage}}) => { + return ; + }} + renderSectionHeader={({section: {title}}) => { + if (title.length === 0) { + return null; + } + return ( + + {title} + + ); + }} + /> + + + + + ); +}; + +const styles = StyleSheet.create({ + container: { + flex: 1, + }, + item: { + marginTop: 36, + flexDirection: 'row', + justifyContent: 'flex-start', + alignItems: 'center', + }, + header: { + fontSize: normalize(18), + fontWeight: '600', + lineHeight: normalize(21.48), + color: '#E9E9E9', + }, + title: { + fontSize: normalize(15), + fontWeight: '600', + lineHeight: normalize(17.9), + color: 'white', + }, + logoutStyle: { + fontSize: normalize(20), + fontWeight: '600', + lineHeight: normalize(23.87), + color: 'white', + }, +}); + +export default PrivacyScreen; diff --git a/src/screens/profile/SettingsScreen.tsx b/src/screens/profile/SettingsScreen.tsx new file mode 100644 index 00000000..79633572 --- /dev/null +++ b/src/screens/profile/SettingsScreen.tsx @@ -0,0 +1,184 @@ +import React from 'react'; +import { + Alert, + Image, + SectionList, + StatusBar, + StyleSheet, + Text, + TouchableOpacity, + View, +} from 'react-native'; +import {SafeAreaView} from 'react-native-safe-area-context'; +import {normalize} from '../../utils/layouts'; +import {Background} from '../../components'; +import {BackgroundGradientType} from '../../types'; +import {logout} from '../../store/actions'; +import {useDispatch, useSelector} from 'react-redux'; +import {useNavigation} from '@react-navigation/core'; +import {RootState} from 'src/store/rootReducer'; +import {ERROR_ATTEMPT_EDIT_SP} from '../../constants/strings'; + +const DATA = [ + { + title: 'ACCOUNT', + data: [ + { + title: 'Suggested People Profile', + preimage: require('../../assets/images/tagg-logo.png'), + postimage: require('../../assets/images/settings/white-arrow.png'), + }, + { + title: 'Privacy', + preimage: require('../../assets/images/settings/settings-white.png'), + postimage: require('../../assets/images/settings/white-arrow.png'), + }, + ], + }, + { + title: 'GENERAL', + data: [ + { + title: 'Terms of use', + preimage: require('../../assets/images/settings/termsofuse.png'), + postimage: require('../../assets/images/settings/white-arrow.png'), + }, + { + title: 'Privacy Policy', + preimage: require('../../assets/images/settings/privacypolicy.png'), + postimage: require('../../assets/images/settings/white-arrow.png'), + }, + ], + }, +]; + +const SettingsScreen: React.FC = () => { + const dispatch = useDispatch(); + const navigation = useNavigation(); + const {suggested_people_linked} = useSelector( + (state: RootState) => state.user.profile, + ); + const goToUpdateSPProfile = () => { + if (suggested_people_linked === 0) { + Alert.alert(ERROR_ATTEMPT_EDIT_SP); + } else { + // Sending undefined for updatedSelectedBadges to mark that there was no update yet + navigateTo('UpdateSPPicture', { + editing: true, + }); + } + }; + + const navigateTo = (screen: string, options: object) => { + navigation.navigate(screen, options); + }; + + const getActions = (type: string) => { + switch (type) { + case 'Suggested People Profile': + goToUpdateSPProfile(); + break; + case 'Privacy': + navigateTo('PrivacyScreen', {}); + break; + case 'Terms of use': + //TODO: + break; + case 'Privacy Policy': + //TODO: + break; + default: + break; + } + }; + + const Item = ({ + title, + preimage, + postimage, + }: { + title: string; + preimage: number; + postimage: number; + }) => ( + getActions(title)} style={styles.item}> + + + {title} + + + + ); + + return ( + <> + + + + + item.title + index} + renderItem={({item: {title, preimage, postimage}}) => { + return ; + }} + renderSectionHeader={({section: {title}}) => ( + + {title} + + )} + ListFooterComponent={() => ( + { + navigation.reset({ + index: 0, + routes: [{name: 'SuggestedPeople'}], + }); + dispatch(logout()); + }}> + Logout + + )} + /> + + + + + ); +}; + +const styles = StyleSheet.create({ + container: { + flex: 1, + }, + item: { + marginTop: 36, + flexDirection: 'row', + justifyContent: 'flex-start', + alignItems: 'center', + }, + header: { + fontSize: normalize(18), + fontWeight: '600', + lineHeight: normalize(21.48), + color: '#E9E9E9', + }, + title: { + fontSize: normalize(15), + fontWeight: '600', + lineHeight: normalize(17.9), + color: 'white', + }, + logoutStyle: { + fontSize: normalize(20), + fontWeight: '600', + lineHeight: normalize(23.87), + color: 'white', + }, +}); + +export default SettingsScreen; diff --git a/src/screens/profile/index.ts b/src/screens/profile/index.ts index f74946a6..b7efdd3b 100644 --- a/src/screens/profile/index.ts +++ b/src/screens/profile/index.ts @@ -7,3 +7,6 @@ export {default as FriendsListScreen} from './FriendsListScreen'; export {default as EditProfile} from './EditProfile'; export {default as MomentUploadPromptScreen} from './MomentUploadPromptScreen'; export {default as InviteFriendsScreen} from './InviteFriendsScreen'; +export {default as SettingsScreen} from './SettingsScreen'; +export {default as PrivacyScreen} from './PrivacyScreen'; +export {default as AccountType} from './AccountType'; diff --git a/src/store/actions/user.ts b/src/store/actions/user.ts index 46f96d9a..cb5e3dc1 100644 --- a/src/store/actions/user.ts +++ b/src/store/actions/user.ts @@ -1,3 +1,4 @@ +import AsyncStorage from '@react-native-community/async-storage'; import {Action, ThunkAction} from '@reduxjs/toolkit'; import { getProfilePic, @@ -157,6 +158,7 @@ export const logout = (): ThunkAction< Action > => async (dispatch) => { try { + AsyncStorage.clear(); dispatch({type: userLoggedIn.type, payload: {userId: '', username: ''}}); } catch (error) { console.log(error); -- cgit v1.2.3-70-g09d2 From ff3f0acadf810cd1b5bf276b9ee926f2c480b7be Mon Sep 17 00:00:00 2001 From: ankit-thanekar007 Date: Wed, 17 Mar 2021 16:09:08 -0700 Subject: TMA 700, Lock image added --- src/assets/images/settings/lock-white.png | Bin 0 -> 416 bytes src/assets/images/settings/lock-white@2x.png | Bin 0 -> 723 bytes src/assets/images/settings/lock-white@3x.png | Bin 0 -> 1000 bytes src/screens/profile/PrivacyScreen.tsx | 28 +++++++++------------------ src/screens/profile/SettingsScreen.tsx | 8 ++++++-- 5 files changed, 15 insertions(+), 21 deletions(-) create mode 100644 src/assets/images/settings/lock-white.png create mode 100644 src/assets/images/settings/lock-white@2x.png create mode 100644 src/assets/images/settings/lock-white@3x.png (limited to 'src') diff --git a/src/assets/images/settings/lock-white.png b/src/assets/images/settings/lock-white.png new file mode 100644 index 00000000..04a0a55d Binary files /dev/null and b/src/assets/images/settings/lock-white.png differ diff --git a/src/assets/images/settings/lock-white@2x.png b/src/assets/images/settings/lock-white@2x.png new file mode 100644 index 00000000..b1927922 Binary files /dev/null and b/src/assets/images/settings/lock-white@2x.png differ diff --git a/src/assets/images/settings/lock-white@3x.png b/src/assets/images/settings/lock-white@3x.png new file mode 100644 index 00000000..da9ac212 Binary files /dev/null and b/src/assets/images/settings/lock-white@3x.png differ diff --git a/src/screens/profile/PrivacyScreen.tsx b/src/screens/profile/PrivacyScreen.tsx index e92769fc..eea0230a 100644 --- a/src/screens/profile/PrivacyScreen.tsx +++ b/src/screens/profile/PrivacyScreen.tsx @@ -10,7 +10,7 @@ import { View, } from 'react-native'; import {SafeAreaView} from 'react-native-safe-area-context'; -import {normalize} from '../../utils/layouts'; +import {normalize, SCREEN_WIDTH} from '../../utils/layouts'; import {Background} from '../../components'; import {BackgroundGradientType} from '../../types'; import {logout} from '../../store/actions'; @@ -25,7 +25,7 @@ const DATA = [ data: [ { title: 'Account Type', - preimage: require('../../assets/images/tagg-logo.png'), + preimage: require('../../assets/images/settings/lock-white.png'), postimage: require('../../assets/images/settings/white-arrow.png'), }, { @@ -38,30 +38,16 @@ const DATA = [ ]; const PrivacyScreen: React.FC = () => { - const dispatch = useDispatch(); const navigation = useNavigation(); - const {suggested_people_linked} = useSelector( - (state: RootState) => state.user.profile, - ); - const goToUpdateSPProfile = () => { - if (suggested_people_linked === 0) { - Alert.alert(ERROR_ATTEMPT_EDIT_SP); - } else { - // Sending undefined for updatedSelectedBadges to mark that there was no update yet - navigation.navigate('UpdateSPPicture', { - editing: true, - }); - } - }; const getActions = (type: string) => { switch (type) { case 'Account Type': navigateTo('AccountTypeScreen', {}); - break + break; case 'Blocked Accounts': navigateTo('Blocked Accounts', {}); - break + break; default: break; } @@ -81,7 +67,11 @@ const PrivacyScreen: React.FC = () => { postimage: number; }) => ( getActions(title)} style={styles.item}> - + {title} diff --git a/src/screens/profile/SettingsScreen.tsx b/src/screens/profile/SettingsScreen.tsx index 79633572..f9d437d0 100644 --- a/src/screens/profile/SettingsScreen.tsx +++ b/src/screens/profile/SettingsScreen.tsx @@ -10,7 +10,7 @@ import { View, } from 'react-native'; import {SafeAreaView} from 'react-native-safe-area-context'; -import {normalize} from '../../utils/layouts'; +import {normalize, SCREEN_WIDTH} from '../../utils/layouts'; import {Background} from '../../components'; import {BackgroundGradientType} from '../../types'; import {logout} from '../../store/actions'; @@ -102,7 +102,11 @@ const SettingsScreen: React.FC = () => { postimage: number; }) => ( getActions(title)} style={styles.item}> - + {title} -- cgit v1.2.3-70-g09d2 From 7a521127177838bcae0cd85b2e5bd912c46406b9 Mon Sep 17 00:00:00 2001 From: ankit-thanekar007 Date: Thu, 25 Mar 2021 13:51:14 -0700 Subject: Added API for updating account toggle --- src/constants/strings.ts | 1 + src/screens/profile/AccountType.tsx | 31 +++++++++++++++-------- src/screens/profile/PrivacyScreen.tsx | 17 +++++++------ src/services/UserProfileService.ts | 47 ++++++++++++++++++++++++++++++++++- 4 files changed, 77 insertions(+), 19 deletions(-) (limited to 'src') diff --git a/src/constants/strings.ts b/src/constants/strings.ts index 019d0bea..4f792dcc 100644 --- a/src/constants/strings.ts +++ b/src/constants/strings.ts @@ -31,6 +31,7 @@ export const ERROR_NEXT_PAGE = 'There was a problem while loading the next page export const ERROR_NOT_ONBOARDED = 'You are now on waitlist, please enter your invitation code if you have one'; export const ERROR_PHONE_IN_USE = 'Phone already in use, please try another one'; export const ERROR_PROFILE_CREATION_SHORT = 'Profile creation failed 😓'; +export const ERROR_PROFILE_UPDATE_SHORT = 'Profile update failed. 😔'; export const ERROR_PWD_ACCOUNT = (str: string) => `Please make sure that the email / username entered is registered with us. You may contact our customer support at ${str}`; export const ERROR_REGISTRATION = (str: string) => `Registration failed 😔, ${str}`; export const ERROR_SELECT_BIRTHDAY = 'Please select your birthday'; diff --git a/src/screens/profile/AccountType.tsx b/src/screens/profile/AccountType.tsx index dedf4420..e1e19389 100644 --- a/src/screens/profile/AccountType.tsx +++ b/src/screens/profile/AccountType.tsx @@ -1,22 +1,33 @@ -import React, {useEffect, useState} from 'react'; +import React, {useState} from 'react'; import {StatusBar, StyleSheet, Switch, Text, View} from 'react-native'; import {SafeAreaView} from 'react-native-safe-area-context'; +import {useDispatch, useSelector} from 'react-redux'; import {Background} from '../../components'; +import {updateProfileVisibility} from '../../services'; +import {NO_PROFILE} from '../../store/initialStates'; +import {RootState} from '../../store/rootReducer'; import {BackgroundGradientType} from '../../types'; +import {getTokenOrLogout} from '../../utils'; import {normalize} from '../../utils/layouts'; const AccountType: React.FC = () => { const [isPrivateAccount, setIsPrivateAccount] = useState(false); - const switchAccountType = () => - setIsPrivateAccount((previousState) => !previousState); + const { + user: {userId, username}, + profile: {is_private} = NO_PROFILE, + } = useSelector((state: RootState) => state.user); - useEffect(() => { - // Fetching from Redux and Set the result - // setIsPrivateAccount(true); - }, []); + const dispatch = useDispatch(); + + const updateAccountVisibility = async () => { + const isPrivate = !isPrivateAccount; + setIsPrivateAccount(isPrivate); + const token = await getTokenOrLogout(dispatch); + updateProfileVisibility(token, {userId, username}, isPrivate, dispatch); + }; const getAccountText = () => { - return isPrivateAccount ? 'Private Account' : 'Public Account'; + return is_private ? 'Private Account' : 'Public Account'; }; return ( @@ -37,8 +48,8 @@ const AccountType: React.FC = () => { borderWidth: 2, borderColor: 'white', }} - value={isPrivateAccount} - onValueChange={switchAccountType}> + value={is_private} + onValueChange={updateAccountVisibility}> diff --git a/src/screens/profile/PrivacyScreen.tsx b/src/screens/profile/PrivacyScreen.tsx index eea0230a..37f042af 100644 --- a/src/screens/profile/PrivacyScreen.tsx +++ b/src/screens/profile/PrivacyScreen.tsx @@ -1,6 +1,6 @@ +import {useNavigation} from '@react-navigation/core'; import React from 'react'; import { - Alert, Image, SectionList, StatusBar, @@ -10,14 +10,12 @@ import { View, } from 'react-native'; import {SafeAreaView} from 'react-native-safe-area-context'; -import {normalize, SCREEN_WIDTH} from '../../utils/layouts'; +import {useSelector} from 'react-redux'; +import {RootState} from 'src/store/rootReducer'; import {Background} from '../../components'; +import {NO_PROFILE} from '../../store/initialStates'; import {BackgroundGradientType} from '../../types'; -import {logout} from '../../store/actions'; -import {useDispatch, useSelector} from 'react-redux'; -import {useNavigation} from '@react-navigation/core'; -import {RootState} from 'src/store/rootReducer'; -import {ERROR_ATTEMPT_EDIT_SP} from '../../constants/strings'; +import {normalize, SCREEN_WIDTH} from '../../utils/layouts'; const DATA = [ { @@ -39,6 +37,9 @@ const DATA = [ const PrivacyScreen: React.FC = () => { const navigation = useNavigation(); + const {profile: {is_private} = NO_PROFILE} = useSelector( + (state: RootState) => state.user, + ); const getActions = (type: string) => { switch (type) { @@ -78,7 +79,7 @@ const PrivacyScreen: React.FC = () => { {title === 'Account Type' && ( - {'Private'} + {is_private ? 'Private' : 'Public'} )} diff --git a/src/services/UserProfileService.ts b/src/services/UserProfileService.ts index 085787c3..c1901be1 100644 --- a/src/services/UserProfileService.ts +++ b/src/services/UserProfileService.ts @@ -1,6 +1,8 @@ import AsyncStorage from '@react-native-community/async-storage'; import moment from 'moment'; +import {useEffect} from 'react'; import {Alert} from 'react-native'; +import {loadUserData} from '../store/actions'; import { EDIT_PROFILE_ENDPOINT, GET_FB_POSTS_ENDPOINT, @@ -20,6 +22,7 @@ import { ERROR_DOUBLE_CHECK_CONNECTION, ERROR_DUP_OLD_PWD, ERROR_INVALID_PWD_CODE, + ERROR_PROFILE_UPDATE_SHORT, ERROR_PWD_ACCOUNT, ERROR_SOMETHING_WENT_WRONG, ERROR_SOMETHING_WENT_WRONG_REFRESH, @@ -27,7 +30,12 @@ import { SUCCESS_PWD_RESET, SUCCESS_VERIFICATION_CODE_SENT, } from '../constants/strings'; -import {ProfileInfoType, ProfileType, SocialAccountType} from '../types'; +import { + ProfileInfoType, + ProfileType, + SocialAccountType, + UserType, +} from '../types'; export const loadProfileInfo = async (token: string, userId: string) => { try { @@ -75,6 +83,43 @@ export const getProfilePic = async ( } }; +export const updateProfileVisibility = async ( + token: string, + user: UserType, + isPrivateAccount: Boolean, + dispatch: Function, +) => { + try { + const url = EDIT_PROFILE_ENDPOINT + `${user.userId}/`; + const request = new FormData(); + request.append('is_private', isPrivateAccount); + let response = await fetch(url, { + method: 'PATCH', + headers: { + 'Content-Type': 'application/json', + Authorization: 'Token ' + token, + }, + body: request, + }); + const {status} = response; + let data = await response.json(); + if (status === 200) { + dispatch(loadUserData(user)); + } else if (status >= 400) { + Alert.alert( + ERROR_PROFILE_UPDATE_SHORT, + data.error || 'Something went wrong! 😭', + ); + } + } catch (error) { + Alert.alert(ERROR_PROFILE_UPDATE_SHORT, ERROR_DOUBLE_CHECK_CONNECTION); + return { + name: 'Profile update error', + description: error, + }; + } +}; + const integratedSocialPostsEndpoints: {[social: string]: string} = { Facebook: GET_FB_POSTS_ENDPOINT, Instagram: GET_IG_POSTS_ENDPOINT, -- cgit v1.2.3-70-g09d2 From 57a06ec668a24118dd2bbfef149be71d79acf94c Mon Sep 17 00:00:00 2001 From: ankit-thanekar007 Date: Thu, 25 Mar 2021 16:14:29 -0700 Subject: Refactoring changes --- src/constants/constants.ts | 52 +++++++++++ src/screens/profile/AccountType.tsx | 70 ++++++++++----- src/screens/profile/PrivacyScreen.tsx | 124 +++----------------------- src/screens/profile/SettingsCell.tsx | 113 +++++++++++++++++++++++ src/screens/profile/SettingsScreen.tsx | 158 +++++---------------------------- src/services/UserProfileService.ts | 7 +- 6 files changed, 253 insertions(+), 271 deletions(-) create mode 100644 src/screens/profile/SettingsCell.tsx (limited to 'src') diff --git a/src/constants/constants.ts b/src/constants/constants.ts index d24e352e..91029b3a 100644 --- a/src/constants/constants.ts +++ b/src/constants/constants.ts @@ -186,3 +186,55 @@ export const SP_WIDTH = 375; export const SP_HEIGHT = 812; export const SP_PAGE_SIZE = 5; + +export const SETTINGS_DATA = { + SettingsAndPrivacy: [ + { + title: 'ACCOUNT', + data: [ + { + title: 'Suggested People Profile', + preimage: require('../assets/images/tagg-logo.png'), + postimage: require('../assets/images/settings/white-arrow.png'), + }, + { + title: 'Privacy', + preimage: require('../assets/images/settings/settings-white.png'), + postimage: require('../assets/images/settings/white-arrow.png'), + }, + ], + }, + { + title: 'GENERAL', + data: [ + { + title: 'Terms of use', + preimage: require('../assets/images/settings/termsofuse.png'), + postimage: require('../assets/images/settings/white-arrow.png'), + }, + { + title: 'Privacy Policy', + preimage: require('../assets/images/settings/privacypolicy.png'), + postimage: require('../assets/images/settings/white-arrow.png'), + }, + ], + }, + ], + PrivacyScreen: [ + { + title: '', + data: [ + { + title: 'Account Type', + preimage: require('../assets/images/settings/lock-white.png'), + postimage: require('../assets/images/settings/white-arrow.png'), + }, + { + title: 'Blocked Accounts', + preimage: require('../assets/images/settings/blocked-white.png'), + postimage: require('../assets/images/settings/white-arrow.png'), + }, + ], + }, + ], +}; diff --git a/src/screens/profile/AccountType.tsx b/src/screens/profile/AccountType.tsx index e1e19389..8c700cef 100644 --- a/src/screens/profile/AccountType.tsx +++ b/src/screens/profile/AccountType.tsx @@ -1,5 +1,12 @@ import React, {useState} from 'react'; -import {StatusBar, StyleSheet, Switch, Text, View} from 'react-native'; +import { + ActivityIndicator, + StatusBar, + StyleSheet, + Switch, + Text, + View, +} from 'react-native'; import {SafeAreaView} from 'react-native-safe-area-context'; import {useDispatch, useSelector} from 'react-redux'; import {Background} from '../../components'; @@ -12,6 +19,7 @@ import {normalize} from '../../utils/layouts'; const AccountType: React.FC = () => { const [isPrivateAccount, setIsPrivateAccount] = useState(false); + const [isLoading, setIsLoading] = useState(false); const { user: {userId, username}, profile: {is_private} = NO_PROFILE, @@ -20,10 +28,17 @@ const AccountType: React.FC = () => { const dispatch = useDispatch(); const updateAccountVisibility = async () => { + setIsLoading(true); const isPrivate = !isPrivateAccount; setIsPrivateAccount(isPrivate); const token = await getTokenOrLogout(dispatch); - updateProfileVisibility(token, {userId, username}, isPrivate, dispatch); + await updateProfileVisibility( + token, + {userId, username}, + isPrivate, + dispatch, + ); + setIsLoading(false); }; const getAccountText = () => { @@ -35,24 +50,29 @@ const AccountType: React.FC = () => { - - + + {getAccountText()} - + + + {!isLoading && ( + + )} + - + Enabling a public account will: @@ -71,16 +91,20 @@ const AccountType: React.FC = () => { }; const styles = StyleSheet.create({ - container: { - flex: 1, - }, + container: {marginHorizontal: '8%', marginTop: '20%'}, title: { fontSize: normalize(18), fontWeight: '600', lineHeight: normalize(17.9), color: 'white', }, - + switchContainerStyle: { + flexDirection: 'row', + alignItems: 'center', + position: 'absolute', + right: 0, + }, + detailContainerStyle: {marginTop: '40%'}, detailTitleStyle: { fontSize: normalize(19), fontWeight: '700', @@ -93,6 +117,10 @@ const styles = StyleSheet.create({ lineHeight: normalize(16.71), color: 'white', }, + switchStyles: { + borderWidth: 2, + borderColor: 'white', + }, }); export default AccountType; diff --git a/src/screens/profile/PrivacyScreen.tsx b/src/screens/profile/PrivacyScreen.tsx index 37f042af..d91c7841 100644 --- a/src/screens/profile/PrivacyScreen.tsx +++ b/src/screens/profile/PrivacyScreen.tsx @@ -1,114 +1,40 @@ import {useNavigation} from '@react-navigation/core'; import React from 'react'; import { - Image, SectionList, StatusBar, StyleSheet, - Text, - TouchableOpacity, View, + SafeAreaView, } from 'react-native'; -import {SafeAreaView} from 'react-native-safe-area-context'; import {useSelector} from 'react-redux'; import {RootState} from 'src/store/rootReducer'; import {Background} from '../../components'; import {NO_PROFILE} from '../../store/initialStates'; import {BackgroundGradientType} from '../../types'; -import {normalize, SCREEN_WIDTH} from '../../utils/layouts'; - -const DATA = [ - { - title: '', - data: [ - { - title: 'Account Type', - preimage: require('../../assets/images/settings/lock-white.png'), - postimage: require('../../assets/images/settings/white-arrow.png'), - }, - { - title: 'Blocked Accounts', - preimage: require('../../assets/images/settings/blocked-white.png'), - postimage: require('../../assets/images/settings/white-arrow.png'), - }, - ], - }, -]; +import {normalize} from '../../utils/layouts'; +import SettingsCell from './SettingsCell'; +import {SETTINGS_DATA} from '../../constants/constants'; const PrivacyScreen: React.FC = () => { - const navigation = useNavigation(); const {profile: {is_private} = NO_PROFILE} = useSelector( (state: RootState) => state.user, ); - const getActions = (type: string) => { - switch (type) { - case 'Account Type': - navigateTo('AccountTypeScreen', {}); - break; - case 'Blocked Accounts': - navigateTo('Blocked Accounts', {}); - break; - default: - break; - } - }; - - const navigateTo = (screen: string, options: object) => { - navigation.navigate(screen, options); - }; - - const Item = ({ - title, - preimage, - postimage, - }: { - title: string; - preimage: number; - postimage: number; - }) => ( - getActions(title)} style={styles.item}> - - - {title} - - - {title === 'Account Type' && ( - - {is_private ? 'Private' : 'Public'} - - )} - - - - ); - return ( <> - + item.title + index} - renderItem={({item: {title, preimage, postimage}}) => { - return ; - }} - renderSectionHeader={({section: {title}}) => { - if (title.length === 0) { - return null; - } - return ( - - {title} - - ); - }} + renderItem={({item: {title, preimage, postimage}}) => ( + + )} /> @@ -118,33 +44,7 @@ const PrivacyScreen: React.FC = () => { }; const styles = StyleSheet.create({ - container: { - flex: 1, - }, - item: { - marginTop: 36, - flexDirection: 'row', - justifyContent: 'flex-start', - alignItems: 'center', - }, - header: { - fontSize: normalize(18), - fontWeight: '600', - lineHeight: normalize(21.48), - color: '#E9E9E9', - }, - title: { - fontSize: normalize(15), - fontWeight: '600', - lineHeight: normalize(17.9), - color: 'white', - }, - logoutStyle: { - fontSize: normalize(20), - fontWeight: '600', - lineHeight: normalize(23.87), - color: 'white', - }, + container: {marginHorizontal: '8%', marginTop: '8%'}, }); export default PrivacyScreen; diff --git a/src/screens/profile/SettingsCell.tsx b/src/screens/profile/SettingsCell.tsx new file mode 100644 index 00000000..29dcc691 --- /dev/null +++ b/src/screens/profile/SettingsCell.tsx @@ -0,0 +1,113 @@ +import {useNavigation} from '@react-navigation/core'; +import React from 'react'; +import { + Alert, + Image, + StyleSheet, + Text, + TouchableOpacity, + View, +} from 'react-native'; +import {ERROR_ATTEMPT_EDIT_SP} from '../../constants/strings'; +import {normalize, SCREEN_WIDTH} from '../../utils/layouts'; + +type SettingsCellProps = { + title: string; + preimage: number; + postimage: number; + isPrivate?: boolean; + suggested_people_linked?: number; +}; + +const SettingsCell: React.FC = ({ + title, + preimage, + postimage, + isPrivate, + suggested_people_linked, +}) => { + const navigation = useNavigation(); + const goToUpdateSPProfile = () => { + if (suggested_people_linked === 0) { + Alert.alert(ERROR_ATTEMPT_EDIT_SP); + } else { + // Sending undefined for updatedSelectedBadges to mark that there was no update yet + navigateTo('UpdateSPPicture', { + editing: true, + }); + } + }; + const getActions = (type: string) => { + switch (type) { + case 'Account Type': + navigateTo('AccountTypeScreen', {}); + break; + case 'Blocked Accounts': + navigateTo('Blocked Accounts', {}); + break; + case 'Suggested People Profile': + goToUpdateSPProfile(); + break; + case 'Privacy': + navigateTo('PrivacyScreen', {}); + break; + case 'Terms of use': + //TODO: + break; + case 'Privacy Policy': + //TODO: + break; + default: + break; + } + }; + + const navigateTo = (screen: string, options: object) => { + navigation.navigate(screen, options); + }; + return ( + getActions(title)} + style={styles.itemStyles}> + + + {title} + + + {title === 'Account Type' && ( + + {isPrivate ? 'Private' : 'Public'} + + )} + + + + ); +}; + +const styles = StyleSheet.create({ + container: {marginHorizontal: '8%'}, + itemStyles: { + marginTop: 36, + flexDirection: 'row', + justifyContent: 'flex-start', + alignItems: 'center', + }, + subItemStyles: {position: 'absolute', right: 0}, + preImageStyles: {width: SCREEN_WIDTH * 0.05, height: SCREEN_WIDTH * 0.05}, + postImageStyles: {width: 15, height: 15}, + titleContainerStyles: {marginLeft: '12%'}, + titleStyles: { + fontSize: normalize(15), + fontWeight: '600', + lineHeight: normalize(17.9), + color: 'white', + }, + subtitleStyles: {color: '#C4C4C4', marginRight: 13}, +}); + +export default SettingsCell; diff --git a/src/screens/profile/SettingsScreen.tsx b/src/screens/profile/SettingsScreen.tsx index f9d437d0..cb049a96 100644 --- a/src/screens/profile/SettingsScreen.tsx +++ b/src/screens/profile/SettingsScreen.tsx @@ -1,150 +1,50 @@ import React from 'react'; import { - Alert, - Image, SectionList, StatusBar, StyleSheet, Text, TouchableOpacity, + SafeAreaView, View, } from 'react-native'; -import {SafeAreaView} from 'react-native-safe-area-context'; -import {normalize, SCREEN_WIDTH} from '../../utils/layouts'; +import {useSelector} from 'react-redux'; +import {RootState} from 'src/store/rootReducer'; import {Background} from '../../components'; import {BackgroundGradientType} from '../../types'; -import {logout} from '../../store/actions'; -import {useDispatch, useSelector} from 'react-redux'; -import {useNavigation} from '@react-navigation/core'; -import {RootState} from 'src/store/rootReducer'; -import {ERROR_ATTEMPT_EDIT_SP} from '../../constants/strings'; - -const DATA = [ - { - title: 'ACCOUNT', - data: [ - { - title: 'Suggested People Profile', - preimage: require('../../assets/images/tagg-logo.png'), - postimage: require('../../assets/images/settings/white-arrow.png'), - }, - { - title: 'Privacy', - preimage: require('../../assets/images/settings/settings-white.png'), - postimage: require('../../assets/images/settings/white-arrow.png'), - }, - ], - }, - { - title: 'GENERAL', - data: [ - { - title: 'Terms of use', - preimage: require('../../assets/images/settings/termsofuse.png'), - postimage: require('../../assets/images/settings/white-arrow.png'), - }, - { - title: 'Privacy Policy', - preimage: require('../../assets/images/settings/privacypolicy.png'), - postimage: require('../../assets/images/settings/white-arrow.png'), - }, - ], - }, -]; +import {normalize} from '../../utils/layouts'; +import SettingsCell from './SettingsCell'; +import {SETTINGS_DATA} from '../../constants/constants'; const SettingsScreen: React.FC = () => { - const dispatch = useDispatch(); - const navigation = useNavigation(); const {suggested_people_linked} = useSelector( (state: RootState) => state.user.profile, ); - const goToUpdateSPProfile = () => { - if (suggested_people_linked === 0) { - Alert.alert(ERROR_ATTEMPT_EDIT_SP); - } else { - // Sending undefined for updatedSelectedBadges to mark that there was no update yet - navigateTo('UpdateSPPicture', { - editing: true, - }); - } - }; - - const navigateTo = (screen: string, options: object) => { - navigation.navigate(screen, options); - }; - - const getActions = (type: string) => { - switch (type) { - case 'Suggested People Profile': - goToUpdateSPProfile(); - break; - case 'Privacy': - navigateTo('PrivacyScreen', {}); - break; - case 'Terms of use': - //TODO: - break; - case 'Privacy Policy': - //TODO: - break; - default: - break; - } - }; - - const Item = ({ - title, - preimage, - postimage, - }: { - title: string; - preimage: number; - postimage: number; - }) => ( - getActions(title)} style={styles.item}> - - - {title} - - - - ); return ( <> - + item.title + index} - renderItem={({item: {title, preimage, postimage}}) => { - return ; - }} + renderItem={({item: {title, preimage, postimage}}) => ( + + )} renderSectionHeader={({section: {title}}) => ( - - {title} + + {title} )} ListFooterComponent={() => ( { - navigation.reset({ - index: 0, - routes: [{name: 'SuggestedPeople'}], - }); - dispatch(logout()); - }}> - Logout + style={styles.logoutContainerStyles} + onPress={() => {}}> + Logout )} /> @@ -156,28 +56,16 @@ const SettingsScreen: React.FC = () => { }; const styles = StyleSheet.create({ - container: { - flex: 1, - }, - item: { - marginTop: 36, - flexDirection: 'row', - justifyContent: 'flex-start', - alignItems: 'center', - }, - header: { + container: {marginHorizontal: '8%', marginTop: '8%'}, + headerContainerStyles: {marginTop: '14%'}, + headerTextStyles: { fontSize: normalize(18), fontWeight: '600', lineHeight: normalize(21.48), color: '#E9E9E9', }, - title: { - fontSize: normalize(15), - fontWeight: '600', - lineHeight: normalize(17.9), - color: 'white', - }, - logoutStyle: { + logoutContainerStyles: {marginTop: '20%', marginLeft: '12%'}, + logoutTextStyles: { fontSize: normalize(20), fontWeight: '600', lineHeight: normalize(23.87), diff --git a/src/services/UserProfileService.ts b/src/services/UserProfileService.ts index c1901be1..1ce1d0b5 100644 --- a/src/services/UserProfileService.ts +++ b/src/services/UserProfileService.ts @@ -92,11 +92,11 @@ export const updateProfileVisibility = async ( try { const url = EDIT_PROFILE_ENDPOINT + `${user.userId}/`; const request = new FormData(); - request.append('is_private', isPrivateAccount); + request.append('is_private', isPrivateAccount ? 'True' : 'False'); let response = await fetch(url, { method: 'PATCH', headers: { - 'Content-Type': 'application/json', + 'Content-Type': 'multipart/form-data', Authorization: 'Token ' + token, }, body: request, @@ -104,7 +104,7 @@ export const updateProfileVisibility = async ( const {status} = response; let data = await response.json(); if (status === 200) { - dispatch(loadUserData(user)); + await dispatch(loadUserData(user)); } else if (status >= 400) { Alert.alert( ERROR_PROFILE_UPDATE_SHORT, @@ -112,6 +112,7 @@ export const updateProfileVisibility = async ( ); } } catch (error) { + debugger; Alert.alert(ERROR_PROFILE_UPDATE_SHORT, ERROR_DOUBLE_CHECK_CONNECTION); return { name: 'Profile update error', -- cgit v1.2.3-70-g09d2 From 3802fbd5d7f7c9ca70060f53af993356d946483d Mon Sep 17 00:00:00 2001 From: ankit-thanekar007 Date: Mon, 29 Mar 2021 12:45:36 -0700 Subject: TOU and PP updates --- src/components/profile/ProfileMoreInfoDrawer.tsx | 2 +- src/constants/api.ts | 4 +++ src/constants/constants.ts | 12 +++---- src/screens/profile/SettingsCell.tsx | 41 +++++++++++++++++++++--- 4 files changed, 48 insertions(+), 11 deletions(-) (limited to 'src') diff --git a/src/components/profile/ProfileMoreInfoDrawer.tsx b/src/components/profile/ProfileMoreInfoDrawer.tsx index d62063a7..f70f90d0 100644 --- a/src/components/profile/ProfileMoreInfoDrawer.tsx +++ b/src/components/profile/ProfileMoreInfoDrawer.tsx @@ -35,7 +35,7 @@ const ProfileMoreInfoDrawer: React.FC = (props) => { setIsOpen(false); }; - const goToUpdateSPProfile = () => { + const goToSettingsPage = () => { if (profile.suggested_people_linked === 0) { Alert.alert(ERROR_ATTEMPT_EDIT_SP); } else { diff --git a/src/constants/api.ts b/src/constants/api.ts index 6afdf384..22890c33 100644 --- a/src/constants/api.ts +++ b/src/constants/api.ts @@ -64,3 +64,7 @@ export const DEEPLINK: string = 'https://tinyurl.com/y3o4aec5'; export const LINK_IG_OAUTH: string = `https://www.instagram.com/oauth/authorize/?client_id=205466150510738&redirect_uri=${DEEPLINK}&scope=user_profile,user_media&response_type=code`; export const LINK_FB_OAUTH: string = `https://www.facebook.com/v8.0/dialog/oauth?client_id=1308555659343609&redirect_uri=${DEEPLINK}&scope=user_posts,public_profile&response_type=code`; export const LINK_TWITTER_OAUTH: string = API_URL + 'link-twitter-request/'; + +// Profile Links +export const COMMUNITY_GUIDELINES: string = 'https://www.tagg.id/community-guidelines'; +export const PRIVACY_POLICY: string = 'https://www.tagg.id/privacy-policy'; diff --git a/src/constants/constants.ts b/src/constants/constants.ts index 91029b3a..f533563d 100644 --- a/src/constants/constants.ts +++ b/src/constants/constants.ts @@ -208,7 +208,7 @@ export const SETTINGS_DATA = { title: 'GENERAL', data: [ { - title: 'Terms of use', + title: 'Community Guidelines', preimage: require('../assets/images/settings/termsofuse.png'), postimage: require('../assets/images/settings/white-arrow.png'), }, @@ -229,11 +229,11 @@ export const SETTINGS_DATA = { preimage: require('../assets/images/settings/lock-white.png'), postimage: require('../assets/images/settings/white-arrow.png'), }, - { - title: 'Blocked Accounts', - preimage: require('../assets/images/settings/blocked-white.png'), - postimage: require('../assets/images/settings/white-arrow.png'), - }, + // { + // title: 'Blocked Accounts', + // preimage: require('../assets/images/settings/blocked-white.png'), + // postimage: require('../assets/images/settings/white-arrow.png'), + // }, ], }, ], diff --git a/src/screens/profile/SettingsCell.tsx b/src/screens/profile/SettingsCell.tsx index 29dcc691..f5360242 100644 --- a/src/screens/profile/SettingsCell.tsx +++ b/src/screens/profile/SettingsCell.tsx @@ -3,11 +3,15 @@ import React from 'react'; import { Alert, Image, + Linking, StyleSheet, Text, TouchableOpacity, View, } from 'react-native'; +import InAppBrowser from 'react-native-inappbrowser-reborn'; +import {TAGG_PURPLE} from '../../constants'; +import {COMMUNITY_GUIDELINES, PRIVACY_POLICY} from '../../constants/api'; import {ERROR_ATTEMPT_EDIT_SP} from '../../constants/strings'; import {normalize, SCREEN_WIDTH} from '../../utils/layouts'; @@ -43,7 +47,7 @@ const SettingsCell: React.FC = ({ navigateTo('AccountTypeScreen', {}); break; case 'Blocked Accounts': - navigateTo('Blocked Accounts', {}); + //TODO: break; case 'Suggested People Profile': goToUpdateSPProfile(); @@ -51,17 +55,42 @@ const SettingsCell: React.FC = ({ case 'Privacy': navigateTo('PrivacyScreen', {}); break; - case 'Terms of use': - //TODO: + case 'Community Guidelines': + openTaggLink(COMMUNITY_GUIDELINES); break; case 'Privacy Policy': - //TODO: + openTaggLink(PRIVACY_POLICY); break; default: break; } }; + const openTaggLink = async (url: string) => { + try { + if (await InAppBrowser.isAvailable()) { + await InAppBrowser.open(url, { + dismissButtonStyle: 'cancel', + preferredBarTintColor: TAGG_PURPLE, + preferredControlTintColor: 'white', + animated: true, + modalPresentationStyle: 'fullScreen', + modalTransitionStyle: 'coverVertical', + modalEnabled: true, + enableBarCollapsing: false, + animations: { + startEnter: 'slide_in_right', + startExit: 'slide_out_left', + endEnter: 'slide_in_left', + endExit: 'slide_out_right', + }, + }); + } else Linking.openURL(url); + } catch (error) { + Alert.alert(error.message); + } + }; + const navigateTo = (screen: string, options: object) => { navigation.navigate(screen, options); }; @@ -108,6 +137,10 @@ const styles = StyleSheet.create({ color: 'white', }, subtitleStyles: {color: '#C4C4C4', marginRight: 13}, + tc: { + marginVertical: '5%', + top: '8%', + }, }); export default SettingsCell; -- cgit v1.2.3-70-g09d2 From bc1f377dfe4033f2fad28b7852dc09a72e0bd43e Mon Sep 17 00:00:00 2001 From: ankit-thanekar007 Date: Mon, 29 Mar 2021 13:07:51 -0700 Subject: Logout remaining --- src/screens/profile/AccountType.tsx | 38 ++++++++++++++++------------------ src/screens/profile/PrivacyScreen.tsx | 5 ++--- src/screens/profile/SettingsScreen.tsx | 9 ++++---- 3 files changed, 25 insertions(+), 27 deletions(-) (limited to 'src') diff --git a/src/screens/profile/AccountType.tsx b/src/screens/profile/AccountType.tsx index 8c700cef..60ed0668 100644 --- a/src/screens/profile/AccountType.tsx +++ b/src/screens/profile/AccountType.tsx @@ -51,25 +51,23 @@ const AccountType: React.FC = () => { - + {getAccountText()} - - + {!isLoading && ( + - {!isLoading && ( - - )} - + )} @@ -93,6 +91,7 @@ const AccountType: React.FC = () => { const styles = StyleSheet.create({ container: {marginHorizontal: '8%', marginTop: '20%'}, title: { + alignSelf: 'center', fontSize: normalize(18), fontWeight: '600', lineHeight: normalize(17.9), @@ -100,9 +99,8 @@ const styles = StyleSheet.create({ }, switchContainerStyle: { flexDirection: 'row', - alignItems: 'center', - position: 'absolute', - right: 0, + alignContent: 'center', + justifyContent: 'space-between', }, detailContainerStyle: {marginTop: '40%'}, detailTitleStyle: { diff --git a/src/screens/profile/PrivacyScreen.tsx b/src/screens/profile/PrivacyScreen.tsx index d91c7841..17872e24 100644 --- a/src/screens/profile/PrivacyScreen.tsx +++ b/src/screens/profile/PrivacyScreen.tsx @@ -1,4 +1,3 @@ -import {useNavigation} from '@react-navigation/core'; import React from 'react'; import { SectionList, @@ -12,7 +11,7 @@ import {RootState} from 'src/store/rootReducer'; import {Background} from '../../components'; import {NO_PROFILE} from '../../store/initialStates'; import {BackgroundGradientType} from '../../types'; -import {normalize} from '../../utils/layouts'; +import {SCREEN_HEIGHT} from '../../utils/layouts'; import SettingsCell from './SettingsCell'; import {SETTINGS_DATA} from '../../constants/constants'; @@ -44,7 +43,7 @@ const PrivacyScreen: React.FC = () => { }; const styles = StyleSheet.create({ - container: {marginHorizontal: '8%', marginTop: '8%'}, + container: {height: SCREEN_HEIGHT, marginHorizontal: '8%', marginTop: '8%'}, }); export default PrivacyScreen; diff --git a/src/screens/profile/SettingsScreen.tsx b/src/screens/profile/SettingsScreen.tsx index cb049a96..88962f71 100644 --- a/src/screens/profile/SettingsScreen.tsx +++ b/src/screens/profile/SettingsScreen.tsx @@ -1,20 +1,20 @@ import React from 'react'; import { + SafeAreaView, SectionList, StatusBar, StyleSheet, Text, TouchableOpacity, - SafeAreaView, View, } from 'react-native'; import {useSelector} from 'react-redux'; import {RootState} from 'src/store/rootReducer'; import {Background} from '../../components'; +import {SETTINGS_DATA} from '../../constants/constants'; import {BackgroundGradientType} from '../../types'; -import {normalize} from '../../utils/layouts'; +import {normalize, SCREEN_HEIGHT} from '../../utils/layouts'; import SettingsCell from './SettingsCell'; -import {SETTINGS_DATA} from '../../constants/constants'; const SettingsScreen: React.FC = () => { const {suggested_people_linked} = useSelector( @@ -28,6 +28,7 @@ const SettingsScreen: React.FC = () => { item.title + index} renderItem={({item: {title, preimage, postimage}}) => ( @@ -56,7 +57,7 @@ const SettingsScreen: React.FC = () => { }; const styles = StyleSheet.create({ - container: {marginHorizontal: '8%', marginTop: '8%'}, + container: {height: SCREEN_HEIGHT, marginHorizontal: '8%', marginTop: '8%'}, headerContainerStyles: {marginTop: '14%'}, headerTextStyles: { fontSize: normalize(18), -- cgit v1.2.3-70-g09d2 From e8d862e5e6dd8a6a517a93c65e30795813af936d Mon Sep 17 00:00:00 2001 From: ankit-thanekar007 Date: Mon, 29 Mar 2021 13:39:22 -0700 Subject: Logout changes --- src/screens/profile/SettingsScreen.tsx | 14 ++++++++++++-- src/store/actions/user.ts | 2 +- src/utils/users.ts | 2 +- 3 files changed, 14 insertions(+), 4 deletions(-) (limited to 'src') diff --git a/src/screens/profile/SettingsScreen.tsx b/src/screens/profile/SettingsScreen.tsx index 88962f71..05e051b5 100644 --- a/src/screens/profile/SettingsScreen.tsx +++ b/src/screens/profile/SettingsScreen.tsx @@ -8,15 +8,19 @@ import { TouchableOpacity, View, } from 'react-native'; -import {useSelector} from 'react-redux'; +import {useDispatch, useSelector} from 'react-redux'; +import {logout} from '../../store/actions'; import {RootState} from 'src/store/rootReducer'; import {Background} from '../../components'; import {SETTINGS_DATA} from '../../constants/constants'; import {BackgroundGradientType} from '../../types'; import {normalize, SCREEN_HEIGHT} from '../../utils/layouts'; import SettingsCell from './SettingsCell'; +import {useNavigation} from '@react-navigation/core'; const SettingsScreen: React.FC = () => { + const dispatch = useDispatch(); + const navigation = useNavigation(); const {suggested_people_linked} = useSelector( (state: RootState) => state.user.profile, ); @@ -44,7 +48,13 @@ const SettingsScreen: React.FC = () => { ListFooterComponent={() => ( {}}> + onPress={() => { + dispatch(logout()); + navigation.reset({ + index: 0, + routes: [{name: 'SuggestedPeople'}], + }); + }}> Logout )} diff --git a/src/store/actions/user.ts b/src/store/actions/user.ts index cb5e3dc1..374154da 100644 --- a/src/store/actions/user.ts +++ b/src/store/actions/user.ts @@ -158,7 +158,7 @@ export const logout = (): ThunkAction< Action > => async (dispatch) => { try { - AsyncStorage.clear(); + await AsyncStorage.clear(); dispatch({type: userLoggedIn.type, payload: {userId: '', username: ''}}); } catch (error) { console.log(error); diff --git a/src/utils/users.ts b/src/utils/users.ts index f9d6d6b7..22c1c1f0 100644 --- a/src/utils/users.ts +++ b/src/utils/users.ts @@ -133,7 +133,7 @@ export const loadAllSocialsForUser = async (userId: string, token?: string) => { export const getTokenOrLogout = async (dispatch: Function): Promise => { const token = await AsyncStorage.getItem('token'); if (!token) { - dispatch({type: userLoggedIn.type, payload: {userId: '', username: ''}}); + dispatch(logout()); return ''; } return token; -- cgit v1.2.3-70-g09d2 From 95ce5ae02bd571411b861bca6c529bcbdc284486 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Mon, 29 Mar 2021 14:33:28 -0700 Subject: updated value of self on sp --- src/screens/suggestedPeople/SuggestedPeopleScreen.tsx | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) (limited to 'src') diff --git a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx index 336e8b35..a296351f 100644 --- a/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx +++ b/src/screens/suggestedPeople/SuggestedPeopleScreen.tsx @@ -74,12 +74,18 @@ const SuggestedPeopleScreen: React.FC = () => { useEffect(() => { const appendSelf = async () => { - const self = { + const self: SuggestedPeopleDataType = { user: getUserAsProfilePreviewType(state.user.user, state.user.profile), mutual_friends: [], badges: [], social_links: [], suggested_people_url: suggestedPeopleImage, + university: state.user.profile.university, + friendship: { + status: 'no_record', + requester_id: '', + }, + is_private: false, }; people.unshift(self); setPeople(people); -- cgit v1.2.3-70-g09d2