fix: do not refresh draft txn after redirect

src/libs/actions/IOU.ts

@@ -6954,15 +6954,16 @@ function navigateToStartStepIfScanFileCannotBeRead(
     transactionID: string,
     reportID: string,
     receiptType: string | undefined,
+    backToParam?: string,
 ) {
     if (!receiptFilename || !receiptPath) {
         return;
     }
 
     const onFailure = () => {
         setMoneyRequestReceipt(transactionID, '', '', true);
-        if (requestType === CONST.IOU.REQUEST_TYPE.MANUAL) {
-            Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_SCAN.getRoute(CONST.IOU.ACTION.CREATE, iouType, transactionID, reportID, Navigation.getActiveRouteWithoutParams()));
+        if (requestType === CONST.IOU.REQUEST_TYPE.MANUAL || requestType === CONST.IOU.REQUEST_TYPE.SCAN) {
+            Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_SCAN.getRoute(CONST.IOU.ACTION.CREATE, iouType, transactionID, reportID, backToParam ?? Navigation.getActiveRouteWithoutParams()));
             return;
         }
         IOUUtils.navigateToStartMoneyRequestStep(requestType, iouType, transactionID, reportID);

src/pages/iou/request/IOURequestStartPage.tsx

@@ -109,9 +109,12 @@ function IOURequestStartPage({
 
     const resetIOUTypeIfChanged = useCallback(
         (newIOUType: IOURequestType) => {
+            if (transaction?.iouRequestType === newIOUType) {
+                return;
+            }
             IOU.initMoneyRequest(reportID, policy, isFromGlobalCreate, newIOUType);
         },
-        [policy, reportID, isFromGlobalCreate],
+        [policy, reportID, isFromGlobalCreate, transaction?.iouRequestType],
     );
 
     if (!transaction?.transactionID) {

src/pages/iou/request/step/IOURequestStepConfirmation.tsx

@@ -1,3 +1,4 @@
+import {useFocusEffect} from '@react-navigation/native';
 import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import {View} from 'react-native';
 import type {OnyxEntry} from 'react-native-onyx';
@@ -189,7 +190,8 @@ function IOURequestStepConfirmation({
         // If there is not a report attached to the IOU with a reportID, then the participants were manually selected and the user needs taken
         // back to the participants step
         if (!transaction?.participantsAutoAssigned) {
-            Navigation.goBack(ROUTES.MONEY_REQUEST_STEP_PARTICIPANTS.getRoute(iouType, transactionID, reportID, undefined, action));
+            // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+            Navigation.goBack(ROUTES.MONEY_REQUEST_STEP_PARTICIPANTS.getRoute(iouType, transactionID, transaction?.reportID || reportID, undefined, action));
             return;
         }
         IOUUtils.navigateToStartMoneyRequestStep(requestType, iouType, transactionID, reportID, action);
@@ -201,25 +203,32 @@ function IOURequestStepConfirmation({
 
     // When the component mounts, if there is a receipt, see if the image can be read from the disk. If not, redirect the user to the starting step of the flow.
     // This is because until the request is saved, the receipt file is only stored in the browsers memory as a blob:// and if the browser is refreshed, then
-    // the image ceases to exist. The best way for the user to recover from this is to start over from the start of the request process.
+    // the image ceases to exist. We will navigate to the user to the scanning page and resume the flow once the user has re-uploaded the file
     // skip this in case user is moving the transaction as the receipt path will be valid in that case
-    useEffect(() => {
-        // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
-        const isLocalFile = FileUtils.isLocalFile(receiptPath);
+    useFocusEffect(
+        useCallback(() => {
+            const backToParam = ROUTES.MONEY_REQUEST_STEP_CONFIRMATION.getRoute(action, iouType, transactionID, reportID);
+            if (!receiptPath && requestType === CONST.IOU.REQUEST_TYPE.SCAN) {
+                Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_SCAN.getRoute(CONST.IOU.ACTION.CREATE, iouType, transactionID, reportID, backToParam));
+                return;
+            }
+            // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+            const isLocalFile = FileUtils.isLocalFile(receiptPath);
 
-        if (!isLocalFile) {
-            setReceiptFile(transaction?.receipt);
-            return;
-        }
+            if (!isLocalFile) {
+                setReceiptFile(transaction?.receipt);
+                return;
+            }
 
-        const onSuccess = (file: File) => {
-            const receipt: Receipt = file;
-            receipt.state = file && requestType === CONST.IOU.REQUEST_TYPE.MANUAL ? CONST.IOU.RECEIPT_STATE.OPEN : CONST.IOU.RECEIPT_STATE.SCANREADY;
-            setReceiptFile(receipt);
-        };
+            const onSuccess = (file: File) => {
+                const receipt: Receipt = file;
+                receipt.state = file && requestType === CONST.IOU.REQUEST_TYPE.MANUAL ? CONST.IOU.RECEIPT_STATE.OPEN : CONST.IOU.RECEIPT_STATE.SCANREADY;
+                setReceiptFile(receipt);
+            };
 
-        IOU.navigateToStartStepIfScanFileCannotBeRead(receiptFilename, receiptPath, onSuccess, requestType, iouType, transactionID, reportID, receiptType);
-    }, [receiptType, receiptPath, receiptFilename, requestType, iouType, transactionID, reportID, action, transaction?.receipt]);
+            IOU.navigateToStartStepIfScanFileCannotBeRead(receiptFilename, receiptPath, onSuccess, requestType, iouType, transactionID, reportID, receiptType, backToParam);
+        }, [receiptType, receiptPath, receiptFilename, requestType, iouType, transactionID, reportID, action, transaction?.receipt]),
+    );
 
     const requestMoney = useCallback(
         (selectedParticipants: Participant[], trimmedComment: string, receiptObj?: Receipt, gpsPoints?: IOU.GpsPoint) => {

src/pages/iou/request/step/IOURequestStepParticipants.tsx

@@ -1,4 +1,5 @@
 import {useIsFocused} from '@react-navigation/core';
+import {useFocusEffect} from '@react-navigation/native';
 import React, {useCallback, useEffect, useMemo, useRef} from 'react';
 import type {OnyxEntry} from 'react-native-onyx';
 import {withOnyx} from 'react-native-onyx';
@@ -81,12 +82,29 @@ function IOURequestStepParticipants({
     // This is because until the expense is saved, the receipt file is only stored in the browsers memory as a blob:// and if the browser is refreshed, then
     // the image ceases to exist. The best way for the user to recover from this is to start over from the start of the expense process.
     // skip this in case user is moving the transaction as the receipt path will be valid in that case
-    useEffect(() => {
-        if (IOUUtils.isMovingTransactionFromTrackExpense(action)) {
-            return;
-        }
-        IOU.navigateToStartStepIfScanFileCannotBeRead(receiptFilename ?? '', receiptPath ?? '', () => {}, iouRequestType, iouType, transactionID, reportID, receiptType ?? '');
-    }, [receiptType, receiptPath, receiptFilename, iouRequestType, iouType, transactionID, reportID, action]);
+    useFocusEffect(
+        useCallback(() => {
+            if (IOUUtils.isMovingTransactionFromTrackExpense(action)) {
+                return;
+            }
+            const backToParam = ROUTES.MONEY_REQUEST_STEP_PARTICIPANTS.getRoute(iouType, transactionID, reportID, action);
+            if (!receiptPath && iouRequestType === CONST.IOU.REQUEST_TYPE.SCAN) {
+                Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_SCAN.getRoute(CONST.IOU.ACTION.CREATE, iouType, transactionID, reportID, backToParam));
+                return;
+            }
+            IOU.navigateToStartStepIfScanFileCannotBeRead(
+                receiptFilename ?? '',
+                receiptPath ?? '',
+                () => {},
+                iouRequestType,
+                iouType,
+                transactionID,
+                reportID,
+                receiptType ?? '',
+                backToParam,
+            );
+        }, [receiptType, receiptPath, receiptFilename, iouRequestType, iouType, transactionID, reportID, action]),
+    );
 
     const addParticipant = useCallback(
         (val: Participant[]) => {