fix: [P2P Distance] Split - Participants amount displayed 0.00 briefly on confirmation screen.

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

@@ -87,11 +87,11 @@ function IOURequestStepConfirmation({
     const isSubmittingFromTrackExpense = action === CONST.IOU.ACTION.SUBMIT;
     const isMovingTransactionFromTrackExpense = IOUUtils.isMovingTransactionFromTrackExpense(action);
     const payeePersonalDetails = useMemo(() => {
-        if (personalDetails?.[transaction?.splitPayerAccountIDs?.[0] ?? -1]) {
-            return personalDetails?.[transaction?.splitPayerAccountIDs?.[0] ?? -1];
+        if (personalDetails?.[transaction?.splitPayerAccountIDs?.at(0) ?? -1]) {
+            return personalDetails?.[transaction?.splitPayerAccountIDs?.at(0) ?? -1];
         }
 
-        const participant = transaction?.participants?.find((val) => val.accountID === (transaction?.splitPayerAccountIDs?.[0] ?? -1));
+        const participant = transaction?.participants?.find((val) => val.accountID === (transaction?.splitPayerAccountIDs?.at(0) ?? -1));
 
         return {
             login: participant?.login ?? '',

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

@@ -21,10 +21,12 @@
 import usePrevious from '@hooks/usePrevious';
 import useThemeStyles from '@hooks/useThemeStyles';
 import DistanceRequestUtils from '@libs/DistanceRequestUtils';
+import type {MileageRate} from '@libs/DistanceRequestUtils';
 import * as ErrorUtils from '@libs/ErrorUtils';
 import * as IOUUtils from '@libs/IOUUtils';
 import Navigation from '@libs/Navigation/Navigation';
 import * as OptionsListUtils from '@libs/OptionsListUtils';
+import * as PolicyUtils from '@libs/PolicyUtils';
 import * as ReportUtils from '@libs/ReportUtils';
 import * as TransactionUtils from '@libs/TransactionUtils';
 import * as IOU from '@userActions/IOU';
@@ -36,6 +38,7 @@
 import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
 import type * as OnyxTypes from '@src/types/onyx';
+import type {Participant} from '@src/types/onyx/IOU';
 import type {Errors} from '@src/types/onyx/OnyxCommon';
 import type {Waypoint, WaypointCollection} from '@src/types/onyx/Transaction';
 import StepScreenWrapper from './StepScreenWrapper';
@@ -83,6 +86,7 @@
     const scrollViewRef = useRef<RNScrollView>(null);
     const isLoadingRoute = transaction?.comment?.isLoading ?? false;
     const isLoading = transaction?.isLoading ?? false;
+    const isSplitRequest = iouType === CONST.IOU.TYPE.SPLIT;
     const hasRouteError = !!transaction?.errorFields?.route;
     const [shouldShowAtLeastTwoDifferentWaypointsError, setShouldShowAtLeastTwoDifferentWaypointsError] = useState(false);
     const isWaypointEmpty = (waypoint?: Waypoint) => {
@@ -104,7 +108,39 @@
     const isCreatingNewRequest = !(backTo || isEditing);
     const [recentWaypoints, {status: recentWaypointsStatus}] = useOnyx(ONYXKEYS.NVP_RECENT_WAYPOINTS);
     const iouRequestType = TransactionUtils.getRequestType(transaction);
-    const customUnitRateID = TransactionUtils.getRateID(transaction);
+    const customUnitRateID = TransactionUtils.getRateID(transaction) ?? '-1';
+
+    // Sets `amount` and `split` share data before moving to the next step to avoid briefly showing `0.00` as the split share for participants
+    const setDistanceRequestData = useCallback(
+        (participants: Participant[]) => {
+            // Get policy report based on transaction participants
+            const isPolicyExpenseChat = participants?.some((participant) => participant.isPolicyExpenseChat);
+            const selectedReportID = participants?.length === 1 ? participants[0]?.reportID ?? reportID : reportID;
+            const policyReport = participants?.[0] ? ReportUtils.getReport(selectedReportID) : report;
+
+            const policyID2 = IOU.getIOURequestPolicyID(transaction, policyReport);
+            const policy2 = PolicyUtils.getPolicy(report?.policyID ?? policyID2);
+            const policyCurrency = policy?.outputCurrency ?? PolicyUtils.getPersonalPolicy()?.outputCurrency ?? CONST.CURRENCY.USD;
+
+            const mileageRates = DistanceRequestUtils.getMileageRates(policy2);
+            const defaultMileageRate = DistanceRequestUtils.getDefaultMileageRate(policy2);
+            const mileageRate: MileageRate = TransactionUtils.isCustomUnitRateIDForP2P(transaction)
+                ? DistanceRequestUtils.getRateForP2P(policyCurrency)
+                : mileageRates?.[customUnitRateID] ?? defaultMileageRate;
+
+            const {unit, rate} = mileageRate ?? {};
+            const distance = TransactionUtils.getDistanceInMeters(transaction, unit);
+            const currency = mileageRate?.currency ?? policyCurrency;
+            const amount = DistanceRequestUtils.getDistanceRequestAmount(distance, unit ?? CONST.CUSTOM_UNITS.DISTANCE_UNIT_MILES, rate ?? 0);
+            IOU.setMoneyRequestAmount(transactionID, amount, currency);
+
+            const participantAccountIDs: number[] | undefined = participants?.map((participant) => Number(participant.accountID ?? -1));
+            if (isSplitRequest && amount && currency && !isPolicyExpenseChat) {
+                IOU.setSplitShares(transaction, amount, currency ?? '', participantAccountIDs ?? []);
+            }
+        },
+        [report, transaction, transactionID, isSplitRequest, policy?.outputCurrency, reportID, customUnitRateID],
+    );
 
     // For quick button actions, we'll skip the confirmation page unless the report is archived or this is a workspace
     // request and the workspace requires a category or a tag
@@ -245,6 +281,7 @@
                 const participantAccountID = participant?.accountID ?? -1;
                 return participantAccountID ? OptionsListUtils.getParticipantsOption(participant, personalDetails) : OptionsListUtils.getReportOption(participant);
             });
+            setDistanceRequestData(participants);
             if (shouldSkipConfirmation) {
                 if (iouType === CONST.IOU.TYPE.SPLIT) {
                     IOU.splitBill({
@@ -348,6 +385,7 @@
         iouRequestType,
         reportNameValuePairs,
         customUnitRateID,
+        setDistanceRequestData,
     ]);
 
     const getError = () => {