Merge pull request #420 from shravyaramesh/tma803-friend-accept-notif

[TMA-803] Modify friend request accepted notification

1 files changed, 34 insertions, 7 deletions

diff --git a/src/components/notifications/Notification.tsx b/src/components/notifications/Notification.tsx
index ae884b42..cb62047a 100644
--- a/src/components/notifications/Notification.tsx
+++ b/src/components/notifications/Notification.tsx
@@ -34,6 +34,7 @@ import {
 } from '../../utils';
 import {Avatar} from '../common';
 import AcceptDeclineButtons from '../common/AcceptDeclineButtons';
+import {MessageButton} from '../messages';
 
 interface NotificationProps {
   item: NotificationType;
@@ -61,6 +62,10 @@ const Notification: React.FC<NotificationProps> = (props) => {
 
   const [avatar, setAvatar] = useState<string | undefined>(undefined);
   const [momentURI, setMomentURI] = useState<string | undefined>(undefined);
+  const notification_title =
+    notification_type === 'FRD_ACPT'
+      ? `Say Hi to ${first_name}!`
+      : `${first_name} ${last_name}`;
 
   useEffect(() => {
     (async () => {
@@ -246,9 +251,7 @@ const Notification: React.FC<NotificationProps> = (props) => {
           {/* Text content: Actor name and verbage*/}
           <View style={styles.contentContainer}>
             <TouchableWithoutFeedback onPress={navigateToProfile}>
-              <Text style={styles.actorName}>
-                {first_name} {last_name}
-              </Text>
+              <Text style={styles.actorName}>{notification_title}</Text>
             </TouchableWithoutFeedback>
             <TouchableWithoutFeedback
               style={styles.textContainerStyles}
@@ -273,6 +276,30 @@ const Notification: React.FC<NotificationProps> = (props) => {
               />
             </View>
           )}
+          {notification_type === 'FRD_ACPT' && (
+            <View style={styles.buttonsContainer}>
+              <MessageButton
+                userXId={id}
+                isBlocked={false}
+                friendship_status={'friends'}
+                externalStyles={{
+                  container: {
+                    width: normalize(63),
+                    height: normalize(21),
+                    marginTop: '7%',
+                  },
+                  buttonTitle: {
+                    fontSize: normalize(11),
+                    lineHeight: normalize(13.13),
+                    letterSpacing: normalize(0.5),
+                    fontWeight: '700',
+                    textAlign: 'center',
+                  },
+                }}
+                solid
+              />
+            </View>
+          )}
           {/* Moment Image Preview */}
           {(notification_type === 'CMT' ||
             notification_type === 'MOM_3+' ||
@@ -306,7 +333,7 @@ const styles = StyleSheet.create({
     flex: 1,
     alignSelf: 'center',
     alignItems: 'center',
-    paddingHorizontal: '8%',
+    paddingHorizontal: '6.3%',
   },
   avatarContainer: {
     height: 42,
@@ -348,9 +375,9 @@ const styles = StyleSheet.create({
     lineHeight: normalize(13.13),
   },
   timeStampStyles: {
-    fontWeight: '700',
-    fontSize: normalize(12),
-    lineHeight: normalize(14.32),
+    fontWeight: '500',
+    fontSize: normalize(11),
+    lineHeight: normalize(13.13),
     marginHorizontal: 2,
     color: '#828282',
     textAlignVertical: 'center',