[TMA 236] Comments PR (#64)

* Added comments count and retrieve comments

* Working draft

* The one before cleanup

* Finally

* Added time icon and major refactoring

* Small fix for social media taggs

* Addressed review comments

2 files changed, 3 insertions, 174 deletions

diff --git a/src/components/search/SearchResult.tsx b/src/components/search/SearchResult.tsx
deleted file mode 100644
index 04624004..00000000
--- a/src/components/search/SearchResult.tsx
+++ /dev/null
@@ -1,172 +0,0 @@
-import React, {useEffect, useState, useContext} from 'react';
-import {ProfilePreviewType} from '../../types';
-import {
-  View,
-  Text,
-  Image,
-  StyleSheet,
-  ViewProps,
-  TouchableOpacity,
-} from 'react-native';
-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 {ProfileContext} from '../../routes/viewProfile';
-const NO_USER: UserType = {
-  userId: '',
-  username: '',
-};
-
-interface SearchResultProps extends ViewProps {
-  profilePreview: ProfilePreviewType;
-}
-const SearchResult: React.FC<SearchResultProps> = ({
-  profilePreview: {username, first_name, last_name, id},
-  style,
-}) => {
-  const navigation = useNavigation();
-  const {loadProfile, updateMoments} = useContext(ProfileContext);
-  const [avatarURI, setAvatarURI] = useState<string | null>(null);
-  const [user, setUser] = useState<UserType>(NO_USER);
-  useEffect(() => {
-    let mounted = true;
-    const loadAvatar = async () => {
-      try {
-        const token = await AsyncStorage.getItem('token');
-        if (!token) {
-          setUser(NO_USER);
-          return;
-        }
-        const response = await RNFetchBlob.config({
-          fileCache: true,
-          appendExt: 'jpg',
-        }).fetch('GET', AVATAR_PHOTO_ENDPOINT + `${id}/`, {
-          Authorization: 'Token ' + token,
-        });
-        const status = response.info().status;
-        if (status === 200) {
-          if (mounted) {
-            setAvatarURI(response.path());
-          }
-          return;
-        }
-        if (mounted) {
-          setAvatarURI('');
-        }
-      } catch (error) {
-        console.log(error);
-      }
-    };
-    loadAvatar();
-    return () => {
-      mounted = false;
-    };
-  }, [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 addToRecentlyStoredAndNavigateToProfile = 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];
-      }
-
-      //Load user profile and set new moments to true, navigate to Profile
-      //Load user profile makes sure that we actually load profile of the user the logged in user want to view
-      //Set new moments to true makes sure that we download the moment for the user being viewed again.
-      //Not sure if we should make this call before caching the search results ??
-      loadProfile(user.id, user.username);
-      updateMoments(true);
-      navigation.navigate('Profile', {
-        isProfileView: true,
-      });
-
-      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
-      onPress={addToRecentlyStoredAndNavigateToProfile}
-      style={[styles.container, style]}>
-      <Image
-        style={styles.avatar}
-        source={
-          avatarURI
-            ? {uri: avatarURI}
-            : require('../../assets/images/avatar-placeholder.png')
-        }
-      />
-      <View style={styles.nameContainer}>
-        <Text style={styles.username}>@{username}</Text>
-        <Text style={styles.name}>{first_name.concat(' ', last_name)}</Text>
-      </View>
-    </TouchableOpacity>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-  avatar: {
-    height: 60,
-    width: 60,
-    borderRadius: 30,
-    marginRight: 15,
-  },
-  nameContainer: {
-    justifyContent: 'space-evenly',
-    alignSelf: 'stretch',
-  },
-  username: {
-    fontSize: 18,
-    fontWeight: '500',
-  },
-  name: {
-    fontSize: 16,
-    color: '#333',
-  },
-});
-
-export default SearchResult;
diff --git a/src/components/search/SearchResults.tsx b/src/components/search/SearchResults.tsx
index 16bff818..57db4167 100644
--- a/src/components/search/SearchResults.tsx
+++ b/src/components/search/SearchResults.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import {ProfilePreviewType} from '../../types';
-import SearchResult from './SearchResult';
+import ProfilePreview from '../profile/ProfilePreview';
 import {StyleSheet, View} from 'react-native';
 interface SearchResultsProps {
   results: Array<ProfilePreviewType>;
@@ -9,10 +9,11 @@ const SearchResults: React.FC<SearchResultsProps> = ({results}) => {
   return (
     <View>
       {results.map((profilePreview) => (
-        <SearchResult
+        <ProfilePreview
           style={styles.result}
           key={profilePreview.id}
           {...{profilePreview}}
+          isComment={false}
         />
       ))}
     </View>