From 58918c09ecca8b3a77ed712e783d3ed5e3a3b08f Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Thu, 14 Sep 2023 16:31:25 +0800
Subject: [PATCH] ignore unselectable text from selection

---
 src/components/Button/index.js                             | 1 +
 src/components/CollapsibleSection/index.js                 | 1 +
 .../HTMLEngineProvider/HTMLRenderers/EditedRenderer.js     | 2 ++
 src/components/MenuItem.js                                 | 1 +
 src/components/MultipleAvatars.js                          | 2 ++
 src/components/NewDatePicker/CalendarPicker/index.js       | 7 ++++++-
 src/components/Pressable/GenericPressable/index.js         | 2 +-
 src/components/Reactions/AddReactionBubble.js              | 1 +
 src/components/Reactions/EmojiReactionBubble.js            | 6 ++++--
 src/components/Reactions/MiniQuickEmojiReactions.js        | 7 ++++++-
 src/components/SelectionList/BaseSelectionList.js          | 1 +
 src/components/SelectionList/RadioListItem.js              | 2 ++
 src/components/SelectionList/UserListItem.js               | 1 +
 src/components/TextInput/BaseTextInput.js                  | 1 +
 src/pages/home/report/FloatingMessageCounter/index.js      | 2 ++
 src/pages/home/report/ReportActionItemFragment.js          | 1 +
 src/pages/home/report/ReportActionItemThread.js            | 2 ++
 17 files changed, 35 insertions(+), 5 deletions(-)

diff --git a/src/components/Button/index.js b/src/components/Button/index.js
index bfde528a4750..c16860344837 100644
--- a/src/components/Button/index.js
+++ b/src/components/Button/index.js
@@ -218,6 +218,7 @@ class Button extends Component {
                     this.props.icon && styles.textAlignLeft,
                     ...this.props.textStyles,
                 ]}
+                dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
             >
                 {this.props.text}
             </Text>
diff --git a/src/components/CollapsibleSection/index.js b/src/components/CollapsibleSection/index.js
index e9c3a90a7b30..7009d1905e1d 100644
--- a/src/components/CollapsibleSection/index.js
+++ b/src/components/CollapsibleSection/index.js
@@ -51,6 +51,7 @@ class CollapsibleSection extends React.Component {
                     <Text
                         selectable={false}
                         style={[styles.flex1, styles.textStrong]}
+                        dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
                     >
                         {this.props.title}
                     </Text>
diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/EditedRenderer.js b/src/components/HTMLEngineProvider/HTMLRenderers/EditedRenderer.js
index d91510c3ec6a..262a4d1f178e 100644
--- a/src/components/HTMLEngineProvider/HTMLRenderers/EditedRenderer.js
+++ b/src/components/HTMLEngineProvider/HTMLRenderers/EditedRenderer.js
@@ -1,5 +1,6 @@
 import _ from 'underscore';
 import React from 'react';
+import CONST from '../../../CONST';
 import htmlRendererPropTypes from './htmlRendererPropTypes';
 import withLocalize, {withLocalizePropTypes} from '../../withLocalize';
 import Text from '../../Text';
@@ -28,6 +29,7 @@ function EditedRenderer(props) {
             <Text
                 selectable={false}
                 style={[styles.w1, styles.userSelectNone]}
+                dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
             >
                 {' '}
             </Text>
diff --git a/src/components/MenuItem.js b/src/components/MenuItem.js
index adf3fa0cdd80..1971608ccee4 100644
--- a/src/components/MenuItem.js
+++ b/src/components/MenuItem.js
@@ -225,6 +225,7 @@ const MenuItem = React.forwardRef((props, ref) => {
                                                 <Text
                                                     style={titleTextStyle}
                                                     numberOfLines={props.numberOfLinesTitle || undefined}
+                                                    dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: props.interactive && props.disabled}}
                                                 >
                                                     {convertToLTR(props.title)}
                                                 </Text>
diff --git a/src/components/MultipleAvatars.js b/src/components/MultipleAvatars.js
index 4c6ba1307fb7..916646b5619a 100644
--- a/src/components/MultipleAvatars.js
+++ b/src/components/MultipleAvatars.js
@@ -221,6 +221,7 @@ function MultipleAvatars(props) {
                                         <Text
                                             selectable={false}
                                             style={[styles.avatarInnerTextSmall, StyleUtils.getAvatarExtraFontSizeStyle(props.size)]}
+                                            dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
                                         >{`+${avatars.length - props.maxAvatarsInRow}`}</Text>
                                     </View>
                                 </View>
@@ -278,6 +279,7 @@ function MultipleAvatars(props) {
                                         <Text
                                             selectable={false}
                                             style={props.size === CONST.AVATAR_SIZE.SMALL ? styles.avatarInnerTextSmall : styles.avatarInnerText}
+                                            dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
                                         >
                                             {`+${props.icons.length - 1}`}
                                         </Text>
diff --git a/src/components/NewDatePicker/CalendarPicker/index.js b/src/components/NewDatePicker/CalendarPicker/index.js
index fe0c36d32e41..1e1ef3c3fad3 100644
--- a/src/components/NewDatePicker/CalendarPicker/index.js
+++ b/src/components/NewDatePicker/CalendarPicker/index.js
@@ -130,7 +130,10 @@ class CalendarPicker extends React.PureComponent {
 
         return (
             <View>
-                <View style={[styles.calendarHeader, styles.flexRow, styles.justifyContentBetween, styles.alignItemsCenter, styles.ph4, styles.pr1]}>
+                <View
+                    style={[styles.calendarHeader, styles.flexRow, styles.justifyContentBetween, styles.alignItemsCenter, styles.ph4, styles.pr1]}
+                    dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
+                >
                     <PressableWithFeedback
                         onPress={() => this.setState({isYearPickerVisible: true})}
                         style={[styles.alignItemsCenter, styles.flexRow, styles.flex1, styles.justifyContentStart]}
@@ -186,6 +189,7 @@ class CalendarPicker extends React.PureComponent {
                         <View
                             key={dayOfWeek}
                             style={[styles.calendarDayRoot, styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter]}
+                            dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
                         >
                             <Text style={styles.sidebarLinkTextBold}>{dayOfWeek[0]}</Text>
                         </View>
@@ -212,6 +216,7 @@ class CalendarPicker extends React.PureComponent {
                                     accessibilityLabel={day ? day.toString() : undefined}
                                     focusable={Boolean(day)}
                                     accessible={Boolean(day)}
+                                    dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
                                 >
                                     {({hovered, pressed}) => (
                                         <View
diff --git a/src/components/Pressable/GenericPressable/index.js b/src/components/Pressable/GenericPressable/index.js
index 65fca85bc324..774ac3ac5092 100644
--- a/src/components/Pressable/GenericPressable/index.js
+++ b/src/components/Pressable/GenericPressable/index.js
@@ -15,7 +15,7 @@ const WebGenericPressable = forwardRef((props, ref) => (
         aria-labelledby={props.accessibilityLabelledBy}
         aria-valuenow={props.accessibilityValue}
         nativeID={props.nativeID}
-        dataSet={{tag: 'pressable', ...(props.noDragArea && {dragArea: false})}}
+        dataSet={{tag: 'pressable', ...(props.noDragArea && {dragArea: false}), ...props.dataSet}}
     />
 ));
 
diff --git a/src/components/Reactions/AddReactionBubble.js b/src/components/Reactions/AddReactionBubble.js
index 922be96084d8..0315c63aabf1 100644
--- a/src/components/Reactions/AddReactionBubble.js
+++ b/src/components/Reactions/AddReactionBubble.js
@@ -94,6 +94,7 @@ function AddReactionBubble(props) {
                 accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON}
                 // disable dimming
                 pressDimmingValue={1}
+                dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
             >
                 {({hovered, pressed}) => (
                     <>
diff --git a/src/components/Reactions/EmojiReactionBubble.js b/src/components/Reactions/EmojiReactionBubble.js
index bb37735d6920..818bc8f33309 100644
--- a/src/components/Reactions/EmojiReactionBubble.js
+++ b/src/components/Reactions/EmojiReactionBubble.js
@@ -60,6 +60,7 @@ function EmojiReactionBubble(props) {
                 styles.emojiReactionBubble,
                 StyleUtils.getEmojiReactionBubbleStyle(hovered || pressed, props.hasUserReacted, props.isContextMenu),
                 props.shouldBlockReactions && styles.cursorDisabled,
+                styles.userSelectNone,
             ]}
             onPress={() => {
                 if (props.shouldBlockReactions) {
@@ -83,9 +84,10 @@ function EmojiReactionBubble(props) {
             }}
             accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON}
             accessibilityLabel={props.emojiCodes.join('')}
+            dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
         >
-            <Text style={[styles.emojiReactionBubbleText, styles.userSelectNone, StyleUtils.getEmojiReactionBubbleTextStyle(props.isContextMenu)]}>{props.emojiCodes.join('')}</Text>
-            {props.count > 0 && <Text style={[styles.reactionCounterText, styles.userSelectNone, StyleUtils.getEmojiReactionCounterTextStyle(props.hasUserReacted)]}>{props.count}</Text>}
+            <Text style={[styles.emojiReactionBubbleText, StyleUtils.getEmojiReactionBubbleTextStyle(props.isContextMenu)]}>{props.emojiCodes.join('')}</Text>
+            {props.count > 0 && <Text style={[styles.reactionCounterText, StyleUtils.getEmojiReactionCounterTextStyle(props.hasUserReacted)]}>{props.count}</Text>}
         </PressableWithSecondaryInteraction>
     );
 }
diff --git a/src/components/Reactions/MiniQuickEmojiReactions.js b/src/components/Reactions/MiniQuickEmojiReactions.js
index 82f83cb1e961..a22a2967cefe 100644
--- a/src/components/Reactions/MiniQuickEmojiReactions.js
+++ b/src/components/Reactions/MiniQuickEmojiReactions.js
@@ -80,7 +80,12 @@ function MiniQuickEmojiReactions(props) {
                     tooltipText={`:${EmojiUtils.getLocalizedEmojiName(emoji.name, props.preferredLocale)}:`}
                     onPress={Session.checkIfActionIsAllowed(() => props.onEmojiSelected(emoji, props.emojiReactions))}
                 >
-                    <Text style={[styles.miniQuickEmojiReactionText, styles.userSelectNone]}>{EmojiUtils.getPreferredEmojiCode(emoji, props.preferredSkinTone)}</Text>
+                    <Text
+                        style={[styles.miniQuickEmojiReactionText, styles.userSelectNone]}
+                        dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
+                    >
+                        {EmojiUtils.getPreferredEmojiCode(emoji, props.preferredSkinTone)}
+                    </Text>
                 </BaseMiniContextMenuItem>
             ))}
             <BaseMiniContextMenuItem
diff --git a/src/components/SelectionList/BaseSelectionList.js b/src/components/SelectionList/BaseSelectionList.js
index 2cf0d2d72695..c81f5d254273 100644
--- a/src/components/SelectionList/BaseSelectionList.js
+++ b/src/components/SelectionList/BaseSelectionList.js
@@ -347,6 +347,7 @@ function BaseSelectionList({
                                         accessibilityRole="button"
                                         accessibilityState={{checked: flattenedSections.allSelected}}
                                         disabled={flattenedSections.allOptions.length === flattenedSections.disabledOptionsIndexes.length}
+                                        dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
                                     >
                                         <Checkbox
                                             accessibilityLabel={translate('workspace.people.selectAll')}
diff --git a/src/components/SelectionList/RadioListItem.js b/src/components/SelectionList/RadioListItem.js
index 92e3e84b66c8..df022992e24a 100644
--- a/src/components/SelectionList/RadioListItem.js
+++ b/src/components/SelectionList/RadioListItem.js
@@ -1,5 +1,6 @@
 import React from 'react';
 import {View} from 'react-native';
+import CONST from '../../CONST';
 import PressableWithFeedback from '../Pressable/PressableWithFeedback';
 import styles from '../../styles/styles';
 import Text from '../Text';
@@ -18,6 +19,7 @@ function RadioListItem({item, isFocused = false, isDisabled = false, onSelectRow
             hoverDimmingValue={1}
             hoverStyle={styles.hoveredComponentBG}
             focusStyle={styles.hoveredComponentBG}
+            dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
         >
             <View style={[styles.flex1, styles.justifyContentBetween, styles.sidebarLinkInner, styles.optionRow, styles.userSelectNone, isFocused && styles.sidebarLinkActive]}>
                 <View style={[styles.flex1, styles.alignItemsStart]}>
diff --git a/src/components/SelectionList/UserListItem.js b/src/components/SelectionList/UserListItem.js
index dd90fc750510..49997dc8a80d 100644
--- a/src/components/SelectionList/UserListItem.js
+++ b/src/components/SelectionList/UserListItem.js
@@ -63,6 +63,7 @@ function UserListItem({item, isFocused = false, showTooltip, onSelectRow, onDism
                 hoverDimmingValue={1}
                 hoverStyle={styles.hoveredComponentBG}
                 focusStyle={styles.hoveredComponentBG}
+                dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
             >
                 <View
                     style={[
diff --git a/src/components/TextInput/BaseTextInput.js b/src/components/TextInput/BaseTextInput.js
index 19453be054d4..2ab99b13dddd 100644
--- a/src/components/TextInput/BaseTextInput.js
+++ b/src/components/TextInput/BaseTextInput.js
@@ -296,6 +296,7 @@ function BaseTextInput(props) {
                                         selectable={false}
                                         style={[styles.textInputPrefix, !hasLabel && styles.pv0]}
                                         onLayout={storePrefixLayoutDimensions}
+                                        dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
                                     >
                                         {props.prefixCharacter}
                                     </Text>
diff --git a/src/pages/home/report/FloatingMessageCounter/index.js b/src/pages/home/report/FloatingMessageCounter/index.js
index 73fe02df129b..721fac0a41af 100644
--- a/src/pages/home/report/FloatingMessageCounter/index.js
+++ b/src/pages/home/report/FloatingMessageCounter/index.js
@@ -1,6 +1,7 @@
 import React, {useEffect, useMemo, useCallback} from 'react';
 import {Animated, View} from 'react-native';
 import PropTypes from 'prop-types';
+import CONST from '../../../../CONST';
 import styles from '../../../../styles/styles';
 import Button from '../../../../components/Button';
 import Text from '../../../../components/Text';
@@ -75,6 +76,7 @@ function FloatingMessageCounter(props) {
                             <Text
                                 selectable={false}
                                 style={[styles.ml2, styles.buttonSmallText, styles.textWhite]}
+                                dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
                             >
                                 {translate('newMessages')}
                             </Text>
diff --git a/src/pages/home/report/ReportActionItemFragment.js b/src/pages/home/report/ReportActionItemFragment.js
index d768fcacd5b7..e9fd30f5b057 100644
--- a/src/pages/home/report/ReportActionItemFragment.js
+++ b/src/pages/home/report/ReportActionItemFragment.js
@@ -151,6 +151,7 @@ function ReportActionItemFragment(props) {
                             <Text
                                 selectable={false}
                                 style={[containsOnlyEmojis ? styles.onlyEmojisTextLineHeight : undefined, styles.w1, styles.userSelectNone]}
+                                dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
                             >
                                 {' '}
                             </Text>
diff --git a/src/pages/home/report/ReportActionItemThread.js b/src/pages/home/report/ReportActionItemThread.js
index ebd965e80daf..9c688911759e 100644
--- a/src/pages/home/report/ReportActionItemThread.js
+++ b/src/pages/home/report/ReportActionItemThread.js
@@ -62,6 +62,7 @@ function ReportActionItemThread(props) {
                         <Text
                             selectable={false}
                             style={[styles.link, styles.ml2, styles.h4, styles.noWrap]}
+                            dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
                         >
                             {`${numberOfRepliesText} ${replyText}`}
                         </Text>
@@ -69,6 +70,7 @@ function ReportActionItemThread(props) {
                             selectable={false}
                             numberOfLines={1}
                             style={[styles.ml2, styles.textMicroSupporting, styles.flex1]}
+                            dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
                         >
                             {timeStamp}
                         </Text>