moved delete confirmation modal out of comment body

src/components/comment/view/commentView.tsx

@@ -16,7 +16,6 @@ import { TextWithIcon } from '../../basicUIElements';
 // Styles
 import styles from './commentStyles';
 import { useAppSelector } from '../../../hooks';
-import { OptionsModal } from '../../atoms';
 import { showReplyModal } from '../../../redux/actions/uiAction';
 import { PostTypes } from '../../../constants/postTypes';
 import { UpvoteButton } from '../../postCard/children/upvoteButton';
@@ -43,7 +42,6 @@ const CommentView = ({
 }) => {
   const intl = useIntl();
   const dispatch = useDispatch();
-  const actionSheet = useRef(null);
 
   const currentAccount = useAppSelector((state) => state.account.currentAccount);
   const isLoggedIn = useAppSelector((state) => state.application.isLoggedIn);
@@ -171,29 +169,14 @@ const CommentView = ({
               iconType="MaterialIcons"
             />
             {!childCount && !activeVotes.length && comment.isDeletable && (
-              <Fragment>
                 <IconButton
                   size={20}
                   iconStyle={styles.leftIcon}
                   style={styles.leftButton}
                   name="delete-forever"
-                  onPress={() => actionSheet.current.show()}
+                  onPress={() => handleDeleteComment(comment.permlink)}
                   iconType="MaterialIcons"
                 />
-                <OptionsModal
-                  ref={actionSheet}
-                  options={[
-                    intl.formatMessage({ id: 'alert.delete' }),
-                    intl.formatMessage({ id: 'alert.cancel' }),
-                  ]}
-                  title={intl.formatMessage({ id: 'alert.delete' })}
-                  destructiveButtonIndex={0}
-                  cancelButtonIndex={1}
-                  onPress={(index) => {
-                    index === 0 ? handleDeleteComment(comment.permlink) : null;
-                  }}
-                />
-              </Fragment>
             )}
           </Fragment>
         )}

src/components/postComments/container/postComments.tsx

@@ -224,18 +224,38 @@ const PostComments = forwardRef(
     };
 
     const _handleDeleteComment = (_permlink) => {
-      deleteComment(currentAccount, pinHash, _permlink).then(() => {
-        // remove cached entry based on parent
-        const _commentPath = `${currentAccount.username}/${_permlink}`;
-        console.log('deleted comment', _commentPath);
 
-        const _deletedItem = discussionQuery.data[_commentPath];
-        if (_deletedItem) {
-          _deletedItem.status = CacheStatus.DELETED;
-          delete _deletedItem.updated;
-          dispatch(updateCommentCache(_commentPath, _deletedItem, { isUpdate: true }));
+      const _onConfirmDelete = async () => {
+        try {
+          await deleteComment(currentAccount, pinHash, _permlink);
+             // remove cached entry based on parent
+             const _commentPath = `${currentAccount.username}/${_permlink}`;
+             console.log('deleted comment', _commentPath);
+     
+             const _deletedItem = discussionQuery.data[_commentPath];
+             if (_deletedItem) {
+               _deletedItem.status = CacheStatus.DELETED;
+               delete _deletedItem.updated;
+               dispatch(updateCommentCache(_commentPath, _deletedItem, { isUpdate: true }));
+             }
+        } catch(err){
+          console.warn('Failed to delete comment')
         }
-      });
+        
+      }
+
+      dispatch(showActionModal({
+        title:intl.formatMessage({id:'delete.confirm_delete_title'}),
+        buttons:[{
+          text: intl.formatMessage({ id: 'alert.cancel' }),
+          onPress:()=>{console.log("canceled delete comment")}
+        },{
+          text:intl.formatMessage({ id: 'alert.delete' }),
+          onPress:_onConfirmDelete
+        }]
+      }))
+
+
     };
 
     const _openReplyThread = (comment) => {