From a74ad258874ceecbb0713c8c10880a50293aac72 Mon Sep 17 00:00:00 2001
From: Linh <vovanlinh29546@gmail.com>
Date: Fri, 16 May 2025 20:10:34 +0700
Subject: [PATCH] fix: the tooltip button is not functional on android

---
 .../createPressHandler/index.android.ts       | 14 ++++++++++
 .../createPressHandler/index.ts               |  9 +++++++
 .../createPressHandler/types.ts               |  6 +++++
 .../ProductTrainingContext/index.tsx          | 27 +++++--------------
 4 files changed, 36 insertions(+), 20 deletions(-)
 create mode 100644 src/components/ProductTrainingContext/createPressHandler/index.android.ts
 create mode 100644 src/components/ProductTrainingContext/createPressHandler/index.ts
 create mode 100644 src/components/ProductTrainingContext/createPressHandler/types.ts

diff --git a/src/components/ProductTrainingContext/createPressHandler/index.android.ts b/src/components/ProductTrainingContext/createPressHandler/index.android.ts
new file mode 100644
index 000000000000..1fd17cf02641
--- /dev/null
+++ b/src/components/ProductTrainingContext/createPressHandler/index.android.ts
@@ -0,0 +1,14 @@
+import type PressHandlerProps from './types';
+
+/**
+ * This is a workaround for a known issue on certain Samsung Android devices
+ * So, we use `onPressIn` for Android to ensure the button is pressable.
+ * This will be removed once the issue https://github.com/Expensify/App/issues/59953 is resolved.
+ */
+function createPressHandler(onPress?: () => void): PressHandlerProps {
+    return {
+        onPressIn: onPress,
+    };
+}
+
+export default createPressHandler;
diff --git a/src/components/ProductTrainingContext/createPressHandler/index.ts b/src/components/ProductTrainingContext/createPressHandler/index.ts
new file mode 100644
index 000000000000..4de60a9716fc
--- /dev/null
+++ b/src/components/ProductTrainingContext/createPressHandler/index.ts
@@ -0,0 +1,9 @@
+import type PressHandlerProps from './types';
+
+function createPressHandler(onPress?: () => void): PressHandlerProps {
+    return {
+        onPress,
+    };
+}
+
+export default createPressHandler;
diff --git a/src/components/ProductTrainingContext/createPressHandler/types.ts b/src/components/ProductTrainingContext/createPressHandler/types.ts
new file mode 100644
index 000000000000..90c464216c2a
--- /dev/null
+++ b/src/components/ProductTrainingContext/createPressHandler/types.ts
@@ -0,0 +1,6 @@
+import type {ButtonProps} from '@components/Button';
+import type PressableProps from '@components/Pressable/GenericPressable/types';
+
+type PressHandlerProps = Pick<PressableProps & ButtonProps, 'onPressIn' | 'onPress'>;
+
+export default PressHandlerProps;
diff --git a/src/components/ProductTrainingContext/index.tsx b/src/components/ProductTrainingContext/index.tsx
index 48a6cddf2c18..177d83f415a4 100644
--- a/src/components/ProductTrainingContext/index.tsx
+++ b/src/components/ProductTrainingContext/index.tsx
@@ -12,7 +12,6 @@ import useSidePanel from '@hooks/useSidePanel';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import {parseFSAttributes} from '@libs/Fullstory';
-import getPlatform from '@libs/getPlatform';
 import {hasCompletedGuidedSetupFlowSelector} from '@libs/onboardingSelectors';
 import {getActiveAdminWorkspaces, getActiveEmployeeWorkspaces} from '@libs/PolicyUtils';
 import isProductTrainingElementDismissed from '@libs/TooltipUtils';
@@ -21,6 +20,7 @@ import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type ChildrenProps from '@src/types/utils/ChildrenProps';
 import isLoadingOnyxValue from '@src/types/utils/isLoadingOnyxValue';
+import createPressHandler from './createPressHandler';
 import type {ProductTrainingTooltipName} from './TOOLTIPS';
 import TOOLTIPS from './TOOLTIPS';
 
@@ -295,26 +295,11 @@ const useProductTrainingContext = (tooltipName: ProductTrainingTooltipName, shou
                     </Text>
                     {!tooltip?.shouldRenderActionButtons && (
                         <PressableWithoutFeedback
-                            // On some Samsung devices, `onPress` is never triggered.
-                            // So, we use `onPressIn` for Android to ensure the button is pressable.
-                            onPressIn={
-                                getPlatform() === CONST.PLATFORM.ANDROID
-                                    ? () => {
-                                          hideTooltip(true);
-                                      }
-                                    : undefined
-                            }
-                            // For other platforms, we stick with `onPress`.
-                            onPress={
-                                getPlatform() !== CONST.PLATFORM.ANDROID
-                                    ? () => {
-                                          hideTooltip(true);
-                                      }
-                                    : undefined
-                            }
                             shouldUseAutoHitSlop
                             accessibilityLabel={translate('productTrainingTooltip.scanTestTooltip.noThanks')}
                             role={CONST.ROLE.BUTTON}
+                            // eslint-disable-next-line react/jsx-props-no-spreading
+                            {...createPressHandler(() => hideTooltip(true))}
                         >
                             <Icon
                                 src={Expensicons.Close}
@@ -331,12 +316,14 @@ const useProductTrainingContext = (tooltipName: ProductTrainingTooltipName, shou
                             success
                             text={translate('productTrainingTooltip.scanTestTooltip.tryItOut')}
                             style={[styles.flex1]}
-                            onPress={config.onConfirm}
+                            // eslint-disable-next-line react/jsx-props-no-spreading
+                            {...createPressHandler(config.onConfirm)}
                         />
                         <Button
                             text={translate('productTrainingTooltip.scanTestTooltip.noThanks')}
                             style={[styles.flex1]}
-                            onPress={config.onDismiss}
+                            // eslint-disable-next-line react/jsx-props-no-spreading
+                            {...createPressHandler(config.onDismiss)}
                         />
                     </View>
                 )}
