From 5687cfe4e4197e650c317f57bf2676a3e732f119 Mon Sep 17 00:00:00 2001
From: krishna2323 <belivethatkg@gmail.com>
Date: Thu, 26 Sep 2024 07:07:06 +0530
Subject: [PATCH] fix: Web - Debug - RHP tabs can be swiped.

Signed-off-by: krishna2323 <belivethatkg@gmail.com>
---
 src/pages/Debug/DebugDetails.tsx | 2 ++
 src/pages/Debug/DebugJSON.tsx    | 9 ++++++++-
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/pages/Debug/DebugDetails.tsx b/src/pages/Debug/DebugDetails.tsx
index 28bcb4e0df8b..430bbb0cfeae 100644
--- 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
index 14e1da9e029c..6da1296464eb 100644
--- 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>
     );
 }