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)}