From 51a99e58d50e59c85e2e15eece47bf67bccb9734 Mon Sep 17 00:00:00 2001
From: "Sahil (via MelvinBot)" <infra+melvinbot@expensify.com>
Date: Tue, 24 Mar 2026 19:00:32 +0000
Subject: [PATCH 1/2] Add text selection support to error messages in chat on
 desktop web

Error messages rendered via DotIndicatorMessage inherit user-select: none
from the parent PressableWithSecondaryInteraction. Add conditional
userSelectText styling following the same pattern used by
TextCommentFragment, so error messages are selectable on desktop web
while keeping touch behavior unchanged.

Co-authored-by: Sahil <thesahindia@users.noreply.github.com>
---
 src/components/DotIndicatorMessage.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/DotIndicatorMessage.tsx b/src/components/DotIndicatorMessage.tsx
index 98877386d74ed..bbcc1f0bd8297 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) {
@@ -102,7 +105,7 @@ function DotIndicatorMessage({messages = {}, style, type, textStyles, dismissErr
             <Text
                 // eslint-disable-next-line react/no-array-index-key
                 key={index}
-                style={[StyleUtils.getDotIndicatorTextStyles(isErrorMessage), textStyles]}
+                style={[StyleUtils.getDotIndicatorTextStyles(isErrorMessage), textStyles, !canUseTouchScreen() || !shouldUseNarrowLayout ? styles.userSelectText : styles.userSelectNone]}
                 accessibilityRole={isErrorMessage ? CONST.ROLE.ALERT : undefined}
                 accessibilityLiveRegion={isErrorMessage ? 'assertive' : undefined}
             >

From 9d3878f20ba2b2f0991615bb746391fcc0846741 Mon Sep 17 00:00:00 2001
From: "Sahil (via MelvinBot)" <infra+melvinbot@expensify.com>
Date: Thu, 26 Mar 2026 02:22:43 +0000
Subject: [PATCH 2/2] Extract text selectability condition into a variable for
 readability

Co-authored-by: Sahil <thesahindia@users.noreply.github.com>
---
 src/components/DotIndicatorMessage.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/DotIndicatorMessage.tsx b/src/components/DotIndicatorMessage.tsx
index bbcc1f0bd8297..360ec08cbe51c 100644
--- a/src/components/DotIndicatorMessage.tsx
+++ b/src/components/DotIndicatorMessage.tsx
@@ -86,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 (
@@ -105,7 +107,7 @@ function DotIndicatorMessage({messages = {}, style, type, textStyles, dismissErr
             <Text
                 // eslint-disable-next-line react/no-array-index-key
                 key={index}
-                style={[StyleUtils.getDotIndicatorTextStyles(isErrorMessage), textStyles, !canUseTouchScreen() || !shouldUseNarrowLayout ? styles.userSelectText : styles.userSelectNone]}
+                style={[StyleUtils.getDotIndicatorTextStyles(isErrorMessage), textStyles, isTextSelectable ? styles.userSelectText : styles.userSelectNone]}
                 accessibilityRole={isErrorMessage ? CONST.ROLE.ALERT : undefined}
                 accessibilityLiveRegion={isErrorMessage ? 'assertive' : undefined}
             >