diff --git a/src/components/MenuItem.js b/src/components/MenuItem.js index c8dc826a316c..85101babf5cb 100644 --- a/src/components/MenuItem.js +++ b/src/components/MenuItem.js @@ -65,7 +65,7 @@ const MenuItem = (props) => { const descriptionTextStyle = StyleUtils.combineStyles([ styles.textLabelSupporting, (props.icon ? styles.ml3 : undefined), - styles.breakAll, + styles.breakWord, styles.lineHeightNormal, props.title ? descriptionVerticalMargin : undefined, ]); @@ -87,7 +87,6 @@ const MenuItem = (props) => { props.style, StyleUtils.getButtonBackgroundColorStyle(getButtonState(props.focused || hovered, pressed, props.success, props.disabled, props.interactive), true), ..._.isArray(props.wrapperStyle) ? props.wrapperStyle : [props.wrapperStyle], - styles.popoverMaxWidth, ])} disabled={props.disabled} > diff --git a/src/pages/home/report/ContextMenu/ContextMenuActions.js b/src/pages/home/report/ContextMenu/ContextMenuActions.js index b4ad16ce1bf7..385fee477f7b 100644 --- a/src/pages/home/report/ContextMenu/ContextMenuActions.js +++ b/src/pages/home/report/ContextMenu/ContextMenuActions.js @@ -14,6 +14,7 @@ import CONST from '../../../../CONST'; import getAttachmentDetails from '../../../../libs/fileDownload/getAttachmentDetails'; import fileDownload from '../../../../libs/fileDownload'; import addEncryptedAuthTokenToURL from '../../../../libs/addEncryptedAuthTokenToURL'; +import * as ContextMenuUtils from './ContextMenuUtils'; import * as Environment from '../../../../libs/Environment/Environment'; import Permissions from '../../../../libs/Permissions'; import QuickEmojiReactions from '../../../../components/Reactions/QuickEmojiReactions'; @@ -118,7 +119,7 @@ export default [ Clipboard.setString(selection); hideContextMenu(true, ReportActionComposeFocusManager.focus); }, - getDescription: selection => selection, + getDescription: ContextMenuUtils.getPopoverDescription, }, { textTranslateKey: 'reportActionContextMenu.copyEmailToClipboard', diff --git a/src/pages/home/report/ContextMenu/ContextMenuUtils/index.js b/src/pages/home/report/ContextMenu/ContextMenuUtils/index.js new file mode 100644 index 000000000000..f694f413e29a --- /dev/null +++ b/src/pages/home/report/ContextMenu/ContextMenuUtils/index.js @@ -0,0 +1,17 @@ +/* eslint-disable import/prefer-default-export */ + +/** + * The popover description will be an empty string on anything but mobile web + * because we show link in tooltip instead of popover on web + * + * @param {String} selection + * @param {Boolean} isSmallScreenWidth + * @returns {String} + */ +function getPopoverDescription(selection, isSmallScreenWidth) { + return isSmallScreenWidth ? selection : ''; +} + +export { + getPopoverDescription, +}; diff --git a/src/pages/home/report/ContextMenu/ContextMenuUtils/index.native.js b/src/pages/home/report/ContextMenu/ContextMenuUtils/index.native.js new file mode 100644 index 000000000000..3dbf81926098 --- /dev/null +++ b/src/pages/home/report/ContextMenu/ContextMenuUtils/index.native.js @@ -0,0 +1,15 @@ +/* eslint-disable import/prefer-default-export */ + +/** + * Always show popover description on native platforms + * + * @param {String} selection + * @returns {String} + */ +function getPopoverDescription(selection) { + return selection; +} + +export { + getPopoverDescription, +}; diff --git a/src/styles/styles.js b/src/styles/styles.js index 1f6063f034df..1c7d8656f911 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -3141,10 +3141,6 @@ const styles = { whisper: { backgroundColor: themeColors.cardBG, }, - - popoverMaxWidth: { - maxWidth: 375, - }, }; export default styles;