From 611640c2accaaae526156bd8a2a881d5d1a61892 Mon Sep 17 00:00:00 2001
From: Akinwale Ariwodola <akinwale@gmail.com>
Date: Mon, 25 Sep 2023 13:49:51 +0100
Subject: [PATCH 1/2] prevent glitching when attempting to select text on the
 Scan tab

---
 src/pages/iou/ReceiptSelector/index.js | 35 ++++++++++++++++++--------
 src/styles/styles.js                   |  7 +++++-
 2 files changed, 30 insertions(+), 12 deletions(-)

diff --git a/src/pages/iou/ReceiptSelector/index.js b/src/pages/iou/ReceiptSelector/index.js
index a817195fe8a3..21a9e46aa50c 100644
--- a/src/pages/iou/ReceiptSelector/index.js
+++ b/src/pages/iou/ReceiptSelector/index.js
@@ -1,5 +1,5 @@
-import {View, Text, PixelRatio} from 'react-native';
-import React, {useContext, useState} from 'react';
+import {View, Text, PanResponder, PixelRatio} from 'react-native';
+import React, {useContext, useRef, useState} from 'react';
 import lodashGet from 'lodash/get';
 import _ from 'underscore';
 import PropTypes from 'prop-types';
@@ -130,6 +130,13 @@ function ReceiptSelector(props) {
         IOU.navigateToNextPage(iou, iouType, reportID, report, props.route.path);
     };
 
+    const panResponder = useRef(
+        PanResponder.create({
+            onMoveShouldSetPanResponder: () => true,
+            onPanResponderTerminationRequest: () => false,
+        })
+    ).current;
+
     return (
         <View style={[styles.uploadReceiptView(isSmallScreenWidth)]}>
             {!isDraggingOver ? (
@@ -144,15 +151,21 @@ function ReceiptSelector(props) {
                             height={CONST.RECEIPT.ICON_SIZE}
                         />
                     </View>
-                    <Text style={[styles.textReceiptUpload]}>{translate('receipt.upload')}</Text>
-                    <Text style={[styles.subTextReceiptUpload]}>
-                        {isSmallScreenWidth ? translate('receipt.chooseReceipt') : translate('receipt.dragReceiptBeforeEmail')}
-                        <CopyTextToClipboard
-                            text={CONST.EMAIL.RECEIPTS}
-                            textStyles={[styles.textBlue]}
-                        />
-                        {isSmallScreenWidth ? null : translate('receipt.dragReceiptAfterEmail')}
-                    </Text>
+                    <View
+                        style={styles.receiptViewTextContainer}
+                        // eslint-disable-next-line react/jsx-props-no-spreading
+                        {...panResponder.panHandlers}
+                    >
+                        <Text style={[styles.textReceiptUpload]}>{translate('receipt.upload')}</Text>
+                        <Text style={[styles.subTextReceiptUpload]}>
+                            {isSmallScreenWidth ? translate('receipt.chooseReceipt') : translate('receipt.dragReceiptBeforeEmail')}
+                            <CopyTextToClipboard
+                                text={CONST.EMAIL.RECEIPTS}
+                                textStyles={[styles.textBlue]}
+                            />
+                            {isSmallScreenWidth ? null : translate('receipt.dragReceiptAfterEmail')}
+                        </Text>
+                    </View>
                     <AttachmentPicker>
                         {({openPicker}) => (
                             <PressableWithFeedback
diff --git a/src/styles/styles.js b/src/styles/styles.js
index 9f73c294f7b4..178143ebdf7d 100644
--- a/src/styles/styles.js
+++ b/src/styles/styles.js
@@ -767,11 +767,16 @@ const styles = (theme) => ({
         marginRight: 20,
         justifyContent: 'center',
         alignItems: 'center',
-        padding: 40,
+        paddingVertical: 40,
         gap: 4,
         flex: 1,
     }),
 
+    receiptViewTextContainer: {
+        paddingHorizontal: 40,
+        ...sizing.w100,
+    },
+
     cameraView: {
         flex: 1,
         overflow: 'hidden',

From a35872e97a42969f857a995bfef3f6ba980a1316 Mon Sep 17 00:00:00 2001
From: Akinwale Ariwodola <akinwale@gmail.com>
Date: Mon, 25 Sep 2023 15:09:01 +0100
Subject: [PATCH 2/2] fix lint error

---
 src/pages/iou/ReceiptSelector/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/iou/ReceiptSelector/index.js b/src/pages/iou/ReceiptSelector/index.js
index 21a9e46aa50c..1748a745f8c8 100644
--- a/src/pages/iou/ReceiptSelector/index.js
+++ b/src/pages/iou/ReceiptSelector/index.js
@@ -134,7 +134,7 @@ function ReceiptSelector(props) {
         PanResponder.create({
             onMoveShouldSetPanResponder: () => true,
             onPanResponderTerminationRequest: () => false,
-        })
+        }),
     ).current;
 
     return (