aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/assets/images/private-profile.pngbin0 -> 3750 bytes
-rw-r--r--src/assets/images/private-profile@2x.pngbin0 -> 7999 bytes
-rw-r--r--src/assets/images/private-profile@3x.pngbin0 -> 10081 bytes
-rw-r--r--src/components/common/TaggPrompt.tsx2
-rw-r--r--src/components/profile/Content.tsx304
-rw-r--r--src/components/profile/PrivateProfile.tsx33
-rw-r--r--src/components/profile/ProfileBody.tsx1
-rw-r--r--src/components/profile/PublicProfile.tsx283
-rw-r--r--src/components/taggs/Tagg.tsx30
-rw-r--r--src/components/taggs/TaggsBar.tsx4
-rw-r--r--src/constants/strings.ts1
-rw-r--r--src/screens/suggestedPeople/SPBody.tsx14
-rw-r--r--src/types/types.ts8
-rw-r--r--src/utils/users.ts8
14 files changed, 405 insertions, 283 deletions
diff --git a/src/assets/images/private-profile.png b/src/assets/images/private-profile.png
new file mode 100644
index 00000000..820ba287
--- /dev/null
+++ b/src/assets/images/private-profile.png
Binary files 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
--- /dev/null
+++ b/src/assets/images/private-profile@2x.png
Binary files 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
--- /dev/null
+++ b/src/assets/images/private-profile@3x.png
Binary files 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..9fb6f79b 100644
--- a/src/components/profile/Content.tsx
+++ b/src/components/profile/Content.tsx
@@ -1,62 +1,40 @@
-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 {
+ canViewProfile,
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<number>;
- userXId: string | undefined;
- screenType: ScreenType;
-}
+import PublicProfile from './PublicProfile';
+import TaggsBar from '../taggs/TaggsBar';
const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
const dispatch = useDispatch();
@@ -64,23 +42,6 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
const {user = NO_USER, profile = NO_PROFILE} = userXId
? 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,40 +50,24 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
);
const state = useStore().getState();
- const navigation = useNavigation();
-
/**
* States
*/
- const [imagesMap, setImagesMap] = useState<Map<string, MomentType[]>>(
- new Map(),
- );
const [isFriend, setIsFriend] = useState<boolean>(false);
const [isBlocked, setIsBlocked] = useState<boolean>(false);
const [profileBodyHeight, setProfileBodyHeight] = useState(0);
const [shouldBounce, setShouldBounce] = useState<boolean>(true);
const [refreshing, setRefreshing] = useState<boolean>(false);
- const [isStageTwoPromptClosed, setIsStageTwoPromptClosed] = useState<boolean>(
- false,
- );
- const [isStageOnePromptClosed, setIsStageOnePromptClosed] = useState<boolean>(
- false,
- );
- const [
- isStageThreePromptClosed,
- setIsStageThreePromptClosed,
- ] = useState<boolean>(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);
});
@@ -133,87 +78,19 @@ const Content: React.FC<ContentProps> = ({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,
);
- if (isBlocked != isActuallyBlocked) {
+ if (isBlocked !== isActuallyBlocked) {
setIsBlocked(isActuallyBlocked);
}
}, [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
@@ -234,37 +111,6 @@ const Content: React.FC<ContentProps> = ({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<NativeScrollEvent>) => {
/**
* Set the new y position
@@ -285,6 +131,7 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
return (
<Animated.ScrollView
+ contentContainerStyle={{flexGrow: 1}}
style={styles.container}
onScroll={(e) => handleScroll(e)}
bounces={shouldBounce}
@@ -309,115 +156,36 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
isBlocked,
}}
/>
- <TaggsBar
- {...{y, profileBodyHeight, userXId, screenType}}
- whiteRing={undefined}
- />
- <View style={styles.momentsContainer}>
- {userXId && moments.length === 0 && (
- <View style={styles.plusIconContainer}>
- <GreyPlusLogo width={90} height={90} />
- <Text style={styles.noMomentsText}>{`Looks like ${
- profile.name.split(' ')[0]
- } has not posted any moments yet`}</Text>
- </View>
- )}
- {!userXId &&
- profile.profile_completion_stage === 2 &&
- !isStageTwoPromptClosed && (
- <TaggPrompt
- messageHeader={UPLOAD_MOMENT_PROMPT_TWO_HEADER}
- messageBody={UPLOAD_MOMENT_PROMPT_TWO_MESSAGE}
- logoType=""
- onClose={() => {
- setIsStageTwoPromptClosed(true);
- }}
- />
- )}
- {!userXId &&
- profile.profile_completion_stage === 3 &&
- !isStageThreePromptClosed && (
- <TaggPrompt
- messageHeader={UPLOAD_MOMENT_PROMPT_THREE_HEADER}
- messageBody={UPLOAD_MOMENT_PROMPT_THREE_MESSAGE}
- logoType=""
- onClose={() => {
- setIsStageThreePromptClosed(true);
- }}
- />
- )}
- {momentCategories.map(
- (title, index) =>
- (!userXId || imagesMap.get(title)) && (
- <Moment
- key={index}
- title={title}
- images={imagesMap.get(title)}
- userXId={userXId}
- screenType={screenType}
- handleMomentCategoryDelete={handleCategoryDeletion}
- shouldAllowDeletion={momentCategories.length > 1}
- showUpButton={index !== 0}
- showDownButton={index !== momentCategories.length - 1}
- move={move}
- />
- ),
- )}
- {!userXId && (
- <TouchableOpacity
- onPress={() =>
- navigation.push('CategorySelection', {
- screenType: CategorySelectionScreenType.Profile,
- user: loggedInUser,
- })
- }
- style={styles.createCategoryButton}>
- <Text style={styles.createCategoryButtonLabel}>
- Create a new category
- </Text>
- </TouchableOpacity>
- )}
- </View>
+ {canViewProfile(
+ loggedInUser.userId === user.userId,
+ profile.is_private,
+ isFriend,
+ ) ? (
+ <>
+ <TaggsBar
+ {...{y, profileBodyHeight, userXId, screenType}}
+ whiteRing={undefined}
+ />
+ <PublicProfile {...{y, userXId, screenType}} />
+ </>
+ ) : (
+ <>
+ <TaggsBar
+ {...{y, profileBodyHeight, userXId, screenType}}
+ whiteRing={undefined}
+ allowNavigation={false}
+ />
+ <PrivateProfile />
+ </>
+ )}
</Animated.ScrollView>
);
};
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..07a0dccc
--- /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 (
+ <View style={styles.container}>
+ <Image source={require('../../assets/images/private-profile.png')} />
+ <View style={styles.privateAccountTextContainer}>
+ <Text style={styles.privateAccountTextStyle}>{PRIVATE_ACCOUNT}</Text>
+ </View>
+ </View>
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ alignItems: 'center',
+ justifyContent: 'center',
+ backgroundColor: '#F9F9F9',
+ height: SCREEN_HEIGHT * 0.35,
+ },
+ privateAccountTextContainer: {marginTop: '8%'},
+ privateAccountTextStyle: {
+ fontWeight: '600',
+ fontSize: normalize(18),
+ lineHeight: normalize(25),
+ color: '#828282',
+ },
+});
+
+export default PrivateProfile;
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
new file mode 100644
index 00000000..a70e8e50
--- /dev/null
+++ b/src/components/profile/PublicProfile.tsx
@@ -0,0 +1,283 @@
+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} 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,
+ 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<ContentProps> = ({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<Map<string, MomentType[]>>(
+ new Map(),
+ );
+
+ const [isStageTwoPromptClosed, setIsStageTwoPromptClosed] = useState<boolean>(
+ false,
+ );
+ const [isStageOnePromptClosed, setIsStageOnePromptClosed] = useState<boolean>(
+ false,
+ );
+ const [
+ isStageThreePromptClosed,
+ setIsStageThreePromptClosed,
+ ] = useState<boolean>(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 (
+ <View style={styles.momentsContainer}>
+ {userXId && moments.length === 0 && (
+ <View style={styles.plusIconContainer}>
+ <GreyPlusLogo width={90} height={90} />
+ <Text style={styles.noMomentsText}>{`Looks like ${
+ profile.name.split(' ')[0]
+ } has not posted any moments yet`}</Text>
+ </View>
+ )}
+ {!userXId &&
+ profile.profile_completion_stage === 2 &&
+ !isStageTwoPromptClosed && (
+ <TaggPrompt
+ messageHeader={UPLOAD_MOMENT_PROMPT_TWO_HEADER}
+ messageBody={UPLOAD_MOMENT_PROMPT_TWO_MESSAGE}
+ logoType=""
+ onClose={() => {
+ setIsStageTwoPromptClosed(true);
+ }}
+ />
+ )}
+ {!userXId &&
+ profile.profile_completion_stage === 3 &&
+ !isStageThreePromptClosed && (
+ <TaggPrompt
+ messageHeader={UPLOAD_MOMENT_PROMPT_THREE_HEADER}
+ messageBody={UPLOAD_MOMENT_PROMPT_THREE_MESSAGE}
+ logoType=""
+ onClose={() => {
+ setIsStageThreePromptClosed(true);
+ }}
+ />
+ )}
+ {momentCategories.map(
+ (title, index) =>
+ (!userXId || imagesMap.get(title)) && (
+ <Moment
+ key={index}
+ title={title}
+ images={imagesMap.get(title)}
+ userXId={userXId}
+ screenType={screenType}
+ handleMomentCategoryDelete={handleCategoryDeletion}
+ shouldAllowDeletion={momentCategories.length > 1}
+ showUpButton={index !== 0}
+ showDownButton={index !== momentCategories.length - 1}
+ move={move}
+ />
+ ),
+ )}
+ {!userXId && (
+ <TouchableOpacity
+ onPress={() =>
+ navigation.navigate('CategorySelection', {
+ screenType: CategorySelectionScreenType.Profile,
+ user: loggedInUser,
+ })
+ }
+ style={styles.createCategoryButton}>
+ <Text style={styles.createCategoryButtonLabel}>
+ Create a new category
+ </Text>
+ </TouchableOpacity>
+ )}
+ </View>
+ );
+};
+
+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/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<TaggProps> = ({
@@ -45,6 +46,7 @@ const Tagg: React.FC<TaggProps> = ({
userXId,
user,
whiteRing,
+ allowNavigation = true,
}) => {
const navigation = useNavigation();
const [modalVisible, setModalVisible] = useState(false);
@@ -70,19 +72,21 @@ const Tagg: React.FC<TaggProps> = ({
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<TaggsBarProps> = ({
y,
@@ -30,6 +31,7 @@ const TaggsBar: React.FC<TaggsBarProps> = ({
screenType,
whiteRing,
linkedSocials,
+ allowNavigation = true,
}) => {
let [taggs, setTaggs] = useState<Object[]>([]);
let [taggsNeedUpdate, setTaggsNeedUpdate] = useState(true);
@@ -79,6 +81,7 @@ const TaggsBar: React.FC<TaggsBarProps> = ({
setTaggsNeedUpdate={setTaggsNeedUpdate}
setSocialDataNeedUpdate={handleSocialUpdate}
whiteRing={whiteRing ? whiteRing : undefined}
+ allowNavigation={allowNavigation}
/>,
);
i++;
@@ -96,6 +99,7 @@ const TaggsBar: React.FC<TaggsBarProps> = ({
userXId={userXId}
user={user}
whiteRing={whiteRing ? whiteRing : undefined}
+ allowNavigation={allowNavigation}
/>,
);
i++;
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/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<SPBodyProps> = ({
suggested_people_url,
friendship,
badges,
+ is_private,
},
itemIndex,
onAddFriend,
@@ -156,6 +163,11 @@ const SPBody: React.FC<SPBodyProps> = ({
screenType={screenType}
whiteRing={true}
linkedSocials={social_links}
+ allowNavigation={canViewProfile(
+ loggedInUserId === user.id,
+ is_private,
+ friendship.status === 'friends',
+ )}
/>
<View style={styles.marginManager}>
<MutualFriends user={user} friends={mutual_friends} />
diff --git a/src/types/types.ts b/src/types/types.ts
index 9a40e4c0..b2d39cd9 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<number>;
+ userXId: string | undefined;
+ screenType: ScreenType;
+}
export type NotificationType = {
actor: ProfilePreviewType;
@@ -244,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;
+};
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-08 19:07:04 +0000