Merge pull request #54187 from margelo/fix/set-focus-again-after-modal

fix: show keyboard again after modal has been dismissed

ios/Podfile.lock

@@ -1722,7 +1722,7 @@ PODS:
     - ReactCommon/turbomodule/bridging
     - ReactCommon/turbomodule/core
     - Yoga
-  - react-native-keyboard-controller (1.14.4):
+  - react-native-keyboard-controller (1.15.0):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -3242,7 +3242,7 @@ SPEC CHECKSUMS:
   react-native-geolocation: b9bd12beaf0ebca61a01514517ca8455bd26fa06
   react-native-image-picker: f8a13ff106bcc7eb00c71ce11fdc36aac2a44440
   react-native-key-command: aae312752fcdfaa2240be9a015fc41ce54087546
-  react-native-keyboard-controller: 97bb7b48fa427c7455afdc8870c2978efd9bfa3a
+  react-native-keyboard-controller: 3428e4761623fd6a242d9bf3573112f8ebe92238
   react-native-launch-arguments: 5f41e0abf88a15e3c5309b8875d6fd5ac43df49d
   react-native-netinfo: fb5112b1fa754975485884ae85a3fb6a684f49d5
   react-native-pager-view: abc5ef92699233eb726442c7f452cac82f73d0cb

package.json

@@ -154,7 +154,7 @@
     "react-native-image-picker": "^7.0.3",
     "react-native-image-size": "git+https://github.com/Expensify/react-native-image-size#cb392140db4953a283590d7cf93b4d0461baa2a9",
     "react-native-key-command": "^1.0.8",
-    "react-native-keyboard-controller": "1.14.4",
+    "react-native-keyboard-controller": "1.15.0",
     "react-native-launch-arguments": "^4.0.2",
     "react-native-localize": "^2.2.6",
     "react-native-modal": "^13.0.0",

src/components/KeyboardAvoidingView/index.android.tsx

@@ -2,8 +2,8 @@
  * The KeyboardAvoidingView is only used on ios
  */
 import React from 'react';
+import type {KeyboardAvoidingViewProps} from 'react-native-keyboard-controller';
 import {KeyboardAvoidingView as KeyboardAvoidingViewComponent} from 'react-native-keyboard-controller';
-import type {KeyboardAvoidingViewProps} from './types';
 
 function KeyboardAvoidingView(props: KeyboardAvoidingViewProps) {
     // eslint-disable-next-line react/jsx-props-no-spreading

src/hooks/useRestoreInputFocus.ts

@@ -0,0 +1,21 @@
+import {useEffect, useRef} from 'react';
+import {InteractionManager, Keyboard} from 'react-native';
+import {KeyboardController} from 'react-native-keyboard-controller';
+
+const useRestoreInputFocus = (isLostFocus: boolean) => {
+    const keyboardVisibleBeforeLoosingFocusRef = useRef(false);
+
+    useEffect(() => {
+        if (isLostFocus) {
+            keyboardVisibleBeforeLoosingFocusRef.current = Keyboard.isVisible();
+        }
+
+        if (!isLostFocus && keyboardVisibleBeforeLoosingFocusRef.current) {
+            InteractionManager.runAfterInteractions(() => {
+                KeyboardController.setFocusTo('current');
+            });
+        }
+    }, [isLostFocus]);
+};
+
+export default useRestoreInputFocus;

src/pages/home/report/ContextMenu/BaseReportActionContextMenu.tsx

@@ -16,6 +16,7 @@ import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
 import usePaginatedReportActions from '@hooks/usePaginatedReportActions';
 import useResponsiveLayout from '@hooks/useResponsiveLayout';
+import useRestoreInputFocus from '@hooks/useRestoreInputFocus';
 import useStyleUtils from '@hooks/useStyleUtils';
 import * as PolicyUtils from '@libs/PolicyUtils';
 import * as ReportActionsUtils from '@libs/ReportActionsUtils';
@@ -268,6 +269,7 @@ function BaseReportActionContextMenu({
         },
         {isActive: shouldEnableArrowNavigation && shouldEnableContextMenuEnterShortcut, shouldPreventDefault: false},
     );
+    useRestoreInputFocus(isVisible);
 
     const openOverflowMenu = (event: GestureResponderEvent | MouseEvent, anchorRef: MutableRefObject<View | null>) => {
         showContextMenu(