From 2603105fa10e4f5f8cfe032f4300befdbdfc1552 Mon Sep 17 00:00:00 2001 From: s-alves10 Date: Fri, 27 Oct 2023 03:05:18 -0500 Subject: [PATCH 1/3] fix: don't focus composer if emoji picker is opened --- .../{focusWithDelay.ts => focusComposerWithDelay.ts} | 11 ++++++----- .../ReportActionCompose/ComposerWithSuggestions.js | 4 ++-- src/pages/home/report/ReportActionItemMessageEdit.js | 4 ++-- 3 files changed, 10 insertions(+), 9 deletions(-) rename src/libs/{focusWithDelay.ts => focusComposerWithDelay.ts} (69%) diff --git a/src/libs/focusWithDelay.ts b/src/libs/focusComposerWithDelay.ts similarity index 69% rename from src/libs/focusWithDelay.ts rename to src/libs/focusComposerWithDelay.ts index 00d0e915879e..b00a149db905 100644 --- a/src/libs/focusWithDelay.ts +++ b/src/libs/focusComposerWithDelay.ts @@ -1,11 +1,12 @@ import {InteractionManager, TextInput} from 'react-native'; import ComposerFocusManager from './ComposerFocusManager'; +import * as EmojiPickerAction from './actions/EmojiPickerAction'; -type FocusWithDelay = (shouldDelay?: boolean) => void; +type FocusComposerWithDelay = (shouldDelay?: boolean) => void; /** - * Create a function that focuses a text input. + * Create a function that focuses the composer. */ -function focusWithDelay(textInput: TextInput | null): FocusWithDelay { +function focusComposerWithDelay(textInput: TextInput | null): FocusComposerWithDelay { /** * Focus the text input * @param [shouldDelay] Impose delay before focusing the text input @@ -14,7 +15,7 @@ function focusWithDelay(textInput: TextInput | null): FocusWithDelay { // There could be other animations running while we trigger manual focus. // This prevents focus from making those animations janky. InteractionManager.runAfterInteractions(() => { - if (!textInput) { + if (!textInput || EmojiPickerAction.isEmojiPickerVisible()) { return; } @@ -32,4 +33,4 @@ function focusWithDelay(textInput: TextInput | null): FocusWithDelay { }; } -export default focusWithDelay; +export default focusComposerWithDelay; diff --git a/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions.js b/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions.js index d62674eb6fda..b1dbf00332e5 100644 --- a/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions.js +++ b/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions.js @@ -32,7 +32,7 @@ import useLocalize from '../../../../hooks/useLocalize'; import compose from '../../../../libs/compose'; import withKeyboardState from '../../../../components/withKeyboardState'; import {propTypes, defaultProps} from './composerWithSuggestionsProps'; -import focusWithDelay from '../../../../libs/focusWithDelay'; +import focusComposerWithDelay from '../../../../libs/focusComposerWithDelay'; import useDebounce from '../../../../hooks/useDebounce'; import updateMultilineInputRange from '../../../../libs/UpdateMultilineInputRange'; import * as InputFocus from '../../../../libs/actions/InputFocus'; @@ -394,7 +394,7 @@ function ComposerWithSuggestions({ * @memberof ReportActionCompose */ const focus = useCallback((shouldDelay = false) => { - focusWithDelay(textInputRef.current)(shouldDelay); + focusComposerWithDelay(textInputRef.current)(shouldDelay); }, []); const setUpComposeFocusManager = useCallback(() => { diff --git a/src/pages/home/report/ReportActionItemMessageEdit.js b/src/pages/home/report/ReportActionItemMessageEdit.js index be2f10f2f053..fdf1e4a8c4d2 100644 --- a/src/pages/home/report/ReportActionItemMessageEdit.js +++ b/src/pages/home/report/ReportActionItemMessageEdit.js @@ -33,7 +33,7 @@ import useKeyboardState from '../../../hooks/useKeyboardState'; import useWindowDimensions from '../../../hooks/useWindowDimensions'; import useReportScrollManager from '../../../hooks/useReportScrollManager'; import * as EmojiPickerAction from '../../../libs/actions/EmojiPickerAction'; -import focusWithDelay from '../../../libs/focusWithDelay'; +import focusComposerWithDelay from '../../../libs/focusComposerWithDelay'; import * as Browser from '../../../libs/Browser'; import * as InputFocus from '../../../libs/actions/InputFocus'; import onyxSubscribe from '../../../libs/onyxSubscribe'; @@ -358,7 +358,7 @@ function ReportActionItemMessageEdit(props) { /** * Focus the composer text input */ - const focus = focusWithDelay(textInputRef.current); + const focus = focusComposerWithDelay(textInputRef.current); return ( <> From d0ea6f072bd4ed2e73134b1ac5d3bed1db9c7d25 Mon Sep 17 00:00:00 2001 From: s-alves10 Date: Fri, 27 Oct 2023 07:55:50 -0500 Subject: [PATCH 2/3] fix: remove redundant focusing --- src/pages/home/report/ReportActionItemMessageEdit.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/src/pages/home/report/ReportActionItemMessageEdit.js b/src/pages/home/report/ReportActionItemMessageEdit.js index fdf1e4a8c4d2..833dea5b69d6 100644 --- a/src/pages/home/report/ReportActionItemMessageEdit.js +++ b/src/pages/home/report/ReportActionItemMessageEdit.js @@ -432,10 +432,7 @@ function ReportActionItemMessageEdit(props) { { - setIsFocused(true); - focus(true); - }} + onModalHide={() => focus(true)} onEmojiSelected={addEmojiToTextBox} nativeID={emojiButtonID} emojiPickerID={props.action.reportActionID} From db3d93b0cd864c1db8b04fb65ae675f63c9a99f4 Mon Sep 17 00:00:00 2001 From: s-alves10 Date: Mon, 30 Oct 2023 04:15:15 -0500 Subject: [PATCH 3/3] fix: prettier --- src/libs/focusComposerWithDelay.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/libs/focusComposerWithDelay.ts b/src/libs/focusComposerWithDelay.ts index b00a149db905..94eb168328aa 100644 --- a/src/libs/focusComposerWithDelay.ts +++ b/src/libs/focusComposerWithDelay.ts @@ -1,6 +1,6 @@ import {InteractionManager, TextInput} from 'react-native'; -import ComposerFocusManager from './ComposerFocusManager'; import * as EmojiPickerAction from './actions/EmojiPickerAction'; +import ComposerFocusManager from './ComposerFocusManager'; type FocusComposerWithDelay = (shouldDelay?: boolean) => void; /**