diff --git a/src/hooks/useResetComposerFocus.ts b/src/hooks/useResetComposerFocus.ts index 8bf0d32a92ae..accd4f8ad577 100644 --- a/src/hooks/useResetComposerFocus.ts +++ b/src/hooks/useResetComposerFocus.ts @@ -1,8 +1,8 @@ import {useIsFocused} from '@react-navigation/native'; import type {MutableRefObject} from 'react'; import {useEffect, useRef} from 'react'; -import {InteractionManager} from 'react-native'; import type {TextInput} from 'react-native'; +import inputFocusResetHandler from '@libs/InputFocusResetHandler'; export default function useResetComposerFocus(inputRef: MutableRefObject) { const isFocused = useIsFocused(); @@ -12,13 +12,8 @@ export default function useResetComposerFocus(inputRef: MutableRefObject { - inputRef.current?.focus(); // focus input again - shouldResetFocusRef.current = false; - }); - return () => { - interactionTask.cancel(); - }; + + inputFocusResetHandler.handleInputFocusReset(inputRef, shouldResetFocusRef); }, [isFocused, inputRef]); return {isFocused, shouldResetFocusRef}; diff --git a/src/libs/InputFocusResetHandler/index.ios.ts b/src/libs/InputFocusResetHandler/index.ios.ts new file mode 100644 index 000000000000..984382a13df2 --- /dev/null +++ b/src/libs/InputFocusResetHandler/index.ios.ts @@ -0,0 +1,18 @@ +import {InteractionManager} from 'react-native'; +import type InputFocusResetHandler from './types'; + +const inputFocusResetHandler: InputFocusResetHandler = { + handleInputFocusReset: (inputRef, shouldResetFocusRef) => { + if (!inputRef.current || !shouldResetFocusRef.current) { + return; + } + + InteractionManager.runAfterInteractions(() => { + inputRef?.current?.focus(); + const resetFocusRef = shouldResetFocusRef; + resetFocusRef.current = false; + }); + }, +}; + +export default inputFocusResetHandler; diff --git a/src/libs/InputFocusResetHandler/index.ts b/src/libs/InputFocusResetHandler/index.ts new file mode 100644 index 000000000000..9eed0cbd58a7 --- /dev/null +++ b/src/libs/InputFocusResetHandler/index.ts @@ -0,0 +1,15 @@ +import type InputFocusResetHandler from './types'; + +const inputFocusResetHandler: InputFocusResetHandler = { + handleInputFocusReset: (inputRef, shouldResetFocusRef) => { + if (!inputRef.current || !shouldResetFocusRef.current) { + return; + } + + inputRef?.current?.focus(); + const resetFocusRef = shouldResetFocusRef; + resetFocusRef.current = false; + }, +}; + +export default inputFocusResetHandler; diff --git a/src/libs/InputFocusResetHandler/types.ts b/src/libs/InputFocusResetHandler/types.ts new file mode 100644 index 000000000000..263f2d86e860 --- /dev/null +++ b/src/libs/InputFocusResetHandler/types.ts @@ -0,0 +1,8 @@ +import type {MutableRefObject} from 'react'; +import type {TextInput} from 'react-native'; + +type InputFocusResetHandler = { + handleInputFocusReset: (inputRef: MutableRefObject, shouldResetFocusRef: React.MutableRefObject) => void; +}; + +export default InputFocusResetHandler;