3 files changed, 11 insertions, 61 deletions
diff --git a/src/components/search/ExploreSection.tsx b/src/components/search/ExploreSection.tsx
deleted file mode 100644
index e888370e..00000000
--- a/src/components/search/ExploreSection.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import React, {Fragment} from 'react';
-import {FlatList, StyleSheet, Text, View} from 'react-native';
-import {ProfilePreviewType} from '../../types';
-import {normalize} from '../../utils';
-import ExploreSectionUser from './ExploreSectionUser';
-
-/**
- * Search Screen for user recommendations and a search
- * tool to allow user to find other users
- */
-
-interface ExploreSectionProps {
-  title: string;
-  users: ProfilePreviewType[];
-}
-const ExploreSection: React.FC<ExploreSectionProps> = ({title, users}) => {
-  return users && users.length !== 0 ? (
-    <View style={styles.container}>
-      <Text style={styles.header}>{title}</Text>
-      <FlatList
-        data={users}
-        ListHeaderComponent={<View style={styles.padding} />}
-        renderItem={({item: user}: {item: ProfilePreviewType}) => (
-          <ExploreSectionUser key={user.id} user={user} style={styles.user} />
-        )}
-        showsHorizontalScrollIndicator={false}
-        horizontal
-      />
-    </View>
-  ) : (
-    <Fragment />
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    marginVertical: '5%',
-  },
-  header: {
-    fontWeight: '600',
-    fontSize: normalize(18),
-    color: '#fff',
-    marginLeft: '5%',
-    marginBottom: '5%',
-  },
-  user: {
-    marginHorizontal: 5,
-  },
-  padding: {
-    width: 10,
-  },
-});
-
-export default ExploreSection;
diff --git a/src/components/search/Explore.tsx b/src/components/search/SearchCategories.tsx
index 54bbe4b5..6df06007 100644
--- a/src/components/search/Explore.tsx
+++ b/src/components/search/SearchCategories.tsx
@@ -1,17 +1,18 @@
+import {useNavigation} from '@react-navigation/native';
 import React from 'react';
 import {StyleSheet, Text, View} from 'react-native';
 import {TouchableOpacity} from 'react-native-gesture-handler';
 import LinearGradient from 'react-native-linear-gradient';
 import {SCREEN_WIDTH} from '../../utils';
 
-const Explore: React.FC = () => {
+const SearchCategories: React.FC = () => {
   // Get categories from backend
   const categories = ['Brown 21', 'Brown 22', 'Brown 23', 'Brown 24'];
-
+  const navigation = useNavigation();
   return (
     <View style={styles.container}>
       {categories &&
-        categories.map((category) => (
+        categories.map((searchCategory) => (
           <LinearGradient
             colors={['#8000FF', '#00FFFF']}
             start={{x: 0.0, y: 1.0}}
@@ -20,9 +21,12 @@ const Explore: React.FC = () => {
             <TouchableOpacity
               style={styles.buttonContainer}
               onPress={() => {
-                console.log('Navigate to Discover Users!');
+                console.log('Sending: ', searchCategory);
+                navigation.navigate('DiscoverUsers', {
+                  searchCategory,
+                });
               }}>
-              <Text style={styles.buttonText}>{category}</Text>
+              <Text style={styles.buttonText}>{searchCategory}</Text>
             </TouchableOpacity>
           </LinearGradient>
         ))}
@@ -71,4 +75,4 @@ const styles = StyleSheet.create({
     color: '#828282',
   },
 });
-export default Explore;
+export default SearchCategories;
diff --git a/src/components/search/index.ts b/src/components/search/index.ts
index 7418f0ba..d30c5c2a 100644
--- a/src/components/search/index.ts
+++ b/src/components/search/index.ts
@@ -1,7 +1,7 @@
 export {default as SearchBackground} from './SearchBackground';
 export {default as SearchHeader} from './SearchHeader';
 export {default as SearchBar} from './SearchBar';
-export {default as Explore} from './Explore';
+export {default as SearchCategories} from './SearchCategories';
 export {default as SearchResultsBackground} from './SearchResultsBackground';
 export {default as SearchResultList} from './SearchResultList';
 export {default as SearchResults} from './SearchResults';