2 files changed, 31 insertions, 10 deletions
diff --git a/src/components/friends/InviteFriendTile.tsx b/src/components/friends/InviteFriendTile.tsx
index 3fbf2e73..95ebf16a 100644
--- a/src/components/friends/InviteFriendTile.tsx
+++ b/src/components/friends/InviteFriendTile.tsx
@@ -58,10 +58,17 @@ const InviteFriendTile: React.FC<InviteFriendTileProps> = ({item}) => {
         </View>
         <TouchableOpacity
           disabled={invited}
-          style={styles.button}
+          style={[
+            styles.button,
+            invited ? styles.pendingButton : styles.inviteButton,
+          ]}
           onPress={handleInviteFriend}>
-          <Text style={styles.buttonTitle}>
-            {invited ? 'Invited' : 'Invite'}
+          <Text
+            style={[
+              styles.buttonTitle,
+              invited ? styles.pendingButtonTitle : styles.inviteButtonTitle,
+            ]}>
+            {invited ? 'Pending' : 'Invite'}
           </Text>
         </TouchableOpacity>
       </View>
@@ -98,14 +105,18 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     width: 82,
     height: 25,
-    borderColor: TAGG_LIGHT_BLUE,
     borderWidth: 2,
     borderRadius: 2,
     padding: 0,
+    borderColor: TAGG_LIGHT_BLUE,
+  },
+  pendingButton: {
+    backgroundColor: TAGG_LIGHT_BLUE,
+  },
+  inviteButton: {
     backgroundColor: 'transparent',
   },
   buttonTitle: {
-    color: TAGG_LIGHT_BLUE,
     padding: 0,
     fontSize: normalize(11),
     fontWeight: '700',
@@ -113,6 +124,12 @@ const styles = StyleSheet.create({
     letterSpacing: normalize(0.6),
     paddingHorizontal: '3.8%',
   },
+  pendingButtonTitle: {
+    color: 'white',
+  },
+  inviteButtonTitle: {
+    color: TAGG_LIGHT_BLUE,
+  },
 });
 
 export default InviteFriendTile;
diff --git a/src/screens/profile/InviteFriendsScreen.tsx b/src/screens/profile/InviteFriendsScreen.tsx
index 36aa8ada..53e6b221 100644
--- a/src/screens/profile/InviteFriendsScreen.tsx
+++ b/src/screens/profile/InviteFriendsScreen.tsx
@@ -90,14 +90,18 @@ const InviteFriendsScreen: React.FC<InviteFriendsScreenProps> = ({route}) => {
       if (query.length > 0) {
         const searchResultsUsers = usersFromContacts.filter(
           (item: ProfilePreviewType) =>
-            item.first_name.toLowerCase().includes(query) ||
-            item.last_name.toLowerCase().includes(query) ||
-            item.username.toLowerCase().includes(query),
+            (item.first_name + ' ' + item.last_name)
+              .toLowerCase()
+              .startsWith(query) ||
+            item.username.toLowerCase().startsWith(query) ||
+            item.last_name.toLowerCase().startsWith(query),
         );
         const searchResultsNonUsers = nonUsersFromContacts.filter(
           (item) =>
-            item.firstName.toLowerCase().includes(query) ||
-            item.lastName.toLowerCase().includes(query),
+            (item.firstName + ' ' + item.lastName)
+              .toLowerCase()
+              .startsWith(query) ||
+            item.lastName.toLowerCase().startsWith(query),
         );
         const sanitizedResult = {
           usersFromContacts: searchResultsUsers,