From f3312e16681c4090d2312cc18ce654264865e296 Mon Sep 17 00:00:00 2001 From: Andrew Rosiclair Date: Thu, 22 Aug 2024 16:17:59 -0400 Subject: [PATCH] Revert "Merge pull request #47341 from software-mansion-labs/@zfurtak/fix-popoverMenu" This reverts commit 715e167258c6cee065383b515bcb5d68e7f4704f, reversing changes made to c9954ad33543c7e98807a8ea0b1e131402a7c7df. --- src/components/AttachmentModal.tsx | 1 - src/components/AvatarWithImagePicker.tsx | 38 +++++++++---------- .../ButtonWithDropdownMenu/index.tsx | 4 +- src/components/PopoverMenu.tsx | 11 ------ .../Navigation/AppNavigator/AuthScreens.tsx | 6 +-- src/libs/actions/Modal.ts | 6 +-- .../AttachmentPickerWithMenuItems.tsx | 15 ++++---- .../request/step/IOURequestStepWaypoint.tsx | 8 ++-- src/pages/workspace/WorkspacesListPage.tsx | 13 ++++--- .../accounting/PolicyAccountingPage.tsx | 7 ++-- 10 files changed, 47 insertions(+), 62 deletions(-) diff --git a/src/components/AttachmentModal.tsx b/src/components/AttachmentModal.tsx index 28f44aabb068..782a7c2becac 100644 --- a/src/components/AttachmentModal.tsx +++ b/src/components/AttachmentModal.tsx @@ -435,7 +435,6 @@ function AttachmentModal({ onSelected: () => { setIsDeleteReceiptConfirmModalVisible(true); }, - shouldCallAfterModalHide: true, }); } return menuItems; diff --git a/src/components/AvatarWithImagePicker.tsx b/src/components/AvatarWithImagePicker.tsx index 8a018101b63e..a1b8524dd293 100644 --- a/src/components/AvatarWithImagePicker.tsx +++ b/src/components/AvatarWithImagePicker.tsx @@ -11,6 +11,7 @@ import * as FileUtils from '@libs/fileDownload/FileUtils'; import getImageResolution from '@libs/fileDownload/getImageResolution'; import type {AvatarSource} from '@libs/UserUtils'; import variables from '@styles/variables'; +import * as Modal from '@userActions/Modal'; import CONST from '@src/CONST'; import type {TranslationPaths} from '@src/languages/types'; import type * as OnyxCommon from '@src/types/onyx/OnyxCommon'; @@ -43,7 +44,6 @@ type MenuItem = { icon: IconAsset; text: string; onSelected: () => void; - shouldCallAfterModalHide?: boolean; }; type AvatarWithImagePickerProps = { @@ -260,19 +260,19 @@ function AvatarWithImagePicker({ * Create menu items list for avatar menu */ const createMenuItems = (openPicker: OpenPicker): MenuItem[] => { - const menuItems: MenuItem[] = [ + const menuItems = [ { icon: Expensicons.Upload, text: translate('avatarWithImagePicker.uploadPhoto'), - onSelected: () => { - if (Browser.isSafari()) { - return; - } - openPicker({ - onPicked: showAvatarCropModal, - }); - }, - shouldCallAfterModalHide: true, + onSelected: () => + Modal.close(() => { + if (Browser.isSafari()) { + return; + } + openPicker({ + onPicked: showAvatarCropModal, + }); + }), }, ]; @@ -344,14 +344,14 @@ function AvatarWithImagePicker({ menuItems.push({ icon: Expensicons.Eye, text: translate('avatarWithImagePicker.viewPhoto'), - onSelected: () => { - if (typeof onViewPhotoPress !== 'function') { - show(); - return; - } - onViewPhotoPress(); - }, - shouldCallAfterModalHide: true, + onSelected: () => + Modal.close(() => { + if (typeof onViewPhotoPress !== 'function') { + show(); + return; + } + onViewPhotoPress(); + }), }); } diff --git a/src/components/ButtonWithDropdownMenu/index.tsx b/src/components/ButtonWithDropdownMenu/index.tsx index 74b38f515a06..943d6dbb5c16 100644 --- a/src/components/ButtonWithDropdownMenu/index.tsx +++ b/src/components/ButtonWithDropdownMenu/index.tsx @@ -11,6 +11,7 @@ import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import mergeRefs from '@libs/mergeRefs'; +import * as Modal from '@userActions/Modal'; import CONST from '@src/CONST'; import type {AnchorPosition} from '@src/styles'; import type {ButtonWithDropdownMenuProps} from './types'; @@ -177,12 +178,11 @@ function ButtonWithDropdownMenu({ menuItems={options.map((item, index) => ({ ...item, onSelected: item.onSelected - ? () => item.onSelected?.() + ? () => Modal.close(() => item.onSelected?.()) : () => { onOptionSelected?.(item); setSelectedItemIndex(index); }, - shouldCallAfterModalHide: true, }))} /> )} diff --git a/src/components/PopoverMenu.tsx b/src/components/PopoverMenu.tsx index a1ea786cc90d..0846e27100da 100644 --- a/src/components/PopoverMenu.tsx +++ b/src/components/PopoverMenu.tsx @@ -8,7 +8,6 @@ import useKeyboardShortcut from '@hooks/useKeyboardShortcut'; import useResponsiveLayout from '@hooks/useResponsiveLayout'; import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; -import * as Modal from '@userActions/Modal'; import CONST from '@src/CONST'; import type {AnchorPosition} from '@src/styles'; import type AnchorAlignment from '@src/types/utils/AnchorAlignment'; @@ -36,11 +35,6 @@ type PopoverMenuItem = MenuItemProps & { /** Determines whether the menu item is disabled or not */ disabled?: boolean; - - /** Determines whether the menu item's onSelected() function is called after the modal is hidden - * It is meant to be used in situations where, after clicking on the modal, another one is opened. - */ - shouldCallAfterModalHide?: boolean; }; type PopoverModalProps = Pick; @@ -134,11 +128,6 @@ function PopoverMenu({ setEnteredSubMenuIndexes([...enteredSubMenuIndexes, index]); const selectedSubMenuItemIndex = selectedItem?.subMenuItems.findIndex((option) => option.isSelected); setFocusedIndex(selectedSubMenuItemIndex); - } else if (selectedItem.shouldCallAfterModalHide) { - Modal.close(() => { - onItemSelected(selectedItem, index); - selectedItem.onSelected?.(); - }); } else { onItemSelected(selectedItem, index); selectedItem.onSelected?.(); diff --git a/src/libs/Navigation/AppNavigator/AuthScreens.tsx b/src/libs/Navigation/AppNavigator/AuthScreens.tsx index a9ac258a3533..4bbdac7b17b1 100644 --- a/src/libs/Navigation/AppNavigator/AuthScreens.tsx +++ b/src/libs/Navigation/AppNavigator/AuthScreens.tsx @@ -305,11 +305,7 @@ function AuthScreens({session, lastOpenedPublicRoomID, initialLastUpdateIDApplie const unsubscribeSearchShortcut = KeyboardShortcut.subscribe( searchShortcutConfig.shortcutKey, () => { - Modal.close( - Session.checkIfActionIsAllowed(() => Navigation.navigate(ROUTES.CHAT_FINDER)), - true, - true, - ); + Modal.close(Session.checkIfActionIsAllowed(() => Navigation.navigate(ROUTES.CHAT_FINDER))); }, shortcutsOverviewShortcutConfig.descriptionKey, shortcutsOverviewShortcutConfig.modifiers, diff --git a/src/libs/actions/Modal.ts b/src/libs/actions/Modal.ts index 01ac832336ab..9cba7a359537 100644 --- a/src/libs/actions/Modal.ts +++ b/src/libs/actions/Modal.ts @@ -5,7 +5,6 @@ const closeModals: Array<(isNavigating?: boolean) => void> = []; let onModalClose: null | (() => void); let isNavigate: undefined | boolean; -let shouldCloseAll: boolean | undefined; /** * Allows other parts of the app to call modal close function @@ -40,13 +39,12 @@ function closeTop() { /** * Close modal in other parts of the app */ -function close(onModalCloseCallback: () => void, isNavigating = true, shouldCloseAllModals = false) { +function close(onModalCloseCallback: () => void, isNavigating = true) { if (closeModals.length === 0) { onModalCloseCallback(); return; } onModalClose = onModalCloseCallback; - shouldCloseAll = shouldCloseAllModals; isNavigate = isNavigating; closeTop(); } @@ -55,7 +53,7 @@ function onModalDidClose() { if (!onModalClose) { return; } - if (closeModals.length && shouldCloseAll) { + if (closeModals.length) { closeTop(); return; } diff --git a/src/pages/home/report/ReportActionCompose/AttachmentPickerWithMenuItems.tsx b/src/pages/home/report/ReportActionCompose/AttachmentPickerWithMenuItems.tsx index 6e3c3a48de74..5d7b5b1390c2 100644 --- a/src/pages/home/report/ReportActionCompose/AttachmentPickerWithMenuItems.tsx +++ b/src/pages/home/report/ReportActionCompose/AttachmentPickerWithMenuItems.tsx @@ -23,6 +23,7 @@ import Navigation from '@libs/Navigation/Navigation'; import * as ReportUtils from '@libs/ReportUtils'; import * as SubscriptionUtils from '@libs/SubscriptionUtils'; import * as IOU from '@userActions/IOU'; +import * as Modal from '@userActions/Modal'; import * as Report from '@userActions/Report'; import * as Task from '@userActions/Task'; import type {IOUType} from '@src/CONST'; @@ -224,13 +225,13 @@ function AttachmentPickerWithMenuItems({ { icon: Expensicons.Paperclip, text: translate('reportActionCompose.addAttachment'), - onSelected: () => { - if (Browser.isSafari()) { - return; - } - triggerAttachmentPicker(); - }, - shouldCallAfterModalHide: true, + onSelected: () => + Modal.close(() => { + if (Browser.isSafari()) { + return; + } + triggerAttachmentPicker(); + }), }, ]; return ( diff --git a/src/pages/iou/request/step/IOURequestStepWaypoint.tsx b/src/pages/iou/request/step/IOURequestStepWaypoint.tsx index 802967345fb6..71c42acefdaa 100644 --- a/src/pages/iou/request/step/IOURequestStepWaypoint.tsx +++ b/src/pages/iou/request/step/IOURequestStepWaypoint.tsx @@ -23,6 +23,7 @@ import useWindowDimensions from '@hooks/useWindowDimensions'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; +import * as Modal from '@userActions/Modal'; import * as Transaction from '@userActions/Transaction'; import CONST from '@src/CONST'; import type {TranslationPaths} from '@src/languages/types'; @@ -178,10 +179,11 @@ function IOURequestStepWaypoint({ icon: Expensicons.Trashcan, text: translate('distance.deleteWaypoint'), onSelected: () => { - setRestoreFocusType(undefined); - setIsDeleteStopModalOpen(true); + Modal.close(() => { + setRestoreFocusType(undefined); + setIsDeleteStopModalOpen(true); + }); }, - shouldCallAfterModalHide: true, }, ]} /> diff --git a/src/pages/workspace/WorkspacesListPage.tsx b/src/pages/workspace/WorkspacesListPage.tsx index d4ff46e268f8..94fb454c4a2d 100755 --- a/src/pages/workspace/WorkspacesListPage.tsx +++ b/src/pages/workspace/WorkspacesListPage.tsx @@ -32,6 +32,7 @@ import * as PolicyUtils from '@libs/PolicyUtils'; import * as ReportUtils from '@libs/ReportUtils'; import type {AvatarSource} from '@libs/UserUtils'; import * as App from '@userActions/App'; +import * as Modal from '@userActions/Modal'; import * as Policy from '@userActions/Policy/Policy'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; @@ -161,12 +162,12 @@ function WorkspacesListPage({policies, reimbursementAccount, reports, session}: threeDotsMenuItems.push({ icon: Expensicons.Trashcan, text: translate('workspace.common.delete'), - onSelected: () => { - setPolicyIDToDelete(item.policyID ?? '-1'); - setPolicyNameToDelete(item.title); - setIsDeleteModalOpen(true); - }, - shouldCallAfterModalHide: true, + onSelected: () => + Modal.close(() => { + setPolicyIDToDelete(item.policyID ?? '-1'); + setPolicyNameToDelete(item.title); + setIsDeleteModalOpen(true); + }), }); } diff --git a/src/pages/workspace/accounting/PolicyAccountingPage.tsx b/src/pages/workspace/accounting/PolicyAccountingPage.tsx index 107f64dd2dee..11c47a21f2e1 100644 --- a/src/pages/workspace/accounting/PolicyAccountingPage.tsx +++ b/src/pages/workspace/accounting/PolicyAccountingPage.tsx @@ -38,6 +38,7 @@ import Navigation from '@navigation/Navigation'; import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; import withPolicyConnections from '@pages/workspace/withPolicyConnections'; import type {AnchorPosition} from '@styles/index'; +import * as Modal from '@userActions/Modal'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; @@ -97,8 +98,7 @@ function PolicyAccountingPage({policy}: PolicyAccountingPageProps) { { icon: Expensicons.Key, text: translate('workspace.accounting.enterCredentials'), - onSelected: () => startIntegrationFlow({name: connectedIntegration}), - shouldCallAfterModalHide: true, + onSelected: () => Modal.close(() => startIntegrationFlow({name: connectedIntegration})), disabled: isOffline, iconRight: Expensicons.NewWindow, shouldShowRightIcon: true, @@ -115,8 +115,7 @@ function PolicyAccountingPage({policy}: PolicyAccountingPageProps) { { icon: Expensicons.Trashcan, text: translate('workspace.accounting.disconnect'), - onSelected: () => setIsDisconnectModalOpen(true), - shouldCallAfterModalHide: true, + onSelected: () => Modal.close(() => setIsDisconnectModalOpen(true)), }, ], [shouldShowEnterCredentials, translate, isOffline, policyID, connectedIntegration, startIntegrationFlow],