[TMA 27] Followers list (#69)

* "Followers list "

* Mended followers list

* fix export error

Co-authored-by: Ashm Walia <ashmwalia@outlook.com>
Co-authored-by: Husam Salhab <47015061+hsalhab@users.noreply.github.com>

1 files changed, 64 insertions, 0 deletions

diff --git a/src/components/profile/Followers.tsx b/src/components/profile/Followers.tsx
new file mode 100644
index 00000000..e0fee303
--- /dev/null
+++ b/src/components/profile/Followers.tsx
@@ -0,0 +1,64 @@
+import React from 'react';
+import {View, StyleSheet, ViewProps, Text} from 'react-native';
+import {ProfilePreviewType} from '../../types';
+import {ProfilePreview} from '..';
+import {useNavigation} from '@react-navigation/native';
+import {Button} from 'react-native-elements';
+
+interface FollowersListProps {
+  followers: Array<ProfilePreviewType>;
+  sectionTitle: string;
+}
+
+const Followers: React.FC<FollowersListProps> = ({followers}) => {
+  const navigation = useNavigation();
+  return (
+    <>
+      <View style={styles.header}>
+        <Button
+          title="X"
+          buttonStyle={styles.button}
+          titleStyle={styles.buttonText}
+          onPress={() => {
+            navigation.goBack();
+          }}
+        />
+        <Text style={styles.title}>{'Followers'}</Text>
+      </View>
+      {followers.map((profilePreview) => (
+        <ProfilePreview
+          style={styles.follower}
+          key={profilePreview.id}
+          {...{profilePreview}}
+          isComment={false}
+        />
+      ))}
+    </>
+  );
+};
+
+const styles = StyleSheet.create({
+  header: {flexDirection: 'row'},
+  follower: {
+    marginVertical: 10,
+  },
+  title: {
+    position: 'relative',
+    fontSize: 17,
+    fontWeight: 'bold',
+    paddingBottom: 10,
+    paddingTop: 10,
+    flexGrow: 1,
+    paddingLeft: '26%',
+  },
+  button: {
+    backgroundColor: 'transparent',
+  },
+  buttonText: {
+    color: 'black',
+    fontSize: 18,
+    fontWeight: '400',
+  },
+});
+
+export default Followers;