diff --git a/src/components/ConfirmModal.tsx b/src/components/ConfirmModal.tsx
index 23a08b4306e3..1403f6a7ed42 100755
--- a/src/components/ConfirmModal.tsx
+++ b/src/components/ConfirmModal.tsx
@@ -7,6 +7,7 @@ import CONST from '@src/CONST';
import type IconAsset from '@src/types/utils/IconAsset';
import ConfirmContent from './ConfirmContent';
import Modal from './Modal';
+import type BaseModalProps from './Modal/types';
type ConfirmModalProps = {
/** Title of the modal */
@@ -74,6 +75,9 @@ type ConfirmModalProps = {
* We are attempting to migrate to a new refocus manager, adding this property for gradual migration.
* */
shouldEnableNewFocusManagement?: boolean;
+
+ /** How to re-focus after the modal is dismissed */
+ restoreFocusType?: BaseModalProps['restoreFocusType'];
};
function ConfirmModal({
@@ -98,6 +102,7 @@ function ConfirmModal({
onConfirm,
image,
shouldEnableNewFocusManagement,
+ restoreFocusType,
}: ConfirmModalProps) {
const {isSmallScreenWidth} = useResponsiveLayout();
const styles = useThemeStyles();
@@ -112,6 +117,7 @@ function ConfirmModal({
type={isSmallScreenWidth ? CONST.MODAL.MODAL_TYPE.BOTTOM_DOCKED : CONST.MODAL.MODAL_TYPE.CONFIRM}
innerContainerStyle={image ? styles.pt0 : {}}
shouldEnableNewFocusManagement={shouldEnableNewFocusManagement}
+ restoreFocusType={restoreFocusType}
>
{(reportField.type === 'text' || isReportFieldTitle) && (
diff --git a/src/pages/iou/request/step/IOURequestStepWaypoint.tsx b/src/pages/iou/request/step/IOURequestStepWaypoint.tsx
index 6c0eae98fb85..7e122c8cb32d 100644
--- a/src/pages/iou/request/step/IOURequestStepWaypoint.tsx
+++ b/src/pages/iou/request/step/IOURequestStepWaypoint.tsx
@@ -13,6 +13,7 @@ import InputWrapperWithRef from '@components/Form/InputWrapper';
import type {FormOnyxValues} from '@components/Form/types';
import HeaderWithBackButton from '@components/HeaderWithBackButton';
import * as Expensicons from '@components/Icon/Expensicons';
+import type BaseModalProps from '@components/Modal/types';
import ScreenWrapper from '@components/ScreenWrapper';
import useLocalize from '@hooks/useLocalize';
import useLocationBias from '@hooks/useLocationBias';
@@ -58,6 +59,7 @@ function IOURequestStepWaypoint({
const styles = useThemeStyles();
const {windowWidth} = useWindowDimensions();
const [isDeleteStopModalOpen, setIsDeleteStopModalOpen] = useState(false);
+ const [restoreFocusType, setRestoreFocusType] = useState();
const navigation = useNavigation();
const isFocused = navigation.isFocused();
const {translate} = useLocalize();
@@ -130,6 +132,7 @@ function IOURequestStepWaypoint({
const deleteStopAndHideModal = () => {
Transaction.removeWaypoint(transaction, pageIndex, action === CONST.IOU.ACTION.CREATE);
+ setRestoreFocusType(CONST.MODAL.RESTORE_FOCUS_TYPE.DELETE);
setIsDeleteStopModalOpen(false);
Navigation.goBack(ROUTES.MONEY_REQUEST_STEP_DISTANCE.getRoute(action, iouType, transactionID, reportID));
};
@@ -172,7 +175,10 @@ function IOURequestStepWaypoint({
{
icon: Expensicons.Trashcan,
text: translate('distance.deleteWaypoint'),
- onSelected: () => setIsDeleteStopModalOpen(true),
+ onSelected: () => {
+ setRestoreFocusType(undefined);
+ setIsDeleteStopModalOpen(true);
+ },
},
]}
/>
@@ -186,6 +192,8 @@ function IOURequestStepWaypoint({
confirmText={translate('common.delete')}
cancelText={translate('common.cancel')}
danger
+ shouldEnableNewFocusManagement
+ restoreFocusType={restoreFocusType}
/>