1 files changed, 41 insertions, 0 deletions
diff --git a/src/components/profile/ProfilePreview.tsx b/src/components/profile/ProfilePreview.tsx
index 5567fa5a..93d1f415 100644
--- a/src/components/profile/ProfilePreview.tsx
+++ b/src/components/profile/ProfilePreview.tsx
@@ -203,6 +203,14 @@ const ProfilePreview: React.FC<ProfilePreviewProps> = ({
       usernameStyle = styles.commentUsername;
       nameStyle = styles.commentName;
       break;
+    case 'Follow':
+      containerStyle = styles.followContainer;
+      avatarStyle = styles.followAvatar;
+      nameContainerStyle = styles.followNameContainer;
+      usernameToDisplay = '@' + username;
+      usernameStyle = styles.followUsername;
+      nameStyle = styles.followName;
+      break;
     default:
       containerStyle = styles.searchResultContainer;
       avatarStyle = styles.searchResultAvatar;
@@ -240,6 +248,12 @@ const ProfilePreview: React.FC<ProfilePreviewProps> = ({
             <Text style={usernameStyle}>{usernameToDisplay}</Text>
           </>
         )}
+        {previewType === 'Follow' && (
+          <>
+            <Text style={usernameStyle}>{usernameToDisplay}</Text>
+            <Text style={nameStyle}>{first_name.concat(' ', last_name)}</Text>
+          </>
+        )}
       </View>
     </TouchableOpacity>
   );
@@ -320,6 +334,33 @@ const styles = StyleSheet.create({
     color: 'white',
     textAlign: 'center',
   },
+  followContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginVertical: 10,
+  },
+  followAvatar: {
+    height: 42,
+    width: 42,
+    marginRight: 15,
+    borderRadius: 20,
+  },
+  followNameContainer: {
+    justifyContent: 'space-evenly',
+    alignSelf: 'stretch',
+  },
+  followUsername: {
+    fontSize: 14,
+    fontWeight: '700',
+    color: '#3C3C3C',
+    letterSpacing: 0.6,
+  },
+  followName: {
+    fontSize: 12,
+    fontWeight: '500',
+    color: '#6C6C6C',
+    letterSpacing: 0.5,
+  },
 });
 
 export default ProfilePreview;