2 files changed, 60 insertions, 35 deletions

diff --git a/src/components/profile/MomentMoreInfoDrawer.tsx b/src/components/profile/MomentMoreInfoDrawer.tsx
index 1265497e..a796ffd8 100644
--- a/src/components/profile/MomentMoreInfoDrawer.tsx
+++ b/src/components/profile/MomentMoreInfoDrawer.tsx
@@ -1,44 +1,58 @@
+import {useNavigation} from '@react-navigation/core';
 import React, {useEffect, useState} from 'react';
 import {
   Alert,
   GestureResponderEvent,
   StyleSheet,
+  TextStyle,
   TouchableOpacity,
   ViewProps,
 } from 'react-native';
 import MoreIcon from '../../assets/icons/more_horiz-24px.svg';
 import {ERROR_DELETE_MOMENT, MOMENT_DELETED_MSG} from '../../constants/strings';
 import {deleteMoment, sendReport} from '../../services';
+import {MomentTagType, MomentType, ScreenType} from '../../types/types';
 import {GenericMoreInfoDrawer} from '../common';
 
 enum MomentDrawerOptions {
   DeleteMoment = 'Delete Moment',
   ReportIssue = 'Report an Issue',
   RemoveTag = 'Remove yourself from moment',
+  EditMoment = 'Edit Moment',
 }
 interface MomentMoreInfoDrawerProps extends ViewProps {
   isOpen: boolean;
   setIsOpen: (visible: boolean) => void;
-  momentId: string;
   isOwnProfile: boolean;
   momentTagId: string;
   removeTag: () => Promise<void>;
   dismissScreenAndUpdate: () => void;
+  screenType: ScreenType;
+  moment: MomentType;
+  tags: MomentTagType[];
 }
 
 const MomentMoreInfoDrawer: React.FC<MomentMoreInfoDrawerProps> = (props) => {
   const {
-    momentId,
     setIsOpen,
     isOwnProfile,
     dismissScreenAndUpdate,
     momentTagId,
     removeTag,
+    screenType,
+    moment,
+    tags,
   } = props;
 
+  const navigation = useNavigation();
+
+  const [drawerButtons, setDrawerButtons] = useState<
+    [string, (event: GestureResponderEvent) => void, JSX.Element?, TextStyle?][]
+  >([]);
+
   const handleDeleteMoment = async () => {
     setIsOpen(false);
-    deleteMoment(momentId).then((success) => {
+    deleteMoment(moment.moment_id).then((success) => {
       if (success) {
         // set time out for UI transitions
         setTimeout(() => {
@@ -88,7 +102,8 @@ const MomentMoreInfoDrawer: React.FC<MomentMoreInfoDrawerProps> = (props) => {
         [
           {
             text: 'Mark as inappropriate',
-            onPress: () => sendReport(momentId, 'Mark as inappropriate'),
+            onPress: () =>
+              sendReport(moment.moment_id, 'Mark as inappropriate'),
           },
           {
             text: 'Cancel',
@@ -96,7 +111,7 @@ const MomentMoreInfoDrawer: React.FC<MomentMoreInfoDrawerProps> = (props) => {
           },
           {
             text: 'Mark as abusive',
-            onPress: () => sendReport(momentId, 'Mark as abusive'),
+            onPress: () => sendReport(moment.moment_id, 'Mark as abusive'),
           },
         ],
         {cancelable: false},
@@ -104,42 +119,52 @@ const MomentMoreInfoDrawer: React.FC<MomentMoreInfoDrawerProps> = (props) => {
     }, 500);
   };
 
-  const [drawerButtons, setDrawerButtons] = useState<
-    [string, (event: GestureResponderEvent) => void, JSX.Element?][]
-  >([
-    isOwnProfile
-      ? [MomentDrawerOptions.DeleteMoment, handleDeleteMoment]
-      : [MomentDrawerOptions.ReportIssue, handleReportMoment],
-  ]);
+  const handleEditMoment = async () => {
+    setIsOpen(false);
+    navigation.navigate('CaptionScreen', {
+      screenType: screenType,
+      selectedTags: tags,
+      moment: moment,
+    });
+  };
 
   /*
    *  Update bottom drawer options to contain/not contain 'remove tag' option
    */
   useEffect(() => {
-    const setupBottomDrawer = () => {
-      const present = drawerButtons.findIndex(
-        (button) => button[0] === MomentDrawerOptions.RemoveTag,
-      );
-      /*
-       * If user is not tagged but button is present, remove button from bottom drawer
-       * If user is tagged but button is not present, add button to bottom drawer
-       */
-      if (momentTagId !== '' && present === -1) {
-        const localDrawerButtons = drawerButtons;
-        localDrawerButtons.push([
+    let newButtons: [
+      string,
+      (event: GestureResponderEvent) => void,
+      JSX.Element?,
+      TextStyle?,
+    ][] = [];
+    if (!isOwnProfile) {
+      newButtons.push([
+        MomentDrawerOptions.ReportIssue,
+        handleReportMoment,
+        undefined,
+        {color: 'red'},
+      ]);
+      // should we have the "delete moment" option?
+      if (momentTagId !== '') {
+        newButtons.push([
           MomentDrawerOptions.RemoveTag,
           handleRemoveTag,
+          undefined,
+          {color: 'red'},
         ]);
-        setDrawerButtons(localDrawerButtons);
-      } else if (momentTagId === '' && present !== -1) {
-        const filteredButtons = drawerButtons.filter(
-          (button) => button[0] !== MomentDrawerOptions.RemoveTag,
-        );
-        setDrawerButtons(filteredButtons);
       }
-    };
-    setupBottomDrawer();
-  }, [momentTagId]);
+    } else {
+      newButtons.push([
+        MomentDrawerOptions.DeleteMoment,
+        handleDeleteMoment,
+        undefined,
+        {color: 'red'},
+      ]);
+      newButtons.push([MomentDrawerOptions.EditMoment, handleEditMoment]);
+    }
+    setDrawerButtons(newButtons);
+  }, [tags, momentTagId]);
 
   return (
     <>
@@ -153,7 +178,6 @@ const MomentMoreInfoDrawer: React.FC<MomentMoreInfoDrawerProps> = (props) => {
       <GenericMoreInfoDrawer
         {...props}
         showIcons={false}
-        textColor={'red'}
         buttons={drawerButtons}
       />
     </>
diff --git a/src/components/profile/ProfileMoreInfoDrawer.tsx b/src/components/profile/ProfileMoreInfoDrawer.tsx
index ecc45211..656f81bb 100644
--- a/src/components/profile/ProfileMoreInfoDrawer.tsx
+++ b/src/components/profile/ProfileMoreInfoDrawer.tsx
@@ -55,12 +55,12 @@ const ProfileMoreInfoDrawer: React.FC<ProfileMoreInfoDrawerProps> = (props) => {
         <GenericMoreInfoDrawer
           {...props}
           showIcons={false}
-          textColor={'red'}
           buttons={[
             [
               (isBlocked ? 'Unblock' : 'Block') + ` ${userXName}`,
               onBlockUnblock,
               undefined,
+              {color: 'red'},
             ],
           ]}
         />
@@ -68,7 +68,6 @@ const ProfileMoreInfoDrawer: React.FC<ProfileMoreInfoDrawerProps> = (props) => {
         <GenericMoreInfoDrawer
           {...props}
           showIcons={true}
-          textColor={'black'}
           buttons={[
             [
               'Settings',
@@ -77,6 +76,7 @@ const ProfileMoreInfoDrawer: React.FC<ProfileMoreInfoDrawerProps> = (props) => {
                 source={require('../../assets/images/settings/settings.png')}
                 style={styles.image}
               />,
+              {color: 'black'},
             ],
             [
               'Edit Profile',
@@ -85,6 +85,7 @@ const ProfileMoreInfoDrawer: React.FC<ProfileMoreInfoDrawerProps> = (props) => {
                 source={require('../../assets/images/settings/edit-profile.png')}
                 style={styles.image}
               />,
+              {color: 'black'},
             ],
           ]}
         />