From ad321571af78b5ea58a8e3e35820d5c3cf1c607b Mon Sep 17 00:00:00 2001
From: Ivan Chen <ivan@tagg.id>
Date: Thu, 21 Jan 2021 17:13:21 -0500
Subject: linting and normalizing tagg icons

---
 src/components/search/Explore.tsx            | 4 ++--
 src/components/search/ExploreSection.tsx     | 3 ++-
 src/components/search/ExploreSectionUser.tsx | 6 +++---
 3 files changed, 7 insertions(+), 6 deletions(-)

(limited to 'src/components/search')

diff --git a/src/components/search/Explore.tsx b/src/components/search/Explore.tsx
index c07c66b8..4a71249b 100644
--- a/src/components/search/Explore.tsx
+++ b/src/components/search/Explore.tsx
@@ -4,6 +4,7 @@ import {useSelector} from 'react-redux';
 import {EXPLORE_SECTION_TITLES} from '../../constants';
 import {RootState} from '../../store/rootReducer';
 import {ExploreSectionType} from '../../types';
+import {normalize} from '../../utils';
 import ExploreSection from './ExploreSection';
 
 const Explore: React.FC = () => {
@@ -21,11 +22,10 @@ const Explore: React.FC = () => {
 const styles = StyleSheet.create({
   container: {
     zIndex: 0,
-    // margin: '5%',
   },
   header: {
     fontWeight: '700',
-    fontSize: 22,
+    fontSize: normalize(22),
     color: '#fff',
     marginBottom: '2%',
     margin: '5%',
diff --git a/src/components/search/ExploreSection.tsx b/src/components/search/ExploreSection.tsx
index 8e8b4988..17079e77 100644
--- a/src/components/search/ExploreSection.tsx
+++ b/src/components/search/ExploreSection.tsx
@@ -1,6 +1,7 @@
 import React, {Fragment} from 'react';
 import {ScrollView, StyleSheet, Text, View} from 'react-native';
 import {ProfilePreviewType} from '../../types';
+import {normalize} from '../../utils';
 import ExploreSectionUser from './ExploreSectionUser';
 
 /**
@@ -34,7 +35,7 @@ const styles = StyleSheet.create({
   },
   header: {
     fontWeight: '600',
-    fontSize: 20,
+    fontSize: normalize(18),
     color: '#fff',
     marginLeft: '5%',
     marginBottom: '5%',
diff --git a/src/components/search/ExploreSectionUser.tsx b/src/components/search/ExploreSectionUser.tsx
index 0bf68a20..68e077e3 100644
--- a/src/components/search/ExploreSectionUser.tsx
+++ b/src/components/search/ExploreSectionUser.tsx
@@ -12,7 +12,7 @@ import {useDispatch, useSelector, useStore} from 'react-redux';
 import {loadAvatar} from '../../services';
 import {RootState} from '../../store/rootReducer';
 import {ProfilePreviewType, ScreenType} from '../../types';
-import {fetchUserX, userXInStore} from '../../utils';
+import {fetchUserX, normalize, userXInStore} from '../../utils';
 
 /**
  * Search Screen for user recommendations and a search
@@ -110,13 +110,13 @@ const styles = StyleSheet.create({
   name: {
     fontWeight: '600',
     flexWrap: 'wrap',
-    fontSize: 16,
+    fontSize: normalize(16),
     color: '#fff',
     textAlign: 'center',
   },
   username: {
     fontWeight: '400',
-    fontSize: 14,
+    fontSize: normalize(14),
     color: '#fff',
   },
 });
-- 
cgit v1.2.3-70-g09d2


From d667654caf1aa4e5f4814fa927e835f13efc0650 Mon Sep 17 00:00:00 2001
From: Ivan Chen <ivan@tagg.id>
Date: Fri, 22 Jan 2021 16:30:46 -0500
Subject: changed constant name

---
 src/components/common/AcceptDeclineButtons.tsx   |  8 +--
 src/components/common/GenericMoreInfoDrawer.tsx  |  4 +-
 src/components/common/SocialLinkModal.tsx        |  4 +-
 src/components/moments/Moment.tsx                | 10 ++--
 src/components/moments/MomentPostContent.tsx     |  1 +
 src/components/onboarding/TaggBigInput.tsx       |  4 +-
 src/components/profile/Content.tsx               | 68 +++++++++++-------------
 src/components/profile/ProfileBody.tsx           |  8 +--
 src/components/profile/ProfileMoreInfoDrawer.tsx |  4 +-
 src/components/profile/ToggleButton.tsx          |  8 +--
 src/components/search/RecentSearches.tsx         |  4 +-
 src/components/taggs/TwitterTaggPost.tsx         |  4 +-
 src/constants/constants.ts                       |  2 +-
 src/screens/search/SearchScreen.tsx              |  4 +-
 14 files changed, 63 insertions(+), 70 deletions(-)

(limited to 'src/components/search')

diff --git a/src/components/common/AcceptDeclineButtons.tsx b/src/components/common/AcceptDeclineButtons.tsx
index 221056c0..9caaffca 100644
--- a/src/components/common/AcceptDeclineButtons.tsx
+++ b/src/components/common/AcceptDeclineButtons.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import {StyleProp, StyleSheet, Text, View, ViewStyle} from 'react-native';
-import {TAGG_TEXT_LIGHT_BLUE} from '../../constants';
+import {TAGG_LIGHT_BLUE} from '../../constants';
 import {ProfilePreviewType} from '../../types';
 import {SCREEN_WIDTH} from '../../utils';
 import {TouchableOpacity} from 'react-native-gesture-handler';
@@ -55,18 +55,18 @@ const styles = StyleSheet.create({
   },
   acceptButton: {
     padding: 0,
-    backgroundColor: TAGG_TEXT_LIGHT_BLUE,
+    backgroundColor: TAGG_LIGHT_BLUE,
   },
   rejectButton: {
     borderWidth: 1,
     backgroundColor: 'white',
-    borderColor: TAGG_TEXT_LIGHT_BLUE,
+    borderColor: TAGG_LIGHT_BLUE,
   },
   acceptButtonTitleColor: {
     color: 'white',
   },
   rejectButtonTitleColor: {
-    color: TAGG_TEXT_LIGHT_BLUE,
+    color: TAGG_LIGHT_BLUE,
   },
   buttonTitle: {
     padding: 0,
diff --git a/src/components/common/GenericMoreInfoDrawer.tsx b/src/components/common/GenericMoreInfoDrawer.tsx
index 098482ae..a23d7736 100644
--- a/src/components/common/GenericMoreInfoDrawer.tsx
+++ b/src/components/common/GenericMoreInfoDrawer.tsx
@@ -10,7 +10,7 @@ import {
 } from 'react-native';
 import {useSafeAreaInsets} from 'react-native-safe-area-context';
 import {BottomDrawer} from '.';
-import {TAGG_TEXT_LIGHT_BLUE} from '../../constants';
+import {TAGG_LIGHT_BLUE} from '../../constants';
 import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
 
 // conforms the JSX onPress attribute type
@@ -87,7 +87,7 @@ const styles = StyleSheet.create({
   panelButtonTitleCancel: {
     fontSize: 18,
     fontWeight: 'bold',
-    color: TAGG_TEXT_LIGHT_BLUE,
+    color: TAGG_LIGHT_BLUE,
   },
   divider: {height: 1, borderWidth: 1, borderColor: '#e7e7e7'},
 });
diff --git a/src/components/common/SocialLinkModal.tsx b/src/components/common/SocialLinkModal.tsx
index b307a62c..41b044fe 100644
--- a/src/components/common/SocialLinkModal.tsx
+++ b/src/components/common/SocialLinkModal.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import {Modal, StyleSheet, Text, TouchableHighlight, View} from 'react-native';
 import {TextInput} from 'react-native-gesture-handler';
-import { TAGG_TEXT_LIGHT_BLUE } from '../../constants';
+import { TAGG_LIGHT_BLUE } from '../../constants';
 import {SCREEN_WIDTH} from '../../utils';
 
 interface SocialLinkModalProps {
@@ -105,7 +105,7 @@ const styles = StyleSheet.create({
     fontSize: 14,
     /* identical to box height */
     textAlign: 'center',
-    color: TAGG_TEXT_LIGHT_BLUE,
+    color: TAGG_LIGHT_BLUE,
   },
   textInput: {
     height: 20,
diff --git a/src/components/moments/Moment.tsx b/src/components/moments/Moment.tsx
index 7905e8a9..c591d973 100644
--- a/src/components/moments/Moment.tsx
+++ b/src/components/moments/Moment.tsx
@@ -11,7 +11,7 @@ import DownIcon from '../../assets/icons/down_icon.svg';
 import PlusIcon from '../../assets/icons/plus_icon-01.svg';
 import BigPlusIcon from '../../assets/icons/plus_icon-02.svg';
 import UpIcon from '../../assets/icons/up_icon.svg';
-import {TAGG_TEXT_LIGHT_BLUE} from '../../constants';
+import {TAGG_LIGHT_BLUE} from '../../constants';
 import {ERROR_UPLOAD_MOMENT_SHORT} from '../../constants/strings';
 import {SCREEN_WIDTH} from '../../utils';
 import MomentTile from './MomentTile';
@@ -87,7 +87,7 @@ const Moment: React.FC<MomentProps> = ({
                 width={19}
                 height={19}
                 onPress={() => move('up', title)}
-                color={TAGG_TEXT_LIGHT_BLUE}
+                color={TAGG_LIGHT_BLUE}
                 style={{marginLeft: 5}}
               />
             )}
@@ -96,7 +96,7 @@ const Moment: React.FC<MomentProps> = ({
                 width={19}
                 height={19}
                 onPress={() => move('down', title)}
-                color={TAGG_TEXT_LIGHT_BLUE}
+                color={TAGG_LIGHT_BLUE}
                 style={{marginLeft: 5}}
               />
             )}
@@ -111,7 +111,7 @@ const Moment: React.FC<MomentProps> = ({
               width={21}
               height={21}
               onPress={() => navigateToImagePicker()}
-              color={TAGG_TEXT_LIGHT_BLUE}
+              color={TAGG_LIGHT_BLUE}
               style={{marginRight: 10}}
             />
             {shouldAllowDeletion && (
@@ -173,7 +173,7 @@ const styles = StyleSheet.create({
   titleText: {
     fontSize: 16,
     fontWeight: 'bold',
-    color: TAGG_TEXT_LIGHT_BLUE,
+    color: TAGG_LIGHT_BLUE,
   },
   // titleContainer: {
   //   flex: 1,
diff --git a/src/components/moments/MomentPostContent.tsx b/src/components/moments/MomentPostContent.tsx
index 93271fa1..508b6d9f 100644
--- a/src/components/moments/MomentPostContent.tsx
+++ b/src/components/moments/MomentPostContent.tsx
@@ -27,6 +27,7 @@ const MomentPostContent: React.FC<MomentPostContentProps> = ({
     setElapsedTime(getTimePosted(dateTime));
     getMomentCommentsCount(momentId, setCommentsCount);
   }, [dateTime, momentId]);
+
   return (
     <View style={[styles.container, style]}>
       <Image
diff --git a/src/components/onboarding/TaggBigInput.tsx b/src/components/onboarding/TaggBigInput.tsx
index 4212afd1..0e42bd13 100644
--- a/src/components/onboarding/TaggBigInput.tsx
+++ b/src/components/onboarding/TaggBigInput.tsx
@@ -7,7 +7,7 @@ import {
   ViewStyle,
 } from 'react-native';
 import * as Animatable from 'react-native-animatable';
-import { TAGG_LIGHT_PURPLE } from '../../constants';
+import {TAGG_LIGHT_PURPLE} from '../../constants';
 
 interface TaggBigInputProps extends TextInputProps {
   valid?: boolean;
@@ -24,7 +24,7 @@ const TaggBigInput = React.forwardRef((props: TaggBigInputProps, ref: any) => {
     <View
       style={props.containerStyle ? props.containerStyle : styles.container}>
       <TextInput
-        style={[{ width: props.width }, styles.input]}
+        style={[{width: props.width}, styles.input]}
         placeholderTextColor="#ddd"
         clearButtonMode="while-editing"
         ref={ref}
diff --git a/src/components/profile/Content.tsx b/src/components/profile/Content.tsx
index e7fb566b..104d63fa 100644
--- a/src/components/profile/Content.tsx
+++ b/src/components/profile/Content.tsx
@@ -1,3 +1,4 @@
+import {useFocusEffect, useNavigation} from '@react-navigation/native';
 import React, {useCallback, useEffect, useState} from 'react';
 import {
   Alert,
@@ -9,18 +10,29 @@ import {
   Text,
   View,
 } from 'react-native';
+import {TouchableOpacity} from 'react-native-gesture-handler';
 import Animated from 'react-native-reanimated';
+import {useDispatch, useSelector, useStore} from 'react-redux';
+import {Cover} from '.';
+import GreyPlusLogo from '../../assets/icons/grey-plus-logo.svg';
+import {COVER_HEIGHT, TAGG_LIGHT_BLUE} from '../../constants';
 import {
-  CategorySelectionScreenType,
-  FriendshipStatusType,
-  MomentCategoryType,
-  MomentType,
-  ProfilePreviewType,
-  ProfileType,
-  ScreenType,
-  UserType,
-} from '../../types';
-import {COVER_HEIGHT, TAGG_TEXT_LIGHT_BLUE} from '../../constants';
+  blockUnblockUser,
+  deleteUserMomentsForCategory,
+  friendUnfriendUser,
+  loadFriendsData,
+  updateMomentCategories,
+  updateUserXFriends,
+  updateUserXProfileAllScreens,
+} from '../../store/actions';
+import {
+  EMPTY_MOMENTS_LIST,
+  EMPTY_PROFILE_PREVIEW_LIST,
+  NO_PROFILE,
+  NO_USER,
+} from '../../store/initialStates';
+import {RootState} from '../../store/rootreducer';
+import {CategorySelectionScreenType, MomentType, ScreenType} from '../../types';
 import {
   fetchUserX,
   getUserAsProfilePreviewType,
@@ -28,33 +40,12 @@ import {
   SCREEN_HEIGHT,
   userLogin,
 } from '../../utils';
-import TaggsBar from '../taggs/TaggsBar';
+import {TaggPrompt} from '../common';
 import {Moment} from '../moments';
+import TaggsBar from '../taggs/TaggsBar';
 import ProfileBody from './ProfileBody';
 import ProfileCutout from './ProfileCutout';
 import ProfileHeader from './ProfileHeader';
-import {useDispatch, useSelector, useStore} from 'react-redux';
-import {RootState} from '../../store/rootreducer';
-import {
-  friendUnfriendUser,
-  blockUnblockUser,
-  loadFriendsData,
-  updateUserXFriends,
-  updateMomentCategories,
-  deleteUserMomentsForCategory,
-  updateUserXProfileAllScreens,
-} from '../../store/actions';
-import {
-  NO_USER,
-  NO_PROFILE,
-  EMPTY_PROFILE_PREVIEW_LIST,
-  EMPTY_MOMENTS_LIST,
-} from '../../store/initialStates';
-import {Cover} from '.';
-import {TouchableOpacity} from 'react-native-gesture-handler';
-import {useFocusEffect, useNavigation} from '@react-navigation/native';
-import GreyPlusLogo from '../../assets/icons/grey-plus-logo.svg';
-import {TaggPrompt} from '../common';
 
 interface ContentProps {
   y: Animated.Value<number>;
@@ -113,9 +104,10 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
   const [isStageOnePromptClosed, setIsStageOnePromptClosed] = useState<boolean>(
     false,
   );
-  const [isStageThreePromptClosed, setIsStageThreePromptClosed] = useState<
-    boolean
-  >(false);
+  const [
+    isStageThreePromptClosed,
+    setIsStageThreePromptClosed,
+  ] = useState<boolean>(false);
 
   const onRefresh = useCallback(() => {
     const refrestState = async () => {
@@ -284,7 +276,7 @@ const Content: React.FC<ContentProps> = ({y, userXId, screenType}) => {
                 momentCategories.filter((mc) => mc !== category),
                 false,
               ),
-            )
+            );
             dispatch(deleteUserMomentsForCategory(category));
           },
         },
@@ -423,7 +415,7 @@ const styles = StyleSheet.create({
     flexDirection: 'column',
   },
   createCategoryButton: {
-    backgroundColor: TAGG_TEXT_LIGHT_BLUE,
+    backgroundColor: TAGG_LIGHT_BLUE,
     justifyContent: 'center',
     alignItems: 'center',
     width: '70%',
diff --git a/src/components/profile/ProfileBody.tsx b/src/components/profile/ProfileBody.tsx
index 6284ff59..a45e9e43 100644
--- a/src/components/profile/ProfileBody.tsx
+++ b/src/components/profile/ProfileBody.tsx
@@ -3,7 +3,7 @@ import {StyleSheet, View, Text, LayoutChangeEvent, Linking} from 'react-native';
 import {Button} from 'react-native-elements';
 import {
   TAGG_DARK_BLUE,
-  TAGG_TEXT_LIGHT_BLUE,
+  TAGG_LIGHT_BLUE,
   TOGGLE_BUTTON_TYPE,
 } from '../../constants';
 import ToggleButton from './ToggleButton';
@@ -178,7 +178,7 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     width: SCREEN_WIDTH * 0.4,
     height: SCREEN_WIDTH * 0.09,
-    borderColor: TAGG_TEXT_LIGHT_BLUE,
+    borderColor: TAGG_LIGHT_BLUE,
     borderWidth: 3,
     borderRadius: 5,
     marginRight: '2%',
@@ -186,7 +186,7 @@ const styles = StyleSheet.create({
     backgroundColor: 'transparent',
   },
   requestedButtonTitle: {
-    color: TAGG_TEXT_LIGHT_BLUE,
+    color: TAGG_LIGHT_BLUE,
     padding: 0,
     fontSize: 14,
     fontWeight: '700',
@@ -205,7 +205,7 @@ const styles = StyleSheet.create({
     padding: 0,
     borderRadius: 5,
     marginRight: '2%',
-    backgroundColor: TAGG_TEXT_LIGHT_BLUE,
+    backgroundColor: TAGG_LIGHT_BLUE,
   },
 });
 
diff --git a/src/components/profile/ProfileMoreInfoDrawer.tsx b/src/components/profile/ProfileMoreInfoDrawer.tsx
index 76f0f27f..9fe36ae1 100644
--- a/src/components/profile/ProfileMoreInfoDrawer.tsx
+++ b/src/components/profile/ProfileMoreInfoDrawer.tsx
@@ -4,7 +4,7 @@ import {StyleSheet, TouchableOpacity} from 'react-native';
 import {useSelector} from 'react-redux';
 import MoreIcon from '../../assets/icons/more_horiz-24px.svg';
 import PersonOutline from '../../assets/ionicons/person-outline.svg';
-import {TAGG_DARK_BLUE, TAGG_TEXT_LIGHT_BLUE} from '../../constants';
+import {TAGG_DARK_BLUE, TAGG_LIGHT_BLUE} from '../../constants';
 import {RootState} from '../../store/rootreducer';
 import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
 import {GenericMoreInfoDrawer} from '../common';
@@ -101,7 +101,7 @@ const styles = StyleSheet.create({
   panelButtonTitleCancel: {
     fontSize: 18,
     fontWeight: 'bold',
-    color: TAGG_TEXT_LIGHT_BLUE,
+    color: TAGG_LIGHT_BLUE,
   },
   divider: {height: 1, borderWidth: 1, borderColor: '#e7e7e7'},
   more: {
diff --git a/src/components/profile/ToggleButton.tsx b/src/components/profile/ToggleButton.tsx
index 5d8f7874..236d811c 100644
--- a/src/components/profile/ToggleButton.tsx
+++ b/src/components/profile/ToggleButton.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import {StyleSheet, Text} from 'react-native';
 import {TouchableOpacity} from 'react-native-gesture-handler';
-import {TAGG_TEXT_LIGHT_BLUE} from '../../constants';
+import {TAGG_LIGHT_BLUE} from '../../constants';
 import {getToggleButtonText, SCREEN_WIDTH} from '../../utils';
 
 type ToggleButtonProps = {
@@ -36,7 +36,7 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     width: SCREEN_WIDTH * 0.4,
     height: SCREEN_WIDTH * 0.08,
-    borderColor: TAGG_TEXT_LIGHT_BLUE,
+    borderColor: TAGG_LIGHT_BLUE,
     borderWidth: 3,
     borderRadius: 5,
     marginRight: '2%',
@@ -45,10 +45,10 @@ const styles = StyleSheet.create({
     fontWeight: 'bold',
   },
   buttonColor: {
-    backgroundColor: TAGG_TEXT_LIGHT_BLUE,
+    backgroundColor: TAGG_LIGHT_BLUE,
   },
   textColor: {color: 'white'},
   buttonColorToggled: {backgroundColor: 'white'},
-  textColorToggled: {color: TAGG_TEXT_LIGHT_BLUE},
+  textColorToggled: {color: TAGG_LIGHT_BLUE},
 });
 export default ToggleButton;
diff --git a/src/components/search/RecentSearches.tsx b/src/components/search/RecentSearches.tsx
index 8a06017c..bdbd5773 100644
--- a/src/components/search/RecentSearches.tsx
+++ b/src/components/search/RecentSearches.tsx
@@ -7,7 +7,7 @@ import {
   TouchableOpacityProps,
 } from 'react-native';
 import {PreviewType, ProfilePreviewType, ScreenType} from 'src/types';
-import {TAGG_TEXT_LIGHT_BLUE} from '../../constants';
+import {TAGG_LIGHT_BLUE} from '../../constants';
 import SearchResults from './SearchResults';
 
 interface RecentSearchesProps extends TouchableOpacityProps {
@@ -55,7 +55,7 @@ const styles = StyleSheet.create({
   clear: {
     fontSize: 18,
     fontWeight: 'bold',
-    color: TAGG_TEXT_LIGHT_BLUE,
+    color: TAGG_LIGHT_BLUE,
   },
 });
 
diff --git a/src/components/taggs/TwitterTaggPost.tsx b/src/components/taggs/TwitterTaggPost.tsx
index c971a82c..0cfde857 100644
--- a/src/components/taggs/TwitterTaggPost.tsx
+++ b/src/components/taggs/TwitterTaggPost.tsx
@@ -6,7 +6,7 @@ import LinearGradient from 'react-native-linear-gradient';
 import {
   AVATAR_DIM,
   TAGGS_GRADIENT,
-  TAGG_TEXT_LIGHT_BLUE,
+  TAGG_LIGHT_BLUE,
 } from '../../constants';
 import {TwitterPostType} from '../../types';
 import {handleOpenSocialUrlOnBrowser, SCREEN_WIDTH} from '../../utils';
@@ -237,7 +237,7 @@ const styles = StyleSheet.create({
   },
   replyShowThisThread: {
     fontSize: 15,
-    color: TAGG_TEXT_LIGHT_BLUE,
+    color: TAGG_LIGHT_BLUE,
   },
 });
 
diff --git a/src/constants/constants.ts b/src/constants/constants.ts
index b96d9438..37b6e038 100644
--- a/src/constants/constants.ts
+++ b/src/constants/constants.ts
@@ -59,7 +59,7 @@ export const SNAPCHAT_FONT_COLOR: string = '#FFFC00';
 export const YOUTUBE_FONT_COLOR: string = '#FCA4A4';
 
 export const TAGG_DARK_BLUE = '#4E699C';
-export const TAGG_TEXT_LIGHT_BLUE: string = '#698DD3';
+export const TAGG_LIGHT_BLUE: string = '#698DD3';
 export const TAGG_LIGHT_PURPLE = '#F4DDFF';
 
 export const TAGGS_GRADIENT = {
diff --git a/src/screens/search/SearchScreen.tsx b/src/screens/search/SearchScreen.tsx
index 9f98b4d7..f231cb78 100644
--- a/src/screens/search/SearchScreen.tsx
+++ b/src/screens/search/SearchScreen.tsx
@@ -20,7 +20,7 @@ import {
   SearchResultsBackground,
   TabsGradient,
 } from '../../components';
-import {SEARCH_ENDPOINT, TAGG_TEXT_LIGHT_BLUE} from '../../constants';
+import {SEARCH_ENDPOINT, TAGG_LIGHT_BLUE} from '../../constants';
 import {loadRecentlySearched, resetScreenType} from '../../store/actions';
 import {RootState} from '../../store/rootReducer';
 import {ProfilePreviewType, ScreenType, UserType} from '../../types';
@@ -213,7 +213,7 @@ const styles = StyleSheet.create({
   clear: {
     fontSize: 17,
     fontWeight: 'bold',
-    color: TAGG_TEXT_LIGHT_BLUE,
+    color: TAGG_LIGHT_BLUE,
   },
   image: {
     width: SCREEN_WIDTH,
-- 
cgit v1.2.3-70-g09d2


From f7ed1dae99761eb4647d3b6cb68f009fd467ad8a Mon Sep 17 00:00:00 2001
From: Ivan Chen <ivan@tagg.id>
Date: Tue, 26 Jan 2021 18:10:12 -0500
Subject: thumbnail for explore

---
 src/components/search/ExploreSection.tsx     | 15 +++++++++------
 src/components/search/ExploreSectionUser.tsx | 18 ++++++------------
 2 files changed, 15 insertions(+), 18 deletions(-)

(limited to 'src/components/search')

diff --git a/src/components/search/ExploreSection.tsx b/src/components/search/ExploreSection.tsx
index 17079e77..025c8c3c 100644
--- a/src/components/search/ExploreSection.tsx
+++ b/src/components/search/ExploreSection.tsx
@@ -1,5 +1,5 @@
 import React, {Fragment} from 'react';
-import {ScrollView, StyleSheet, Text, View} from 'react-native';
+import {FlatList, StyleSheet, Text, View} from 'react-native';
 import {ProfilePreviewType} from '../../types';
 import {normalize} from '../../utils';
 import ExploreSectionUser from './ExploreSectionUser';
@@ -17,12 +17,15 @@ const ExploreSection: React.FC<ExploreSectionProps> = ({title, users}) => {
   return users.length !== 0 ? (
     <View style={styles.container}>
       <Text style={styles.header}>{title}</Text>
-      <ScrollView horizontal showsHorizontalScrollIndicator={false}>
-        <View style={styles.padding} />
-        {users.map((user) => (
+      <FlatList
+        data={users}
+        ListHeaderComponent={<View style={styles.padding} />}
+        renderItem={({item: user}: {item: ProfilePreviewType}) => (
           <ExploreSectionUser key={user.id} user={user} style={styles.user} />
-        ))}
-      </ScrollView>
+        )}
+        showsHorizontalScrollIndicator={false}
+        horizontal
+      />
     </View>
   ) : (
     <Fragment />
diff --git a/src/components/search/ExploreSectionUser.tsx b/src/components/search/ExploreSectionUser.tsx
index 68e077e3..b0cfe5c6 100644
--- a/src/components/search/ExploreSectionUser.tsx
+++ b/src/components/search/ExploreSectionUser.tsx
@@ -9,7 +9,7 @@ import {
 } from 'react-native';
 import LinearGradient from 'react-native-linear-gradient';
 import {useDispatch, useSelector, useStore} from 'react-redux';
-import {loadAvatar} from '../../services';
+import {loadImageFromURL} from '../../services';
 import {RootState} from '../../store/rootReducer';
 import {ProfilePreviewType, ScreenType} from '../../types';
 import {fetchUserX, normalize, userXInStore} from '../../utils';
@@ -36,18 +36,13 @@ const ExploreSectionUser: React.FC<ExploreSectionUserProps> = ({
   const dispatch = useDispatch();
 
   useEffect(() => {
-    let mounted = true;
-    const loadAvatarImage = async () => {
-      const response = await loadAvatar(id, true);
-      if (mounted) {
+    (async () => {
+      const response = await loadImageFromURL(user.thumbnail_url);
+      if (response) {
         setAvatar(response);
       }
-    };
-    loadAvatarImage();
-    return () => {
-      mounted = false;
-    };
-  }, [user]);
+    })();
+  }, []);
 
   const handlePress = async () => {
     if (!userXInStore(state, screenType, user.id)) {
@@ -63,7 +58,6 @@ const ExploreSectionUser: React.FC<ExploreSectionUserProps> = ({
       screenType,
     });
   };
-
   return (
     <TouchableOpacity style={[styles.container, style]} onPress={handlePress}>
       <LinearGradient
-- 
cgit v1.2.3-70-g09d2


From d70ade2e653ee93aca09d62ab7822b8d0f6dc2b5 Mon Sep 17 00:00:00 2001
From: Ivan Chen <ivan@tagg.id>
Date: Tue, 26 Jan 2021 18:23:44 -0500
Subject: fixed no internet app crash

---
 src/components/profile/FriendsCount.tsx | 6 +++---
 src/components/search/Explore.tsx       | 7 ++++---
 2 files changed, 7 insertions(+), 6 deletions(-)

(limited to 'src/components/search')

diff --git a/src/components/profile/FriendsCount.tsx b/src/components/profile/FriendsCount.tsx
index 9647710e..851dbc3b 100644
--- a/src/components/profile/FriendsCount.tsx
+++ b/src/components/profile/FriendsCount.tsx
@@ -17,10 +17,10 @@ const FriendsCount: React.FC<FriendsCountProps> = ({
   userXId,
   screenType,
 }) => {
-  const count = (userXId
+  const {friends} = userXId
     ? useSelector((state: RootState) => state.userX[screenType][userXId])
-    : useSelector((state: RootState) => state.friends)
-  )?.friends.length;
+    : useSelector((state: RootState) => state.friends);
+  const count = friends ? friends.length : 0;
 
   const displayedCount: string =
     count < 5e3
diff --git a/src/components/search/Explore.tsx b/src/components/search/Explore.tsx
index 4a71249b..2a3bc749 100644
--- a/src/components/search/Explore.tsx
+++ b/src/components/search/Explore.tsx
@@ -12,9 +12,10 @@ const Explore: React.FC = () => {
   return (
     <View style={styles.container}>
       <Text style={styles.header}>Search Profiles</Text>
-      {EXPLORE_SECTION_TITLES.map((title: ExploreSectionType) => (
-        <ExploreSection key={title} title={title} users={explores[title]} />
-      ))}
+      {explores &&
+        EXPLORE_SECTION_TITLES.map((title: ExploreSectionType) => (
+          <ExploreSection key={title} title={title} users={explores[title]} />
+        ))}
     </View>
   );
 };
-- 
cgit v1.2.3-70-g09d2