1 files changed, 32 insertions, 19 deletions

diff --git a/src/screens/search/SearchScreen.tsx b/src/screens/search/SearchScreen.tsx
index 78c0c5cc..4505163c 100644
--- a/src/screens/search/SearchScreen.tsx
+++ b/src/screens/search/SearchScreen.tsx
@@ -1,9 +1,17 @@
 import AsyncStorage from '@react-native-community/async-storage';
-import React, {useEffect, useState} from 'react';
-import {Keyboard, ScrollView, StatusBar, StyleSheet} from 'react-native';
+import {useFocusEffect} from '@react-navigation/native';
+import React, {useCallback, useEffect, useState} from 'react';
+import {
+  Keyboard,
+  RefreshControl,
+  ScrollView,
+  StatusBar,
+  StyleSheet,
+} from 'react-native';
 import Animated, {Easing, timing} from 'react-native-reanimated';
+import {useDispatch, useSelector} from 'react-redux';
 import {
-  DiscoverUsers,
+  Explore,
   RecentSearches,
   SearchBackground,
   SearchBar,
@@ -13,6 +21,8 @@ import {
   TabsGradient,
 } from '../../components';
 import {SEARCH_ENDPOINT, TAGG_TEXT_LIGHT_BLUE} from '../../constants';
+import {loadRecentlySearched, resetScreenType} from '../../store/actions';
+import {RootState} from '../../store/rootReducer';
 import {ProfilePreviewType, ScreenType, UserType} from '../../types';
 import {SCREEN_HEIGHT, SCREEN_WIDTH, StatusBarHeight} from '../../utils';
 const NO_USER: UserType = {
@@ -20,18 +30,13 @@ const NO_USER: UserType = {
   username: '',
 };
 
-import {RootState} from '../../store/rootReducer';
-import {useSelector, useDispatch} from 'react-redux';
-import {resetScreenType} from '../../store/actions';
-import {useFocusEffect} from '@react-navigation/native';
-
 /**
  * Search Screen for user recommendations and a search
  * tool to allow user to find other users
  */
 
 const SearchScreen: React.FC = () => {
-  const {recentSearches, taggUsers} = useSelector(
+  const {recentSearches, explores} = useSelector(
     (state: RootState) => state.taggUsers,
   );
   const [query, setQuery] = useState<string>('');
@@ -42,6 +47,19 @@ const SearchScreen: React.FC = () => {
   const [searching, setSearching] = useState(false);
   const top = Animated.useValue(-SCREEN_HEIGHT);
   const [user, setUser] = useState<UserType>(NO_USER);
+  const [refreshing, setRefreshing] = useState<boolean>(false);
+
+  const dispatch = useDispatch();
+
+  const onRefresh = useCallback(() => {
+    const refrestState = async () => {
+      dispatch(loadRecentlySearched());
+    };
+    setRefreshing(true);
+    refrestState().then(() => {
+      setRefreshing(false);
+    });
+  }, []);
 
   useEffect(() => {
     if (query.length < 3) {
@@ -76,8 +94,6 @@ const SearchScreen: React.FC = () => {
     loadResults(query);
   }, [query]);
 
-  const dispatch = useDispatch();
-
   /**
    * Code under useFocusEffect gets executed every time the screen comes under focus / is being viewed by the user.
    * This is done to reset the users stored in our store for the Search screen.
@@ -135,7 +151,10 @@ const SearchScreen: React.FC = () => {
         keyboardShouldPersistTaps={'always'}
         stickyHeaderIndices={[4]}
         contentContainerStyle={styles.contentContainer}
-        showsVerticalScrollIndicator={false}>
+        showsVerticalScrollIndicator={false}
+        refreshControl={
+          <RefreshControl refreshing={refreshing} onRefresh={onRefresh} />
+        }>
         <SearchHeader style={styles.header} {...{top}} />
         <SearchBar
           style={styles.searchBar}
@@ -146,13 +165,7 @@ const SearchScreen: React.FC = () => {
           value={query}
           {...{top, searching}}
         />
-        {/* Removed for Alpha for now */}
-        {/* <Explore /> */}
-        <DiscoverUsers
-          sectionTitle="Discover Users"
-          users={taggUsers}
-          screenType={ScreenType.Search}
-        />
+        <Explore />
         <SearchResultsBackground {...{top}}>
           {results.length === 0 && recents.length !== 0 ? (
             <RecentSearches