From bc927c592ab0c0f2d92f9c0acdd5faa8c628cc80 Mon Sep 17 00:00:00 2001 From: situchan Date: Wed, 22 Mar 2023 06:40:45 +0000 Subject: [PATCH 1/4] navigate to Search page after fully closing modal on keyboard shortcut --- src/components/Modal/BaseModal.js | 1 + .../Navigation/AppNavigator/AuthScreens.js | 6 ++--- src/libs/actions/Modal.js | 22 +++++++++++++++++-- 3 files changed, 23 insertions(+), 6 deletions(-) diff --git a/src/components/Modal/BaseModal.js b/src/components/Modal/BaseModal.js index a4b7ed90a8fe..3be5c1d7aa32 100644 --- a/src/components/Modal/BaseModal.js +++ b/src/components/Modal/BaseModal.js @@ -65,6 +65,7 @@ class BaseModal extends PureComponent { if (callHideCallback) { this.props.onModalHide(); } + Modal.onModalDidClose(); } render() { diff --git a/src/libs/Navigation/AppNavigator/AuthScreens.js b/src/libs/Navigation/AppNavigator/AuthScreens.js index 114d004623b2..b77aa0b2ba79 100644 --- a/src/libs/Navigation/AppNavigator/AuthScreens.js +++ b/src/libs/Navigation/AppNavigator/AuthScreens.js @@ -115,12 +115,10 @@ class AuthScreens extends React.Component { // the chat switcher, or new group chat // based on the key modifiers pressed and the operating system this.unsubscribeSearchShortcut = KeyboardShortcut.subscribe(searchShortcutConfig.shortcutKey, () => { - Modal.close(); - Navigation.navigate(ROUTES.SEARCH); + Modal.close(() => Navigation.navigate(ROUTES.SEARCH)); }, searchShortcutConfig.descriptionKey, searchShortcutConfig.modifiers, true); this.unsubscribeGroupShortcut = KeyboardShortcut.subscribe(groupShortcutConfig.shortcutKey, () => { - Modal.close(); - Navigation.navigate(ROUTES.NEW_GROUP); + Modal.close(() => Navigation.navigate(ROUTES.NEW_GROUP)); }, groupShortcutConfig.descriptionKey, groupShortcutConfig.modifiers, true); } diff --git a/src/libs/actions/Modal.js b/src/libs/actions/Modal.js index ebf4fd2999c3..ea4f9cc7d29c 100644 --- a/src/libs/actions/Modal.js +++ b/src/libs/actions/Modal.js @@ -2,6 +2,7 @@ import Onyx from 'react-native-onyx'; import ONYXKEYS from '../../ONYXKEYS'; let closeModal; +let onModalClose; /** * Allows other parts of the app to call modal close function @@ -12,11 +13,27 @@ function setCloseModal(onClose) { closeModal = onClose; } -function close() { - if (!closeModal) { return; } +/** + * Close modal in other parts of the app + * + * @param {Function} [onClose] + */ +function close(onClose) { + if (!closeModal) { + if (onClose) { onClose(); } + onModalClose = null; + return; + } + onModalClose = onClose; closeModal(); } +function onModalDidClose() { + if (!onModalClose) { return; } + onModalClose(); + onModalClose = null; +} + /** * Allows other parts of the app to know when a modal has been opened or closed * @@ -39,6 +56,7 @@ function willAlertModalBecomeVisible(isVisible) { export { setCloseModal, close, + onModalDidClose, setModalVisibility, willAlertModalBecomeVisible, }; From f995fd599bb747641f1ea7e4ae9eb4651c327547 Mon Sep 17 00:00:00 2001 From: situchan Date: Wed, 22 Mar 2023 14:41:07 +0000 Subject: [PATCH 2/4] prevent focus on composer while emoji picker open and navigating from shortcut --- src/components/EmojiPicker/EmojiPicker.js | 10 ++++++++-- src/libs/actions/Modal.js | 5 +++-- 2 files changed, 11 insertions(+), 4 deletions(-) diff --git a/src/components/EmojiPicker/EmojiPicker.js b/src/components/EmojiPicker/EmojiPicker.js index 1683f01a5c55..369365a8db84 100644 --- a/src/components/EmojiPicker/EmojiPicker.js +++ b/src/components/EmojiPicker/EmojiPicker.js @@ -78,13 +78,19 @@ class EmojiPicker extends React.Component { } } - hideEmojiPicker() { + /** + * Hide the emoji picker menu. + * + * @param {Boolean} isNavigating + */ + hideEmojiPicker(isNavigating) { + if (isNavigating) { this.onModalHide = () => {}; } this.emojiPopoverAnchor = null; this.setState({isEmojiPickerVisible: false}); } /** - * Show the ReportActionContextMenu modal popover. + * Show the emoji picker menu. * * @param {Function} [onModalHide=() => {}] - Run a callback when Modal hides. * @param {Function} [onEmojiSelected=() => {}] - Run a callback when Emoji selected. diff --git a/src/libs/actions/Modal.js b/src/libs/actions/Modal.js index ea4f9cc7d29c..ca9b536154eb 100644 --- a/src/libs/actions/Modal.js +++ b/src/libs/actions/Modal.js @@ -17,15 +17,16 @@ function setCloseModal(onClose) { * Close modal in other parts of the app * * @param {Function} [onClose] + * @param {Boolean} isNavigating */ -function close(onClose) { +function close(onClose, isNavigating = true) { if (!closeModal) { if (onClose) { onClose(); } onModalClose = null; return; } onModalClose = onClose; - closeModal(); + closeModal(isNavigating); } function onModalDidClose() { From e7a79eb089a9f741c1599bfc3312f885ecd437a9 Mon Sep 17 00:00:00 2001 From: situchan Date: Wed, 22 Mar 2023 16:19:19 +0000 Subject: [PATCH 3/4] update Modal close function description --- src/libs/actions/Modal.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/libs/actions/Modal.js b/src/libs/actions/Modal.js index ca9b536154eb..02b5ddfe3f4a 100644 --- a/src/libs/actions/Modal.js +++ b/src/libs/actions/Modal.js @@ -16,16 +16,17 @@ function setCloseModal(onClose) { /** * Close modal in other parts of the app * - * @param {Function} [onClose] + * @param {Function} [onModalHideCallback] * @param {Boolean} isNavigating */ -function close(onClose, isNavigating = true) { +function close(onModalHideCallback, isNavigating = true) { if (!closeModal) { - if (onClose) { onClose(); } + // If modal is already closed, no need to wait for modal close. So immediately call callback. + if (onModalHideCallback) { onModalHideCallback(); } onModalClose = null; return; } - onModalClose = onClose; + onModalClose = onModalHideCallback; closeModal(isNavigating); } From 3d958c13e7e8d2499c768152d8c556ba158baa39 Mon Sep 17 00:00:00 2001 From: situchan Date: Thu, 23 Mar 2023 19:24:38 +0000 Subject: [PATCH 4/4] rename onModalHideCallback to onModalCloseCallback --- src/libs/actions/Modal.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/libs/actions/Modal.js b/src/libs/actions/Modal.js index 02b5ddfe3f4a..466645e3742c 100644 --- a/src/libs/actions/Modal.js +++ b/src/libs/actions/Modal.js @@ -16,17 +16,17 @@ function setCloseModal(onClose) { /** * Close modal in other parts of the app * - * @param {Function} [onModalHideCallback] + * @param {Function} [onModalCloseCallback] * @param {Boolean} isNavigating */ -function close(onModalHideCallback, isNavigating = true) { +function close(onModalCloseCallback, isNavigating = true) { if (!closeModal) { // If modal is already closed, no need to wait for modal close. So immediately call callback. - if (onModalHideCallback) { onModalHideCallback(); } + if (onModalCloseCallback) { onModalCloseCallback(); } onModalClose = null; return; } - onModalClose = onModalHideCallback; + onModalClose = onModalCloseCallback; closeModal(isNavigating); }