diff --git a/src/components/DotIndicatorMessage.tsx b/src/components/DotIndicatorMessage.tsx index 98877386d74ed..360ec08cbe51c 100644 --- a/src/components/DotIndicatorMessage.tsx +++ b/src/components/DotIndicatorMessage.tsx @@ -7,9 +7,11 @@ import {View} from 'react-native'; import useConfirmModal from '@hooks/useConfirmModal'; import {useMemoizedLazyExpensifyIcons} from '@hooks/useLazyAsset'; import useLocalize from '@hooks/useLocalize'; +import useResponsiveLayout from '@hooks/useResponsiveLayout'; import useStyleUtils from '@hooks/useStyleUtils'; import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; +import {canUseTouchScreen} from '@libs/DeviceCapabilities'; import {isReceiptError, isTranslationKeyError} from '@libs/ErrorUtils'; import fileDownload from '@libs/fileDownload'; import handleRetryPress from '@libs/ReceiptUploadRetryHandler'; @@ -49,6 +51,7 @@ function DotIndicatorMessage({messages = {}, style, type, textStyles, dismissErr const StyleUtils = useStyleUtils(); const {translate} = useLocalize(); const expensifyIcons = useMemoizedLazyExpensifyIcons(['DotIndicator']); + const {shouldUseNarrowLayout} = useResponsiveLayout(); const {showConfirmModal} = useConfirmModal(); if (Object.keys(messages).length === 0) { @@ -83,6 +86,8 @@ function DotIndicatorMessage({messages = {}, style, type, textStyles, dismissErr } }; + const isTextSelectable = !canUseTouchScreen() || !shouldUseNarrowLayout; + const renderMessage = (message: string | ReceiptError | ReactElement, index: number) => { if (isReceiptError(message)) { return ( @@ -102,7 +107,7 @@ function DotIndicatorMessage({messages = {}, style, type, textStyles, dismissErr