Skip to content

Refactor ConfirmModal usage to useConfirmModal in Money Request pages #80902

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
roryabraham merged 13 commits into from
Feb 18, 2026
Merged

Refactor ConfirmModal usage to useConfirmModal in Money Request pages #80902

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
42a1d03
Refactor ConfirmModal usage to useConfirmModal in Money Request pages
nkdengineer Jan 29, 2026
8aa7a46
resolve conflict
nkdengineer Jan 29, 2026
69361ab
Merge branch 'main' into fix/76694-v4
nkdengineer Jan 29, 2026
c9c9002
remove unused variable
nkdengineer Jan 29, 2026
d900144
resolve conflict
nkdengineer Feb 3, 2026
60ceddb
queue export immediately
nkdengineer Feb 3, 2026
019c3de
update type import
nkdengineer Feb 3, 2026
6b94b22
add sentryLabel
nkdengineer Feb 3, 2026
6b5270f
Merge branch 'main' into fix/76694-v4
nkdengineer Feb 11, 2026
02b79d7
fix duplicate select all button
nkdengineer Feb 11, 2026
51f6909
resolve conflict
nkdengineer Feb 13, 2026
6bffcfa
resolve conflict
nkdengineer Feb 17, 2026
9d25f04
fix ts error
nkdengineer Feb 17, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
123 changes: 56 additions & 67 deletions src/components/MoneyRequestHeader.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import React, {useCallback, useMemo, useState} from 'react';
import {View} from 'react-native';
import type {OnyxEntry} from 'react-native-onyx';
import type {ValueOf} from 'type-fest';
import useConfirmModal from '@hooks/useConfirmModal';
import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails';
import useDefaultExpensePolicy from '@hooks/useDefaultExpensePolicy';
import useDeleteTransactions from '@hooks/useDeleteTransactions';
Expand Down Expand Up @@ -70,7 +71,6 @@ import BrokenConnectionDescription from './BrokenConnectionDescription';
import Button from './Button';
import ButtonWithDropdownMenu from './ButtonWithDropdownMenu';
import type {DropdownOption} from './ButtonWithDropdownMenu/types';
import ConfirmModal from './ConfirmModal';
import DecisionModal from './DecisionModal';
import {useDelegateNoAccessActions, useDelegateNoAccessState} from './DelegateNoAccessModalProvider';
import HeaderWithBackButton from './HeaderWithBackButton';
Expand All @@ -80,6 +80,7 @@ import Icon from './Icon';
// eslint-disable-next-line no-restricted-imports
import * as Expensicons from './Icon/Expensicons';
import LoadingBar from './LoadingBar';
import {ModalActions} from './Modal/Global/ModalContext';
import type {MoneyRequestHeaderStatusBarProps} from './MoneyRequestHeaderStatusBar';
import MoneyRequestHeaderStatusBar from './MoneyRequestHeaderStatusBar';
import MoneyRequestReportTransactionsNavigation from './MoneyRequestReportView/MoneyRequestReportTransactionsNavigation';
Expand Down Expand Up @@ -126,14 +127,12 @@ function MoneyRequestHeader({report, parentReportAction, policy, onBackButtonPre
const transactionViolations = useTransactionViolations(transaction?.transactionID);
const [policyRecentlyUsedCurrencies] = useOnyx(ONYXKEYS.RECENTLY_USED_CURRENCIES, {canBeMissing: true});
const {duplicateTransactions, duplicateTransactionViolations} = useDuplicateTransactionsAndViolations(transaction?.transactionID ? [transaction.transactionID] : []);
const [isDeleteModalVisible, setIsDeleteModalVisible] = useState(false);
const {showConfirmModal} = useConfirmModal();
const [downloadErrorModalVisible, setDownloadErrorModalVisible] = useState(false);
const [isHoldEducationalModalVisible, setIsHoldEducationalModalVisible] = useState(false);
const [rejectModalAction, setRejectModalAction] = useState<ValueOf<
typeof CONST.REPORT.TRANSACTION_SECONDARY_ACTIONS.HOLD | typeof CONST.REPORT.TRANSACTION_SECONDARY_ACTIONS.REJECT
> | null>(null);
const [rateErrorModalVisible, setRateErrorModalVisible] = useState(false);
const [duplicatePerDiemErrorModalVisible, setDuplicatePerDiemErrorModalVisible] = useState(false);
const [isDuplicateActive, temporarilyDisableDuplicateAction] = useThrottledButtonState();
const [dismissedRejectUseExplanation] = useOnyx(ONYXKEYS.NVP_DISMISSED_REJECT_USE_EXPLANATION, {canBeMissing: true});
const [dismissedHoldUseExplanation] = useOnyx(ONYXKEYS.NVP_DISMISSED_HOLD_USE_EXPLANATION, {canBeMissing: true});
Expand Down Expand Up @@ -459,12 +458,22 @@ function MoneyRequestHeader({report, parentReportAction, policy, onBackButtonPre
value: CONST.REPORT.SECONDARY_ACTIONS.DUPLICATE,
onSelected: () => {
if (hasCustomUnitOutOfPolicyViolation) {
setRateErrorModalVisible(true);
showConfirmModal({
title: translate('common.duplicateExpense'),
prompt: translate('iou.correctRateError'),
confirmText: translate('common.buttonConfirm'),
shouldShowCancelButton: false,
});
return;
}

if (isPerDiemRequestOnNonDefaultWorkspace) {
setDuplicatePerDiemErrorModalVisible(true);
showConfirmModal({
title: translate('common.duplicateExpense'),
prompt: translate('iou.duplicateNonDefaultWorkspacePerDiemError'),
confirmText: translate('common.buttonConfirm'),
shouldShowCancelButton: false,
});
return;
}

Expand All @@ -491,7 +500,47 @@ function MoneyRequestHeader({report, parentReportAction, policy, onBackButtonPre
icon: Expensicons.Trashcan,
value: CONST.REPORT.SECONDARY_ACTIONS.DELETE,
onSelected: () => {
setIsDeleteModalVisible(true);
showConfirmModal({
title: translate('iou.deleteExpense', {count: 1}),
prompt: translate('iou.deleteConfirmation', {count: 1}),
confirmText: translate('common.delete'),
cancelText: translate('common.cancel'),
danger: true,
shouldEnableNewFocusManagement: true,
}).then((result) => {
if (result.action !== ModalActions.CONFIRM) {
return;
}
if (!parentReportAction || !transaction) {
throw new Error('Data missing');
}
if (isTrackExpenseAction(parentReportAction)) {
deleteTrackExpense({
chatReportID: report?.parentReportID,
chatReport: parentReport,
transactionID: transaction.transactionID,
reportAction: parentReportAction,
iouReport,
chatIOUReport,
transactions: duplicateTransactions,
violations: duplicateTransactionViolations,
isSingleTransactionView: true,
isChatReportArchived: isParentReportArchived,
isChatIOUReportArchived,
allTransactionViolationsParam: allTransactionViolations,
currentUserAccountID: accountID,
});
} else {
deleteTransactions([transaction.transactionID], duplicateTransactions, duplicateTransactionViolations, currentSearchHash, true);
removeTransaction(transaction.transactionID);
}
if (isInNarrowPaneModal) {
Navigation.navigateBackToLastSuperWideRHPScreen();
return;
}

onBackButtonPress();
});
},
},
[CONST.REPORT.TRANSACTION_SECONDARY_ACTIONS.REJECT]: {
Expand Down Expand Up @@ -596,66 +645,6 @@ function MoneyRequestHeader({report, parentReportAction, policy, onBackButtonPre
isVisible={downloadErrorModalVisible}
onClose={() => setDownloadErrorModalVisible(false)}
/>
<ConfirmModal
title={translate('iou.deleteExpense', {count: 1})}
isVisible={isDeleteModalVisible}
onConfirm={() => {
setIsDeleteModalVisible(false);
if (!parentReportAction || !transaction) {
throw new Error('Data missing');
}
if (isTrackExpenseAction(parentReportAction)) {
deleteTrackExpense({
chatReportID: report?.parentReportID,
chatReport: parentReport,
transactionID: transaction.transactionID,
reportAction: parentReportAction,
iouReport,
chatIOUReport,
transactions: duplicateTransactions,
violations: duplicateTransactionViolations,
isSingleTransactionView: true,
isChatReportArchived: isParentReportArchived,
isChatIOUReportArchived,
allTransactionViolationsParam: allTransactionViolations,
currentUserAccountID: accountID,
});
} else {
deleteTransactions([transaction.transactionID], duplicateTransactions, duplicateTransactionViolations, currentSearchHash, true);
removeTransaction(transaction.transactionID);
}
if (isInNarrowPaneModal) {
Navigation.navigateBackToLastSuperWideRHPScreen();
return;
}

onBackButtonPress();
}}
onCancel={() => setIsDeleteModalVisible(false)}
prompt={translate('iou.deleteConfirmation', {count: 1})}
confirmText={translate('common.delete')}
cancelText={translate('common.cancel')}
danger
shouldEnableNewFocusManagement
/>
<ConfirmModal
title={translate('common.duplicateExpense')}
isVisible={rateErrorModalVisible}
onConfirm={() => setRateErrorModalVisible(false)}
onCancel={() => setRateErrorModalVisible(false)}
confirmText={translate('common.buttonConfirm')}
prompt={translate('iou.correctRateError')}
shouldShowCancelButton={false}
/>
<ConfirmModal
title={translate('common.duplicateExpense')}
isVisible={duplicatePerDiemErrorModalVisible}
onConfirm={() => setDuplicatePerDiemErrorModalVisible(false)}
onCancel={() => setDuplicatePerDiemErrorModalVisible(false)}
confirmText={translate('common.buttonConfirm')}
prompt={translate('iou.duplicateNonDefaultWorkspacePerDiemError')}
shouldShowCancelButton={false}
/>
{!!rejectModalAction && (
<HoldOrRejectEducationalModal
onClose={dismissRejectModalBasedOnAction}
Expand Down
Loading
Loading