diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts index 9f832b7f171d..35dc83efa1c5 100644 --- a/src/libs/actions/IOU.ts +++ b/src/libs/actions/IOU.ts @@ -944,8 +944,13 @@ function setMoneyRequestBillable(transactionID: string, billable: boolean) { Onyx.merge(`${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${transactionID}`, {billable}); } -function setMoneyRequestParticipants(transactionID: string, participants: Participant[] = [], shouldUpdateReportID = false) { - return Onyx.merge(`${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${transactionID}`, {participants, reportID: shouldUpdateReportID ? participants.at(0)?.reportID : undefined}); +function setMoneyRequestParticipants(transactionID: string, participants: Participant[] = [], isTestTransaction = false) { + // We should change the reportID and isFromGlobalCreate of the test transaction since this flow can start inside an existing report + return Onyx.merge(`${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${transactionID}`, { + participants, + isFromGlobalCreate: isTestTransaction ? true : undefined, + reportID: isTestTransaction ? participants?.at(0)?.reportID : undefined, + }); } function setSplitPayer(transactionID: string, payerAccountID: number) { diff --git a/src/pages/iou/request/IOURequestStartPage.tsx b/src/pages/iou/request/IOURequestStartPage.tsx index 395942de99a3..e2b267e9bd5a 100644 --- a/src/pages/iou/request/IOURequestStartPage.tsx +++ b/src/pages/iou/request/IOURequestStartPage.tsx @@ -9,6 +9,7 @@ import ScreenWrapper from '@components/ScreenWrapper'; import TabSelector from '@components/TabSelector/TabSelector'; import useLocalize from '@hooks/useLocalize'; import usePolicy from '@hooks/usePolicy'; +import usePrevious from '@hooks/usePrevious'; import useThemeStyles from '@hooks/useThemeStyles'; import {canUseTouchScreen} from '@libs/DeviceCapabilities'; import Navigation from '@libs/Navigation/Navigation'; @@ -44,14 +45,13 @@ function IOURequestStartPage({ const {translate} = useLocalize(); const shouldUseTab = iouType !== CONST.IOU.TYPE.SEND && iouType !== CONST.IOU.TYPE.PAY && iouType !== CONST.IOU.TYPE.INVOICE; const [isDraggingOver, setIsDraggingOver] = useState(false); - const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportID}`); + const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportID}`, {canBeMissing: true}); const policy = usePolicy(report?.policyID); - const [selectedTab = CONST.TAB_REQUEST.SCAN, selectedTabResult] = useOnyx(`${ONYXKEYS.COLLECTION.SELECTED_TAB}${CONST.TAB.IOU_REQUEST_TYPE}`); - const [session] = useOnyx(ONYXKEYS.SESSION); + const [selectedTab = CONST.TAB_REQUEST.SCAN, selectedTabResult] = useOnyx(`${ONYXKEYS.COLLECTION.SELECTED_TAB}${CONST.TAB.IOU_REQUEST_TYPE}`, {canBeMissing: true}); + const [session] = useOnyx(ONYXKEYS.SESSION, {canBeMissing: false}); const isLoadingSelectedTab = shouldUseTab ? isLoadingOnyxValue(selectedTabResult) : false; - // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing - const [transaction] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${route?.params.transactionID || CONST.DEFAULT_NUMBER_ID}`); - const [allPolicies] = useOnyx(ONYXKEYS.COLLECTION.POLICY); + const [transaction] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${route?.params.transactionID}`, {canBeMissing: true}); + const [allPolicies] = useOnyx(ONYXKEYS.COLLECTION.POLICY, {canBeMissing: false}); const tabTitles = { [CONST.IOU.TYPE.REQUEST]: translate('iou.createExpense'), @@ -68,15 +68,17 @@ function IOURequestStartPage({ [transaction?.iouRequestType, shouldUseTab, selectedTab], ); const isFromGlobalCreate = isEmptyObject(report?.reportID); + const prevTransactionReportID = usePrevious(transaction?.reportID); // Clear out the temporary expense if the reportID in the URL has changed from the transaction's reportID. useFocusEffect( useCallback(() => { - if (transaction?.reportID === reportID || isLoadingSelectedTab) { + // The test transaction can change the reportID of the transaction on the flow so we should prevent the reportID from being reverted again. + if (transaction?.reportID === reportID || isLoadingSelectedTab || prevTransactionReportID !== transaction?.reportID) { return; } initMoneyRequest(reportID, policy, isFromGlobalCreate, transaction?.iouRequestType, transactionRequestType); - }, [transaction, policy, reportID, isFromGlobalCreate, transactionRequestType, isLoadingSelectedTab]), + }, [transaction, policy, reportID, isFromGlobalCreate, transactionRequestType, isLoadingSelectedTab, prevTransactionReportID]), ); useEffect(() => {