From 3214fc765cbce3c6f9092546424249d08622afb1 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh <37447613+shravyaramesh@users.noreply.github.com> Date: Fri, 20 Nov 2020 13:20:49 -0800 Subject: [TMA-375] Added discover users to explore (#119) * Added discover users to explore * Filtered following users out * Removed reload button and filtering following users from discover page * Wrapped contents * Preview type in types.ts --- src/components/search/DiscoverUsers.tsx | 46 ++++++++++++++++++++++++++++++++ src/components/search/RecentSearches.tsx | 2 +- src/components/search/SearchResults.tsx | 12 +++++---- src/components/search/index.ts | 1 + 4 files changed, 55 insertions(+), 6 deletions(-) create mode 100644 src/components/search/DiscoverUsers.tsx (limited to 'src/components/search') 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; +} +/** + * An image component that returns the of the icon for a specific social media platform. + */ +const DiscoverUsers: React.FC = (props) => { + return ( + + + {props.sectionTitle} + + + + ); +}; + +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 = (props) => { )} - + ); }; 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; + previewType: PreviewType; } -const SearchResults: React.FC = ({results}) => { +const SearchResults: React.FC = (props) => { return ( - - {results.map((profilePreview) => ( + + {props.results.map((profilePreview) => ( ))} @@ -21,6 +22,7 @@ const SearchResults: React.FC = ({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'; -- cgit v1.2.3-70-g09d2