aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/components/comments/CommentTile.tsx2
-rw-r--r--src/components/profile/Followers.tsx2
-rw-r--r--src/components/profile/ProfilePreview.tsx140
-rw-r--r--src/components/search/DiscoverUsers.tsx46
-rw-r--r--src/components/search/RecentSearches.tsx2
-rw-r--r--src/components/search/SearchResults.tsx12
-rw-r--r--src/components/search/index.ts1
-rw-r--r--src/constants/api.ts1
-rw-r--r--src/routes/authentication/AuthProvider.tsx21
-rw-r--r--src/screens/search/SearchScreen.tsx29
-rw-r--r--src/services/ExploreServices.ts31
-rw-r--r--src/services/index.ts1
-rw-r--r--src/types/types.ts2
13 files changed, 229 insertions, 61 deletions
diff --git a/src/components/comments/CommentTile.tsx b/src/components/comments/CommentTile.tsx
index 02840d47..bee590f5 100644
--- a/src/components/comments/CommentTile.tsx
+++ b/src/components/comments/CommentTile.tsx
@@ -25,7 +25,7 @@ const CommentTile: React.FC<CommentTileProps> = ({comment_object}) => {
first_name: '',
last_name: '',
}}
- isComment={true}
+ previewType={'Comment'}
/>
<View style={styles.body}>
<Text style={styles.comment}>{comment_object.comment}</Text>
diff --git a/src/components/profile/Followers.tsx b/src/components/profile/Followers.tsx
index 6f56c03c..e11041d0 100644
--- a/src/components/profile/Followers.tsx
+++ b/src/components/profile/Followers.tsx
@@ -30,7 +30,7 @@ const Followers: React.FC<FollowersListProps> = ({result, sectionTitle}) => {
style={styles.follower}
key={profilePreview.id}
{...{profilePreview}}
- isComment={true}
+ previewType={'Comment'}
/>
))}
</>
diff --git a/src/components/profile/ProfilePreview.tsx b/src/components/profile/ProfilePreview.tsx
index abc29422..af116dd3 100644
--- a/src/components/profile/ProfilePreview.tsx
+++ b/src/components/profile/ProfilePreview.tsx
@@ -13,7 +13,7 @@ import {useNavigation} from '@react-navigation/native';
import RNFetchBlob from 'rn-fetch-blob';
import AsyncStorage from '@react-native-community/async-storage';
import {AVATAR_PHOTO_ENDPOINT} from '../../constants';
-import {UserType} from '../../types';
+import {UserType, PreviewType} from '../../types';
import {AuthContext} from '../../routes/';
import {isUserBlocked} from '../../services';
const NO_USER: UserType = {
@@ -33,12 +33,11 @@ const NO_USER: UserType = {
interface ProfilePreviewProps extends ViewProps {
profilePreview: ProfilePreviewType;
- isComment: boolean;
+ previewType: PreviewType;
}
const ProfilePreview: React.FC<ProfilePreviewProps> = ({
profilePreview: {username, first_name, last_name, id},
- isComment,
- style,
+ previewType,
}) => {
const navigation = useNavigation();
const {user: loggedInUser, logout} = React.useContext(AuthContext);
@@ -103,13 +102,13 @@ const ProfilePreview: React.FC<ProfilePreviewProps> = ({
};
try {
- //If the logged in user is blocked by the user being viewed, do not proceed.
- const isUserBlocked = await checkIfUserIsBlocked(user.id);
- if (isUserBlocked) {
- Alert.alert('You cannot view this profile');
- return;
- }
- if (!isComment) {
+ if (previewType !== 'Comment') {
+ //If the logged in user is blocked by the user being viewed, do not proceed.
+ const isUserBlocked = await checkIfUserIsBlocked(user.id);
+ if (isUserBlocked) {
+ Alert.alert('You cannot view this profile');
+ return;
+ }
const jsonValue = await AsyncStorage.getItem(
'@recently_searched_users',
);
@@ -158,18 +157,51 @@ const ProfilePreview: React.FC<ProfilePreviewProps> = ({
}
};
- //With @ sign if on search screen.
- const usernameToDisplay = !isComment ? '@' + username : username;
- const usernameStyle = isComment
- ? styles.commentUsername
- : styles.searchUsername;
+ var containerStyle,
+ avatarStyle,
+ nameContainerStyle,
+ usernameToDisplay,
+ usernameStyle,
+ nameStyle;
- const avatarStyle = !isComment ? styles.searchAvatar : styles.commentAvatar;
+ switch (previewType) {
+ case 'Search' || 'Recent':
+ containerStyle = styles.searchResultContainer;
+ avatarStyle = styles.searchResultAvatar;
+ nameContainerStyle = styles.searchResultNameContainer;
+ usernameToDisplay = '@' + username;
+ usernameStyle = styles.searchResultUsername;
+ nameStyle = styles.searchResultName;
+ break;
+ case 'Discover Users':
+ containerStyle = styles.discoverUsersContainer;
+ avatarStyle = styles.discoverUsersAvatar;
+ nameContainerStyle = styles.discoverUsersNameContainer;
+ usernameToDisplay = '@' + username;
+ usernameStyle = styles.discoverUsersUsername;
+ nameStyle = styles.discoverUsersName;
+ break;
+ case 'Comment':
+ containerStyle = styles.commentContainer;
+ avatarStyle = styles.commentAvatar;
+ nameContainerStyle = styles.commentNameContainer;
+ usernameToDisplay = username;
+ usernameStyle = styles.commentUsername;
+ nameStyle = styles.commentName;
+ break;
+ default:
+ containerStyle = styles.searchResultContainer;
+ avatarStyle = styles.searchResultAvatar;
+ nameContainerStyle = styles.searchResultNameContainer;
+ usernameToDisplay = '@' + username;
+ usernameStyle = styles.searchResultUsername;
+ nameStyle = styles.searchResultName;
+ }
return (
<TouchableOpacity
onPress={addToRecentlyStoredAndNavigateToProfile}
- style={[styles.container, style]}>
+ style={containerStyle}>
<Image
style={avatarStyle}
source={
@@ -178,12 +210,21 @@ const ProfilePreview: React.FC<ProfilePreviewProps> = ({
: require('../../assets/images/avatar-placeholder.png')
}
/>
- <View style={styles.nameContainer}>
- <Text style={usernameStyle}>{usernameToDisplay}</Text>
- {first_name ? (
- <Text style={styles.name}>{first_name.concat(' ', last_name)}</Text>
- ) : (
- React.Fragment
+ <View style={nameContainerStyle}>
+ {(previewType === 'Search' || previewType === 'Recent') && (
+ <>
+ <Text style={usernameStyle}>{usernameToDisplay}</Text>
+ <Text style={nameStyle}>{first_name.concat(' ', last_name)}</Text>
+ </>
+ )}
+ {previewType === 'Comment' && (
+ <Text style={usernameStyle}>{usernameToDisplay}</Text>
+ )}
+ {previewType === 'Discover Users' && (
+ <>
+ <Text style={nameStyle}>{first_name.concat(' ', last_name)}</Text>
+ <Text style={usernameStyle}>{usernameToDisplay}</Text>
+ </>
)}
</View>
</TouchableOpacity>
@@ -191,11 +232,23 @@ const ProfilePreview: React.FC<ProfilePreviewProps> = ({
};
const styles = StyleSheet.create({
- container: {
+ searchResultContainer: {
flexDirection: 'row',
alignItems: 'center',
+ marginVertical: 10,
},
- searchAvatar: {
+ commentContainer: {
+ flexDirection: 'row',
+ alignItems: 'center',
+ },
+ discoverUsersContainer: {
+ alignItems: 'center',
+ textAlign: 'center',
+ margin: '0.5%',
+ width: '32%',
+ marginVertical: 10,
+ },
+ searchResultAvatar: {
height: 60,
width: 60,
borderRadius: 30,
@@ -208,11 +261,24 @@ const styles = StyleSheet.create({
marginRight: 15,
marginTop: '2%',
},
- nameContainer: {
+ discoverUsersAvatar: {
+ height: 60,
+ width: 60,
+ borderRadius: 30,
+ },
+ searchResultNameContainer: {
+ justifyContent: 'space-evenly',
+ alignSelf: 'stretch',
+ },
+ commentNameContainer: {
+ justifyContent: 'space-evenly',
+ alignSelf: 'stretch',
+ },
+ discoverUsersNameContainer: {
justifyContent: 'space-evenly',
alignSelf: 'stretch',
},
- searchUsername: {
+ searchResultUsername: {
fontSize: 18,
fontWeight: '500',
},
@@ -220,10 +286,26 @@ const styles = StyleSheet.create({
fontSize: 16,
fontWeight: '500',
},
- name: {
+ discoverUsersUsername: {
+ fontSize: 14,
+ fontWeight: '400',
+ color: 'white',
+ textAlign: 'center',
+ },
+ searchResultName: {
+ fontSize: 16,
+ color: '#333',
+ },
+ commentName: {
fontSize: 16,
color: '#333',
},
+ discoverUsersName: {
+ fontSize: 16,
+ fontWeight: '700',
+ color: 'white',
+ textAlign: 'center',
+ },
});
export default ProfilePreview;
diff --git a/src/components/search/DiscoverUsers.tsx b/src/components/search/DiscoverUsers.tsx
new file mode 100644
index 00000000..885c712b
--- /dev/null
+++ b/src/components/search/DiscoverUsers.tsx
@@ -0,0 +1,46 @@
+import React from 'react';
+import {
+ View,
+ Text,
+ TouchableOpacity,
+ StyleSheet,
+ TouchableOpacityProps,
+} from 'react-native';
+import {ProfilePreviewType} from '../../types';
+import SearchResults from './SearchResults';
+
+interface DiscoverUsersProps extends TouchableOpacityProps {
+ sectionTitle: string;
+ users: Array<ProfilePreviewType>;
+}
+/**
+ * An image component that returns the <Image> of the icon for a specific social media platform.
+ */
+const DiscoverUsers: React.FC<DiscoverUsersProps> = (props) => {
+ return (
+ <View style={styles.container}>
+ <View style={styles.headerContainer}>
+ <Text style={styles.title}>{props.sectionTitle}</Text>
+ </View>
+ <SearchResults results={props.users} previewType={props.sectionTitle} />
+ </View>
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ margin: '5%',
+ },
+ headerContainer: {
+ flexDirection: 'row',
+ marginBottom: '1%',
+ },
+ title: {
+ fontSize: 19,
+ fontWeight: 'bold',
+ flexGrow: 1,
+ color: 'white',
+ },
+});
+
+export default DiscoverUsers;
diff --git a/src/components/search/RecentSearches.tsx b/src/components/search/RecentSearches.tsx
index f47f8879..6a98e49a 100644
--- a/src/components/search/RecentSearches.tsx
+++ b/src/components/search/RecentSearches.tsx
@@ -29,7 +29,7 @@ const RecentSearches: React.FC<RecentSearchesProps> = (props) => {
</TouchableOpacity>
)}
</View>
- <SearchResults results={props.recents} />
+ <SearchResults results={props.recents} previewType={props.sectionTitle} />
</>
);
};
diff --git a/src/components/search/SearchResults.tsx b/src/components/search/SearchResults.tsx
index 57db4167..2d5c9db8 100644
--- a/src/components/search/SearchResults.tsx
+++ b/src/components/search/SearchResults.tsx
@@ -1,19 +1,20 @@
import React from 'react';
-import {ProfilePreviewType} from '../../types';
+import {ProfilePreviewType, PreviewType} from '../../types';
import ProfilePreview from '../profile/ProfilePreview';
import {StyleSheet, View} from 'react-native';
interface SearchResultsProps {
results: Array<ProfilePreviewType>;
+ previewType: PreviewType;
}
-const SearchResults: React.FC<SearchResultsProps> = ({results}) => {
+const SearchResults: React.FC<SearchResultsProps> = (props) => {
return (
- <View>
- {results.map((profilePreview) => (
+ <View style={styles.container}>
+ {props.results.map((profilePreview) => (
<ProfilePreview
style={styles.result}
key={profilePreview.id}
{...{profilePreview}}
- isComment={false}
+ previewType={props.previewType}
/>
))}
</View>
@@ -21,6 +22,7 @@ const SearchResults: React.FC<SearchResultsProps> = ({results}) => {
};
const styles = StyleSheet.create({
+ container: {flexDirection: 'row', flexWrap: 'wrap'},
result: {
marginVertical: 10,
},
diff --git a/src/components/search/index.ts b/src/components/search/index.ts
index 47dccd8b..08052f77 100644
--- a/src/components/search/index.ts
+++ b/src/components/search/index.ts
@@ -4,3 +4,4 @@ export {default as SearchBar} from './SearchBar';
export {default as Explore} from './Explore';
export {default as SearchResultsBackground} from './SearchResultsBackground';
export {default as SearchResults} from './SearchResults';
+export {default as DiscoverUsers} from './DiscoverUsers';
diff --git a/src/constants/api.ts b/src/constants/api.ts
index eac529c4..d3047e55 100644
--- a/src/constants/api.ts
+++ b/src/constants/api.ts
@@ -21,6 +21,7 @@ export const FOLLOW_USER_ENDPOINT: string = API_URL + 'follow/';
export const UNFOLLOW_USER_ENDPOINT: string = API_URL + 'unfollow/';
export const FOLLOWERS_ENDPOINT: string = API_URL + 'followers/';
export const FOLLOWING_ENDPOINT: string = API_URL + 'following/';
+export const ALL_USERS_ENDPOINT: string = API_URL + 'users/';
export const REPORT_ISSUE_ENDPOINT: string = API_URL + 'report/';
export const BLOCK_USER_ENDPOINT: string = API_URL + 'block/';
diff --git a/src/routes/authentication/AuthProvider.tsx b/src/routes/authentication/AuthProvider.tsx
index 7046d04f..46f761e1 100644
--- a/src/routes/authentication/AuthProvider.tsx
+++ b/src/routes/authentication/AuthProvider.tsx
@@ -10,6 +10,7 @@ import {
loadProfileInfo,
loadRecentlySearchedUsers,
loadSocialPosts,
+ getAllTaggUsers,
loadBlockedUsers,
} from '../../services';
import {
@@ -29,6 +30,7 @@ interface AuthContextProps {
cover: string | null;
socialAccounts: Record<string, SocialAccountType>;
recentSearches: Array<ProfilePreviewType>;
+ taggUsers: Array<ProfilePreviewType>;
newMomentsAvailable: boolean;
updateMoments: (value: boolean) => void;
socialsNeedUpdate: (_: string[]) => void;
@@ -71,6 +73,7 @@ export const AuthContext = createContext<AuthContextProps>({
avatar: null,
cover: null,
recentSearches: [],
+ taggUsers: [],
newMomentsAvailable: true,
updateMoments: () => {},
socialAccounts: NO_SOCIAL_ACCOUNTS,
@@ -101,6 +104,7 @@ const AuthProvider: React.FC = ({children}) => {
const [recentSearches, setRecentSearches] = useState<
Array<ProfilePreviewType>
>([]);
+ const [taggUsers, setTaggUsers] = useState<Array<ProfilePreviewType>>([]);
const [newMomentsAvailable, setNewMomentsAvailable] = useState<boolean>(true);
// Default update all integrated social lists on start
const [socialsNeedUpdate, setSocialsNeedUpdate] = useState<string[]>([
@@ -236,6 +240,22 @@ const AuthProvider: React.FC = ({children}) => {
userId,
setBlockedUsers,
]);
+
+ useEffect(() => {
+ const loadTaggUsers = async () => {
+ try {
+ const token = await AsyncStorage.getItem('token');
+ if (!token) {
+ setUser(NO_USER);
+ return;
+ }
+ await getAllTaggUsers(token, setTaggUsers);
+ } catch (error) {
+ console.log(error);
+ }
+ };
+ loadTaggUsers();
+ }, [userId]);
return (
<AuthContext.Provider
@@ -270,6 +290,7 @@ const AuthProvider: React.FC = ({children}) => {
}
},
recentSearches,
+ taggUsers,
updateMoments: (value) => {
setNewMomentsAvailable(value);
},
diff --git a/src/screens/search/SearchScreen.tsx b/src/screens/search/SearchScreen.tsx
index aef3d0a8..535b964c 100644
--- a/src/screens/search/SearchScreen.tsx
+++ b/src/screens/search/SearchScreen.tsx
@@ -1,16 +1,9 @@
import AsyncStorage from '@react-native-community/async-storage';
import React, {useEffect, useState} from 'react';
-import {
- Image,
- Keyboard,
- ScrollView,
- StatusBar,
- StyleSheet,
- Text,
- View,
-} from 'react-native';
+import {Keyboard, ScrollView, StatusBar, StyleSheet} from 'react-native';
import Animated, {Easing, timing} from 'react-native-reanimated';
import {
+ DiscoverUsers,
RecentSearches,
SearchBackground,
SearchBar,
@@ -34,7 +27,7 @@ const NO_USER: UserType = {
*/
const SearchScreen: React.FC = () => {
- const {recentSearches} = React.useContext(AuthContext);
+ const {recentSearches, taggUsers} = React.useContext(AuthContext);
const [query, setQuery] = useState<string>('');
const [results, setResults] = useState<Array<ProfilePreviewType>>([]);
const [recents, setRecents] = useState<Array<ProfilePreviewType>>(
@@ -137,19 +130,7 @@ const SearchScreen: React.FC = () => {
/>
{/* Removed for Alpha for now */}
{/* <Explore /> */}
- {/* <View>
- <View style={styles.textContainer}>
- <Text style={styles.headerText}>Coming Soon</Text>
- <Text style={styles.subtext}>
- We are working on constructing our explore suggestions. You can
- still search users for now!
- </Text>
- </View>
- <Image
- source={require('../../assets/images/coming-soon.png')}
- style={styles.image}
- />
- </View> */}
+ <DiscoverUsers sectionTitle="Discover Users" users={taggUsers} />
<SearchResultsBackground {...{top}}>
{results.length === 0 && recents.length !== 0 ? (
<RecentSearches
@@ -159,7 +140,7 @@ const SearchScreen: React.FC = () => {
recents={recents}
/>
) : (
- <SearchResults {...{results}} />
+ <SearchResults {...{results}} previewType={'Search'} />
)}
</SearchResultsBackground>
</ScrollView>
diff --git a/src/services/ExploreServices.ts b/src/services/ExploreServices.ts
new file mode 100644
index 00000000..7c242d57
--- /dev/null
+++ b/src/services/ExploreServices.ts
@@ -0,0 +1,31 @@
+import {ALL_USERS_ENDPOINT} from '../constants';
+
+export const getAllTaggUsers = async (
+ token: string,
+ setTaggUsers: Function,
+) => {
+ try {
+ const response = await fetch(ALL_USERS_ENDPOINT, {
+ method: 'GET',
+ headers: {
+ Authorization: 'Token ' + token,
+ },
+ });
+ const status = response.status;
+ if (status === 200) {
+ const response_data = await response.json();
+ setTaggUsers(response_data);
+ } else {
+ console.log(
+ 'Something went wrong! 😭',
+ 'Not able to retrieve tagg users list',
+ );
+ }
+ } catch (error) {
+ console.log(
+ 'Something went wrong! 😭',
+ 'Not able to retrieve tagg users list',
+ error,
+ );
+ }
+};
diff --git a/src/services/index.ts b/src/services/index.ts
index 016511b3..bce3a75a 100644
--- a/src/services/index.ts
+++ b/src/services/index.ts
@@ -1,6 +1,7 @@
export * from './UserProfileService';
export * from './SocialLinkingService';
export * from './MomentServices';
+export * from './ExploreServices';
export * from './UserFollowServices';
export * from './ReportingService';
export * from './BlockUserService';
diff --git a/src/types/types.ts b/src/types/types.ts
index 8336919e..7d0cf318 100644
--- a/src/types/types.ts
+++ b/src/types/types.ts
@@ -85,3 +85,5 @@ export interface CommentType {
commenter__id: string;
commenter__username: string;
}
+
+export type PreviewType = 'Comment' | 'Search' | 'Recent' | 'Discover Users';
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-17 05:24:49 +0000