From 9ccb8bfd60d50f77c676bc9f79c3fe5f485dfad8 Mon Sep 17 00:00:00 2001
From: shahid <shahidmuffakir@gmail.com>
Date: Sat, 11 Jan 2025 06:44:27 +0530
Subject: [PATCH] Hide keyboard when user clicks on three-dot menue,  use
 blurActiveElement for web and KeyboardUtils.dismiss for native

---
 .../Profile/Contacts/ContactMethodDetailsPage.tsx    | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/pages/settings/Profile/Contacts/ContactMethodDetailsPage.tsx b/src/pages/settings/Profile/Contacts/ContactMethodDetailsPage.tsx
index 69d0bbaa3ad2..db2ba9c01ec7 100644
--- a/src/pages/settings/Profile/Contacts/ContactMethodDetailsPage.tsx
+++ b/src/pages/settings/Profile/Contacts/ContactMethodDetailsPage.tsx
@@ -1,6 +1,6 @@
 import {Str} from 'expensify-common';
 import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
-import {InteractionManager, Keyboard, Platform} from 'react-native';
+import {InteractionManager, Keyboard} from 'react-native';
 import {useOnyx} from 'react-native-onyx';
 import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView';
 import ConfirmModal from '@components/ConfirmModal';
@@ -33,6 +33,7 @@ import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
 import isLoadingOnyxValue from '@src/types/utils/isLoadingOnyxValue';
+import KeyboardUtils from '@src/utils/keyboard';
 import type {ValidateCodeFormHandle} from './ValidateCodeForm/BaseValidateCodeForm';
 
 type ContactMethodDetailsPageProps = PlatformStackScreenProps<SettingsNavigatorParamList, typeof SCREENS.SETTINGS.PROFILE.CONTACT_METHOD_DETAILS>;
@@ -279,11 +280,10 @@ function ContactMethodDetailsPage({route}: ContactMethodDetailsPageProps) {
                     descriptionPrimary={translate('contacts.enterMagicCode', {contactMethod: formattedContactMethod})}
                     shouldShowThreeDotsButton={isValidateCodeActionModalVisible}
                     onThreeDotsButtonPress={() => {
-                        if (Platform.OS === 'web') {
-                            blurActiveElement();
-                        } else {
-                            Keyboard.dismiss();
-                        }
+                        // Hide the keyboard when the user clicks the three-dot menu.
+                        // Use blurActiveElement() for mWeb and KeyboardUtils.dismiss() for native apps.
+                        blurActiveElement();
+                        KeyboardUtils.dismiss();
                     }}
                     threeDotsMenuItems={[
                         {