From 1080adb75c18f6da6b91be4264c69a9bf908ff0d Mon Sep 17 00:00:00 2001
From: Shravya Ramesh <shravs1208@gmail.com>
Date: Thu, 18 Mar 2021 02:06:02 -0700
Subject: works

---
 src/components/friends/InviteFriendTile.tsx | 86 +++++++++++++++++++++++++++++
 src/components/friends/index.ts             |  1 +
 2 files changed, 87 insertions(+)
 create mode 100644 src/components/friends/InviteFriendTile.tsx
 create mode 100644 src/components/friends/index.ts

(limited to 'src/components/friends')

diff --git a/src/components/friends/InviteFriendTile.tsx b/src/components/friends/InviteFriendTile.tsx
new file mode 100644
index 00000000..2d2b8e04
--- /dev/null
+++ b/src/components/friends/InviteFriendTile.tsx
@@ -0,0 +1,86 @@
+import React, {useState} from 'react';
+import {
+  StyleSheet,
+  Text,
+  TouchableOpacity,
+  TouchableWithoutFeedback,
+  View,
+} from 'react-native';
+import {useSelector} from 'react-redux';
+import {RootState} from '../../store/rootReducer';
+import {TAGG_LIGHT_BLUE} from '../../constants';
+import {inviteFriendService} from '../../services';
+import {normalize} from '../../utils';
+
+interface InviteFriendTileProps {
+  item: Object;
+}
+
+const InviteFriendTile: React.FC<InviteFriendTileProps> = ({item}) => {
+  const [invited, setInvited] = useState<boolean>(false);
+  const {profile} = useSelector((state: RootState) => state.user);
+  const handleInviteFriend = async () => {
+    const response = await inviteFriendService(
+      item.phoneNumber,
+      item.firstName,
+      item.lastName,
+      profile.name,
+    );
+    if (response) {
+      setInvited(response);
+    }
+  };
+
+  return (
+    <TouchableWithoutFeedback>
+      <View style={styles.container}>
+        <Text style={styles.label}>{item.firstName + ' ' + item.lastName}</Text>
+        <TouchableOpacity
+          disabled={invited}
+          style={styles.button}
+          onPress={handleInviteFriend}>
+          <Text style={styles.buttonTitle}>
+            {invited ? 'Invited' : 'Invite'}
+          </Text>
+        </TouchableOpacity>
+      </View>
+    </TouchableWithoutFeedback>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    height: normalize(42),
+    backgroundColor: 'thistle',
+  },
+  label: {
+    fontWeight: '500',
+    fontSize: normalize(14),
+  },
+  button: {
+    alignSelf: 'center',
+    justifyContent: 'center',
+    alignItems: 'center',
+    width: 82,
+    height: 25,
+    borderColor: TAGG_LIGHT_BLUE,
+    borderWidth: 2,
+    borderRadius: 2,
+    padding: 0,
+    backgroundColor: 'transparent',
+  },
+  buttonTitle: {
+    color: TAGG_LIGHT_BLUE,
+    padding: 0,
+    fontSize: normalize(11),
+    fontWeight: '700',
+    lineHeight: normalize(13.13),
+    letterSpacing: normalize(0.6),
+    paddingHorizontal: '3.8%',
+  },
+});
+
+export default InviteFriendTile;
diff --git a/src/components/friends/index.ts b/src/components/friends/index.ts
new file mode 100644
index 00000000..42727784
--- /dev/null
+++ b/src/components/friends/index.ts
@@ -0,0 +1 @@
+export {default as InviteFriendTile} from './InviteFriendTile';
-- 
cgit v1.2.3-70-g09d2