2 files changed, 89 insertions, 0 deletions
diff --git a/src/components/common/AcceptDeclineButtons.tsx b/src/components/common/AcceptDeclineButtons.tsx
new file mode 100644
index 00000000..2ebae029
--- /dev/null
+++ b/src/components/common/AcceptDeclineButtons.tsx
@@ -0,0 +1,88 @@
+import React from 'react';
+import {StyleSheet, View} from 'react-native';
+import {Button} from 'react-native-elements';
+import {useDispatch, useStore} from 'react-redux';
+import {
+  declineFriendRequest,
+  loadUserNotifications,
+  updateUserXFriends,
+} from '../../store/actions';
+import {TAGG_TEXT_LIGHT_BLUE} from '../../constants';
+import {acceptFriendRequest} from '../../store/actions';
+import {RootState} from '../../store/rootReducer';
+import {ProfilePreviewType} from '../../types';
+import {SCREEN_WIDTH} from '../../utils';
+
+interface AcceptDeclineButtonsProps {
+  requester: ProfilePreviewType;
+}
+const AcceptDeclineButtons: React.FC<AcceptDeclineButtonsProps> = (props) => {
+  const {requester} = props;
+  const state: RootState = useStore().getState();
+  const dispatch = useDispatch();
+
+  const handleAcceptRequest = async () => {
+    dispatch(acceptFriendRequest(requester));
+    dispatch(updateUserXFriends(requester.id, state));
+    dispatch(loadUserNotifications());
+  };
+
+  const handleDeclineFriendRequest = async () => {
+    dispatch(declineFriendRequest(requester.id));
+  };
+  return (
+    <>
+      <Button
+        title="Accept"
+        buttonStyle={styles.acceptButton}
+        titleStyle={styles.acceptButtonTitle}
+        onPress={() => handleAcceptRequest()}
+      />
+      <Button
+        title="Reject"
+        buttonStyle={styles.rejectButton}
+        titleStyle={styles.rejectButtonTitle}
+        onPress={() => handleDeclineFriendRequest()}
+      />
+    </>
+  );
+};
+
+const styles = StyleSheet.create({
+  acceptButton: {
+    justifyContent: 'center',
+    alignItems: 'center',
+    width: SCREEN_WIDTH * 0.2,
+    height: SCREEN_WIDTH * 0.07,
+    borderRadius: 5,
+    padding: 0,
+    marginRight: '2%',
+    backgroundColor: TAGG_TEXT_LIGHT_BLUE,
+  },
+  rejectButton: {
+    justifyContent: 'center',
+    alignItems: 'center',
+    width: SCREEN_WIDTH * 0.2,
+    height: SCREEN_WIDTH * 0.07,
+    borderColor: TAGG_TEXT_LIGHT_BLUE,
+    borderWidth: 1,
+    borderRadius: 5,
+    marginRight: '2%',
+    padding: 0,
+    backgroundColor: 'white',
+  },
+  rejectButtonTitle: {
+    color: TAGG_TEXT_LIGHT_BLUE,
+    padding: 0,
+    fontSize: 14,
+    fontWeight: '800',
+  },
+  acceptButtonTitle: {
+    color: 'white',
+    padding: 0,
+    fontSize: 14,
+    fontWeight: '800',
+  },
+});
+
+export default AcceptDeclineButtons;
diff --git a/src/components/common/index.ts b/src/components/common/index.ts
index 9162ec70..61c7fa26 100644
--- a/src/components/common/index.ts
+++ b/src/components/common/index.ts
@@ -19,3 +19,4 @@ export {default as TaggLoadingTndicator} from './TaggLoadingIndicator';
 export {default as GenericMoreInfoDrawer} from './GenericMoreInfoDrawer';
 export {default as TaggPopUp} from './TaggPopup';
 export {default as TaggPrompt} from './TaggPrompt';
+export {default as AcceptDeclineButtons} from './AcceptDeclineButtons';