diff --git a/src/components/PressableWithSecondaryInteraction/index.js b/src/components/PressableWithSecondaryInteraction/index.js index f3ea25a471fd..f90a09e06c4d 100644 --- a/src/components/PressableWithSecondaryInteraction/index.js +++ b/src/components/PressableWithSecondaryInteraction/index.js @@ -31,7 +31,7 @@ class PressableWithSecondaryInteraction extends Component { */ executeSecondaryInteractionOnContextMenu(e) { e.stopPropagation(); - if (this.props.preventDefaultContentMenu) { + if (this.props.preventDefaultContextMenu) { e.preventDefault(); } diff --git a/src/components/PressableWithSecondaryInteraction/pressableWithSecondaryInteractionPropTypes.js b/src/components/PressableWithSecondaryInteraction/pressableWithSecondaryInteractionPropTypes.js index bffe11bc4cd8..b9192bf0b2b2 100644 --- a/src/components/PressableWithSecondaryInteraction/pressableWithSecondaryInteractionPropTypes.js +++ b/src/components/PressableWithSecondaryInteraction/pressableWithSecondaryInteractionPropTypes.js @@ -20,7 +20,7 @@ const propTypes = { forwardedRef: PropTypes.func, /** Prevent the default ContextMenu on web/Desktop */ - preventDefaultContentMenu: PropTypes.bool, + preventDefaultContextMenu: PropTypes.bool, /** Use Text instead of Pressable to create inline layout. * It has few limitations in comparison to Pressable. @@ -40,7 +40,7 @@ const defaultProps = { forwardedRef: () => {}, onPressIn: () => {}, onPressOut: () => {}, - preventDefaultContentMenu: true, + preventDefaultContextMenu: true, inline: false, withoutFocusOnSecondaryInteraction: false, }; diff --git a/src/pages/home/report/ReportActionItem.js b/src/pages/home/report/ReportActionItem.js index 31bfb49bfbe5..a47ff6d4de4e 100644 --- a/src/pages/home/report/ReportActionItem.js +++ b/src/pages/home/report/ReportActionItem.js @@ -139,8 +139,8 @@ class ReportActionItem extends Component { * @param {Object} [event] - A press event. */ showPopover(event) { - // Block menu on the message being Edited - if (this.props.draftMessage) { + // Block menu on the message being Edited or if the report action item has errors + if (this.props.draftMessage || !_.isEmpty(this.props.action.errors)) { return; } @@ -255,6 +255,7 @@ class ReportActionItem extends Component { return ; } + const hasErrors = !_.isEmpty(this.props.action.errors); const whisperedTo = lodashGet(this.props.action, 'whisperedTo', []); const isWhisper = whisperedTo.length > 0; const isMultipleParticipant = whisperedTo.length > 1; @@ -268,7 +269,7 @@ class ReportActionItem extends Component { onPressIn={() => this.props.isSmallScreenWidth && DeviceCapabilities.canUseTouchScreen() && ControlSelection.block()} onPressOut={() => ControlSelection.unblock()} onSecondaryInteraction={this.showPopover} - preventDefaultContentMenu={!this.props.draftMessage} + preventDefaultContextMenu={!this.props.draftMessage && !hasErrors} withoutFocusOnSecondaryInteraction > @@ -343,6 +344,7 @@ class ReportActionItem extends Component { isVisible={ hovered && !this.props.draftMessage + && !hasErrors } draftMessage={this.props.draftMessage} isChronosReport={ReportUtils.chatIncludesChronos(this.props.report)}