Merge pull request #49764 from Krishna2323/krishna2323/issue/49483

fix: Web - Debug - RHP tabs can be swiped.
Expensify · Sep 30, 2024 · 42c439e · 42c439e
2 parents 91624ac + 5687cfe
commit 42c439e
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 1 deletion.
diff --git a/src/pages/Debug/DebugDetails.tsx b/src/pages/Debug/DebugDetails.tsx
@@ -158,6 +158,7 @@ function DebugDetails({data, onSave, onDelete, validate}: DebugDetailsProps) {
                                 multiline={numberOfLines > 1}
                                 defaultValue={value}
                                 disabled={DETAILS_DISABLED_KEYS.includes(key as DetailsDisabledKeys)}
+                                shouldInterceptSwipe
                             />
                         );
                     })}
@@ -175,6 +176,7 @@ function DebugDetails({data, onSave, onDelete, validate}: DebugDetailsProps) {
                             label={key}
                             defaultValue={String(value)}
                             disabled={DETAILS_DISABLED_KEYS.includes(key as DetailsDisabledKeys)}
+                            shouldInterceptSwipe
                         />
                     ))}
                     {numberFields.length === 0 && <Text style={[styles.textNormalThemeText, styles.ph5]}>None</Text>}

diff --git a/src/pages/Debug/DebugJSON.tsx b/src/pages/Debug/DebugJSON.tsx
@@ -1,7 +1,9 @@
 import React, {useMemo} from 'react';
+import {View} from 'react-native';
 import Button from '@components/Button';
 import * as Expensicons from '@components/Icon/Expensicons';
 import ScrollView from '@components/ScrollView';
+import SwipeInterceptPanResponder from '@components/SwipeInterceptPanResponder';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
@@ -35,7 +37,12 @@ function DebugJSON({data}: DebugJSONProps) {
                 }}
                 icon={Expensicons.Copy}
             />
-            <Text style={[styles.textLabel, styles.mb5, styles.border, styles.p2]}>{json}</Text>
+            <View
+                // eslint-disable-next-line react/jsx-props-no-spreading
+                {...SwipeInterceptPanResponder.panHandlers}
+            >
+                <Text style={[styles.textLabel, styles.mb5, styles.border, styles.p2]}>{json}</Text>
+            </View>
         </ScrollView>
     );
 }