[Navigation] Fix goBack in IOU steps #56876

adamgrzybowski · 2025-02-14T14:33:33Z

This PR fixes the issue: Destination field is not editable & defaulted to 1:1 DM after coming from amount page

Besides I used this PR to fix related problems in the per diem flow discussed here https://swmansion.slack.com/archives/C01GTK53T8Q/p1739480554048859?thread_ts=1739420502.347449&cid=C01GTK53T8Q

Which is a follow-up fix for this PR

Explanation of Change

Fixed Issues

$ #56803
$ #56807
$ #56810
PROPOSAL:

Tests

Precondition:

Account has a default group workspace.

Go to staging.new.expensify.com
Open FAB > Create expense > Manual.
Enter amount > Next.
Click on the destination field.
Select any user (not workspace).
Click RHP back button.
Click Next.
Destination field is editable and defaulted to the default group workspace.

Precondition:

Account has a default group workspace.
Go to staging.new.expensify.com
Go to FAB > Create expense > Manual.
Click currency.
Select a different currency.
Enter amount > Next.
Click RHP back button.
Currency will not reset to default currency.

Precondition:

Account has a default group workspace.
Go to staging.new.expensify.com
Open FAB > Create expense > Manual.
Enter amount > Next.
Click on the destination field.
Select any user.
On confirmation page, swipe to right (device back button on Android) to go back.
Swipe to right (device back button on Android) to go back again.
App will return to amount input page.

Verify that no errors appear in the JS console

Offline tests

Same as the tests

QA Steps

Same as the tests

Verify that no errors appear in the JS console

PR Author Checklist

Screenshots/Videos

Android: Native

Android: mWeb Chrome

iOS: Native

iOS: mWeb Safari

MacOS: Chrome / Safari

Screen.Recording.2025-02-14.at.15.21.31.mov

Screen.Recording.2025-02-14.at.15.31.39.mov

MacOS: Desktop

melvin-bot · 2025-02-14T14:33:38Z

@ikevin127 Please copy/paste the Reviewer Checklist from here into a new comment on this PR and complete it. If you have the K2 extension, you can simply click: [this button]

adamgrzybowski · 2025-02-14T14:37:03Z

I am not sure what is the process of choosing reviewers but it would be great if you guys @shubham1206agra and @WojtekBoman could take a look because you're in the loop on this issue. Thanks! 🙇

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

dukenv0307 · 2025-02-17T09:03:46Z

@adamgrzybowski
Bug:

Click FAB -> create expense
Enter amount -> Next
Open participant page
Select any option
Click back button

Current behavior:

Users redirect to participant page

Expected behavior:

Users should redirect to amount page

Screen.Recording.2025-02-17.at.16.00.59.mov

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

adamgrzybowski · 2025-02-17T12:42:46Z

Hey, @dukenv0307! I made some adjustments you requested. Could you please take a look once again?

dukenv0307 · 2025-02-18T03:04:33Z

src/libs/PolicyUtils.ts

@@ -86,6 +86,16 @@ function getActivePolicies(policies: OnyxCollection<Policy> | null, currentUserL
            !!policy && policy.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE && !!policy.name && !!policy.id && !!getPolicyRole(policy, currentUserLogin),
    );
 }
+
+function getPerDiemCustomUnits(policies: OnyxCollection<Policy> | null, email: string | undefined): Array<{policyID: string; customUnit: CustomUnit}> {


Suggested change

function getPerDiemCustomUnits(policies: OnyxCollection<Policy> | null, email: string | undefined): Array<{policyID: string; customUnit: CustomUnit}> {

function getPerDiemCustomUnits(policies: OnyxCollection<Policy> | null, email: string | undefined): Array<{policyID: string; customUnit: CustomUnit | undefined}> {

By doing this way, we don't need to cast the result

Hmm, I assume that as a result type we want to have array of objects that have a defined value of CustomUnit

dukenv0307 · 2025-02-18T03:18:38Z

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

@@ -120,8 +132,16 @@ function IOURequestStepParticipants({
        setCustomUnitRateID(transactionID, rateID);
        setMoneyRequestParticipantsFromReport(transactionID, selfDMReport);
        const iouConfirmationPageRoute = ROUTES.MONEY_REQUEST_STEP_CONFIRMATION.getRoute(action, CONST.IOU.TYPE.TRACK, transactionID, selfDMReportID);
-        Navigation.navigate(iouConfirmationPageRoute);
-    }, [action, selfDMReport, selfDMReportID, transactionID]);
+        waitForKeyboardDismiss(() => {


Why do we need waitForKeyboardDismiss here?

If we type a participant from the keyboard and select it, we want to first close the keyboard and then navigate

dukenv0307 · 2025-02-18T03:41:16Z