[TMA-161] Recently Searched Users (#34)

* Basic AsyncStorage code

* Basic implementation complete

Need to fix re-rendering bug

* Removed errant comment

* Fixed bug for rerendering upon addition to recents

Need to fix bug for rerendering upon clearing

* Fixed rerendering bug for clear

* Only present recents header if users in recents

* Lint cleaning

* Basic AsyncStorage code

* Basic implementation complete

Need to fix re-rendering bug

* Removed errant comment

* Fixed bug for rerendering upon addition to recents

Need to fix bug for rerendering upon clearing

* Fixed rerendering bug for clear

* Only present recents header if users in recents

* Lint cleaning

* Added comments for a function

* Updated conditional presentation to use ternary

* Created component for List Section Headers

* Lint cleaning

* Converted component to be for Recent Searches

As opposed to just the list header

1 files changed, 52 insertions, 1 deletions

diff --git a/src/components/search/SearchResult.tsx b/src/components/search/SearchResult.tsx
index 60c22d41..e65be1f4 100644
--- a/src/components/search/SearchResult.tsx
+++ b/src/components/search/SearchResult.tsx
@@ -9,6 +9,7 @@ import {
   TouchableOpacity,
 } from 'react-native';
 import RNFetchBlob from 'rn-fetch-blob';
+import AsyncStorage from '@react-native-community/async-storage';
 import {AVATAR_PHOTO_ENDPOINT} from '../../constants';
 
 interface SearchResultProps extends ViewProps {
@@ -48,8 +49,58 @@ const SearchResult: React.FC<SearchResultProps> = ({
     };
   }, [id]);
 
+  /**
+   * Adds a searched user to the recently searched cache if they're tapped on.
+   * Cache maintains 10 recently searched users, popping off the oldest one if
+   * needed to make space.
+   */
+  const addToRecentlyStored = async () => {
+    let user: ProfilePreviewType = {
+      id,
+      username,
+      first_name,
+      last_name,
+    };
+    try {
+      const jsonValue = await AsyncStorage.getItem('@recently_searched_users');
+      let recentlySearchedList =
+        jsonValue != null ? JSON.parse(jsonValue) : null;
+      if (recentlySearchedList) {
+        if (recentlySearchedList.length > 0) {
+          if (
+            recentlySearchedList.some(
+              (saved_user: ProfilePreviewType) => saved_user.id === id,
+            )
+          ) {
+            console.log('User already in recently searched.');
+          } else {
+            if (recentlySearchedList.length >= 10) {
+              recentlySearchedList.pop();
+            }
+            recentlySearchedList.unshift(user);
+          }
+        }
+      } else {
+        recentlySearchedList = [user];
+      }
+      try {
+        let recentlySearchedListString = JSON.stringify(recentlySearchedList);
+        await AsyncStorage.setItem(
+          '@recently_searched_users',
+          recentlySearchedListString,
+        );
+      } catch (e) {
+        console.log(e);
+      }
+    } catch (e) {
+      console.log(e);
+    }
+  };
+
   return (
-    <TouchableOpacity style={[styles.container, style]}>
+    <TouchableOpacity
+      onPress={addToRecentlyStored}
+      style={[styles.container, style]}>
       <Image
         style={styles.avatar}
         source={