diff --git a/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.js b/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.js index f4db994ad0cd..b379acf2a530 100755 --- a/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.js +++ b/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.js @@ -18,6 +18,9 @@ import ONYXKEYS from '../../../../ONYXKEYS'; const propTypes = { /** String representing the context menu type [LINK, REPORT_ACTION] which controls context menu choices */ type: PropTypes.string, + + /** Target node which is the target of ContentMenu */ + anchor: PropTypes.node, ...genericReportActionContextMenuPropTypes, ...withLocalizePropTypes, ...windowDimensionsPropTypes, @@ -25,6 +28,7 @@ const propTypes = { const defaultProps = { type: CONTEXT_MENU_TYPES.REPORT_ACTION, + anchor: null, ...GenericReportActionContextMenuDefaultProps, }; class BaseReportActionContextMenu extends React.Component { @@ -34,7 +38,7 @@ class BaseReportActionContextMenu extends React.Component { } render() { - const shouldShowFilter = contextAction => contextAction.shouldShow(this.props.type, this.props.reportAction, this.props.betas); + const shouldShowFilter = contextAction => contextAction.shouldShow(this.props.type, this.props.reportAction, this.props.betas, this.props.anchor); return this.props.isVisible && ( diff --git a/src/pages/home/report/ContextMenu/ContextMenuActions.js b/src/pages/home/report/ContextMenu/ContextMenuActions.js index 2823d7b31a89..29c43e37bcd5 100644 --- a/src/pages/home/report/ContextMenu/ContextMenuActions.js +++ b/src/pages/home/report/ContextMenu/ContextMenuActions.js @@ -90,7 +90,7 @@ export default [ successIcon: Expensicons.Checkmark, shouldShow: (type, reportAction) => (type === CONTEXT_MENU_TYPES.REPORT_ACTION && reportAction.actionName !== CONST.REPORT.ACTIONS.TYPE.IOU - && !ReportUtils.isReportMessageAttachment(lodashGet(reportAction, ['message', 0, 'text'], ''))), + && !ReportUtils.isReportMessageAttachment(_.last(lodashGet(reportAction, ['message'], [{}])))), // If return value is true, we switch the `text` and `icon` on // `ContextMenuItem` with `successText` and `successIcon` which will fallback to @@ -125,7 +125,13 @@ export default [ { textTranslateKey: 'reportActionContextMenu.copyLink', icon: Expensicons.LinkCopy, - shouldShow: (type, reportAction, betas) => Permissions.canUseCommentLinking(betas), + shouldShow: (type, reportAction, betas, menuTarget) => { + const isAttachment = ReportUtils.isReportMessageAttachment(_.last(lodashGet(reportAction, ['message'], [{}]))); + + // Only hide the copylink menu item when context menu is opened over img element. + const isAttachmentTarget = lodashGet(menuTarget, 'tagName') === 'IMG' && isAttachment; + return Permissions.canUseCommentLinking(betas) && type === CONTEXT_MENU_TYPES.REPORT_ACTION && !isAttachmentTarget; + }, onPress: (closePopover, {reportAction, reportID}) => { Environment.getEnvironmentURL() .then((environmentURL) => { diff --git a/src/pages/home/report/ContextMenu/PopoverReportActionContextMenu.js b/src/pages/home/report/ContextMenu/PopoverReportActionContextMenu.js index ef0449806415..b59ddf87ace6 100644 --- a/src/pages/home/report/ContextMenu/PopoverReportActionContextMenu.js +++ b/src/pages/home/report/ContextMenu/PopoverReportActionContextMenu.js @@ -124,6 +124,7 @@ class PopoverReportActionContextMenu extends React.Component { ) { const nativeEvent = event.nativeEvent || {}; this.contextMenuAnchor = contextMenuAnchor; + this.contextMenuTargetNode = nativeEvent.target; // Singleton behaviour of ContextMenu creates race conditions when user requests multiple contextMenus. // But it is possible that every new request registers new callbacks thus instanceID is used to corelate those callbacks @@ -222,6 +223,7 @@ class PopoverReportActionContextMenu extends React.Component { selection={this.state.selection} reportID={this.state.reportID} reportAction={this.state.reportAction} + anchor={this.contextMenuTargetNode} /> ); } @@ -293,6 +295,7 @@ class PopoverReportActionContextMenu extends React.Component { reportID={this.state.reportID} reportAction={this.state.reportAction} draftMessage={this.state.reportActionDraftMessage} + anchor={this.contextMenuTargetNode} />