diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts index 0f974566a98b..8b68df3b3d89 100644 --- a/src/libs/actions/IOU.ts +++ b/src/libs/actions/IOU.ts @@ -312,7 +312,13 @@ function getReportPreviewAction(chatReportID: string, iouReportID: string): Onyx * @param isFromGlobalCreate * @param iouRequestType one of manual/scan/distance */ -function initMoneyRequest(reportID: string, policy: OnyxEntry, isFromGlobalCreate: boolean, iouRequestType: IOURequestType = CONST.IOU.REQUEST_TYPE.MANUAL) { +function initMoneyRequest( + reportID: string, + policy: OnyxEntry, + isFromGlobalCreate: boolean, + currentIouRequestType: IOURequestType | undefined, + newIouRequestType: IOURequestType, +) { // Generate a brand new transactionID const newTransactionID = CONST.IOU.OPTIMISTIC_TRANSACTION_ID; const currency = policy?.outputCurrency ?? currentUserPersonalDetails?.localCurrencyCode ?? CONST.CURRENCY.USD; @@ -320,11 +326,9 @@ function initMoneyRequest(reportID: string, policy: OnyxEntry, // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing const created = currentDate || format(new Date(), 'yyyy-MM-dd'); - const currentTransaction = allTransactionDrafts?.[`${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${newTransactionID}`]; - // in case we have to re-init money request, but the IOU request type is the same with the old draft transaction, // we should keep most of the existing data by using the ONYX MERGE operation - if (currentTransaction?.iouRequestType === iouRequestType) { + if (currentIouRequestType === newIouRequestType) { // so, we just need to update the reportID, isFromGlobalCreate, created, currency Onyx.merge(`${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${newTransactionID}`, { reportID, @@ -339,7 +343,7 @@ function initMoneyRequest(reportID: string, policy: OnyxEntry, const comment: Comment = {}; // Add initial empty waypoints when starting a distance expense - if (iouRequestType === CONST.IOU.REQUEST_TYPE.DISTANCE) { + if (newIouRequestType === CONST.IOU.REQUEST_TYPE.DISTANCE) { comment.waypoints = { waypoint0: {keyForList: 'start_waypoint'}, waypoint1: {keyForList: 'stop_waypoint'}, @@ -357,7 +361,7 @@ function initMoneyRequest(reportID: string, policy: OnyxEntry, comment, created, currency, - iouRequestType, + iouRequestType: newIouRequestType, reportID, transactionID: newTransactionID, isFromGlobalCreate, diff --git a/src/pages/iou/request/IOURequestStartPage.tsx b/src/pages/iou/request/IOURequestStartPage.tsx index 09fe67ab882f..0d124c783947 100644 --- a/src/pages/iou/request/IOURequestStartPage.tsx +++ b/src/pages/iou/request/IOURequestStartPage.tsx @@ -1,4 +1,4 @@ -import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react'; +import React, {useCallback, useEffect, useMemo, useState} from 'react'; import {View} from 'react-native'; import {useOnyx} from 'react-native-onyx'; import DragAndDropProvider from '@components/DragAndDrop/Provider'; @@ -15,7 +15,6 @@ import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import Navigation from '@libs/Navigation/Navigation'; import OnyxTabNavigator, {TabScreenWithFocusTrapWrapper, TopTab} from '@libs/Navigation/OnyxTabNavigator'; import * as ReportUtils from '@libs/ReportUtils'; -import * as TransactionUtils from '@libs/TransactionUtils'; import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; import type {IOURequestType} from '@userActions/IOU'; import * as IOU from '@userActions/IOU'; @@ -23,6 +22,7 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import type SCREENS from '@src/SCREENS'; import {isEmptyObject} from '@src/types/utils/EmptyObject'; +import isLoadingOnyxValue from '@src/types/utils/isLoadingOnyxValue'; import IOURequestStepAmount from './step/IOURequestStepAmount'; import IOURequestStepDistance from './step/IOURequestStepDistance'; import IOURequestStepScan from './step/IOURequestStepScan'; @@ -41,7 +41,8 @@ function IOURequestStartPage({ const [isDraggingOver, setIsDraggingOver] = useState(false); const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportID}`); const policy = usePolicy(report?.policyID); - const [selectedTab] = useOnyx(`${ONYXKEYS.COLLECTION.SELECTED_TAB}${CONST.TAB.IOU_REQUEST_TYPE}`); + const [selectedTab = CONST.TAB_REQUEST.SCAN, selectedTabResult] = useOnyx(`${ONYXKEYS.COLLECTION.SELECTED_TAB}${CONST.TAB.IOU_REQUEST_TYPE}`); + const isLoadingSelectedTab = isLoadingOnyxValue(selectedTabResult); // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing const [transaction] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${route?.params.transactionID || -1}`); const [allPolicies] = useOnyx(ONYXKEYS.COLLECTION.POLICY); @@ -57,16 +58,16 @@ function IOURequestStartPage({ [CONST.IOU.TYPE.INVOICE]: translate('workspace.invoices.sendInvoice'), [CONST.IOU.TYPE.CREATE]: translate('iou.createExpense'), }; - const transactionRequestType = useRef(TransactionUtils.getRequestType(transaction)); + const transactionRequestType = useMemo(() => transaction?.iouRequestType ?? selectedTab, [transaction?.iouRequestType, selectedTab]); const isFromGlobalCreate = isEmptyObject(report?.reportID); // Clear out the temporary expense if the reportID in the URL has changed from the transaction's reportID useEffect(() => { - if (transaction?.reportID === reportID) { + if (transaction?.reportID === reportID || isLoadingSelectedTab) { return; } - IOU.initMoneyRequest(reportID, policy, isFromGlobalCreate, transactionRequestType.current); - }, [transaction, policy, reportID, iouType, isFromGlobalCreate]); + IOU.initMoneyRequest(reportID, policy, isFromGlobalCreate, transaction?.iouRequestType, transactionRequestType); + }, [transaction, policy, reportID, iouType, isFromGlobalCreate, transactionRequestType, isLoadingSelectedTab]); const isExpenseChat = ReportUtils.isPolicyExpenseChat(report); const isExpenseReport = ReportUtils.isExpenseReport(report); @@ -82,7 +83,7 @@ function IOURequestStartPage({ if (transaction?.iouRequestType === newIOUType) { return; } - IOU.initMoneyRequest(reportID, policy, isFromGlobalCreate, newIOUType); + IOU.initMoneyRequest(reportID, policy, isFromGlobalCreate, transaction?.iouRequestType, newIOUType); }, [policy, reportID, isFromGlobalCreate, transaction], );