[$250] Remove MoneyRequestParticipantsPage.js and copy any changes since Nov 27 into IOURequestStepParticipants.js

[tgolen]

This is a part of #29107. You can look at that issue for more context behind the cleanup process.

Problem

The app has two redundant components:

Old Component: MoneyRequestParticipantsPage
New Component IOURequestStepParticipants

Solution

Following the examples (example 1, example 2), the Old Component needs to be completely removed from the codebase

1. Look at the history of the Old Component
2. If there are any changes since Nov 27, 2023 which have not been added to the New Component, copy those changes
3. Replace all uses of the Old Component with the New Component
4. Remove all traces of Old Component
5. Be sure to update all routes and navigation to use the new :action param (instead of being hard-coded with "create")
6. Update any logic like isEditing to use the new action param from the route

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~015fc3b79f31f2289a
• Upwork Job ID: 1747632960650227712
• Last Price Increase: 2024-01-24
• Automatic offers:
• abdulrahuman5196 | Reviewer | 28131654
• Krishna2323 | Contributor | 28131655

[melvin-bot]

Triggered auto assignment to @isabelastisser (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[Krishna2323]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Remove MoneyRequestParticipantsPage.js and copy any changes since Nov 27 into IOURequestStepParticipants.js

What is the root cause of that problem?

Component update

What changes do you think we should make in order to solve the problem?

I checked all the commits after 27th Nov and the new component is updated according to the old component, we just need to remove the file and route created for it. I checked the commits thoroughly but will check again in the PR.

Component to remove:
https://github.com/Expensify/App/blob/main/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js

App/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx

Line 96 in 93e68b5

[SCREENS.MONEY_REQUEST.CONFIRMATION]: () => require('../../../pages/iou/steps/MoneyRequestConfirmPage').default as React.ComponentType,

We only use MoneyRequestParticipantsPage as a screen and we already replaced the route with IOURequestStepParticipants, so we don't have any instances to replace.

We also need to remove all traces from src/libs/Navigation/types.ts & src/libs/Navigation/linkingConfig.ts:

App/src/libs/Navigation/linkingConfig.ts

Line 428 in a2f5bd5

[SCREENS.MONEY_REQUEST.PARTICIPANTS]: ROUTES.MONEY_REQUEST_PARTICIPANTS.route,

App/src/libs/Navigation/types.ts

Line 184 in a2f5bd5

[SCREENS.MONEY_REQUEST.PARTICIPANTS]: {

We will update to :action param here:

App/src/ROUTES.ts

Line 358 in a2f5bd5

route: 'create/:iouType/participants/:transactionID/:reportID',

We are using ROUTES.MONEY_REQUEST_STEP_PARTICIPANTS.getRoute from several places so we need to add action accordingly:

App/src/pages/iou/request/step/IOURequestStepAmount.js

Line 128 in a2f5bd5

Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_PARTICIPANTS.getRoute(iouType, transactionID, reportID));

App/src/pages/iou/request/step/IOURequestStepConfirmation.js

Line 127 in a2f5bd5

Navigation.goBack(ROUTES.MONEY_REQUEST_STEP_PARTICIPANTS.getRoute(iouType, transactionID, reportID));

App/src/pages/iou/request/step/IOURequestStepDistance.js

Line 128 in a2f5bd5

Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_PARTICIPANTS.getRoute(iouType, transactionID, reportID));

App/src/pages/iou/request/step/IOURequestStepTaxAmountPage.js

Line 117 in a2f5bd5

Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_PARTICIPANTS.getRoute(iouType, transactionID, reportID));

App/src/pages/iou/request/step/IOURequestStepScan/index.js

Line 126 in a2f5bd5

Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_PARTICIPANTS.getRoute(iouType, transactionID, reportID));

App/src/pages/iou/request/step/IOURequestStepScan/index.native.js

Line 140 in a2f5bd5

Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_PARTICIPANTS.getRoute(iouType, transactionID, reportID));

_Navigation to old component that needs to be updated to MONEY_REQUEST_STEP_SCAN _

App/src/libs/actions/IOU.js

Line 3683 in 08e9276

Navigation.navigate(ROUTES.MONEY_REQUEST_PARTICIPANTS.getRoute(iouType));

App/src/pages/iou/steps/MoneyRequestConfirmPage.js

Line 153 in 08e9276

fallback = ROUTES.MONEY_REQUEST_PARTICIPANTS.getRoute(iouType);

Note: The below action param step can be omitted because we only use IOURequestStepParticipants for IOU creation flow.

Result

[njmulsqb]

I would love to take this!

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~015fc3b79f31f2289a

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @0xmiroslav (External)

[MahmudjonToraqulov]

I would love to take this!

[ghost]

Dibs

[melvin-bot]

Upwork job price has been updated to $250

[Krishna2323]

Proposal Updated

Added a not about replacing the instances of the old component.

[isabelastisser]

@0xmiroslav, can you please review the proposal above? Thanks!

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @abdulrahuman5196 (External)

[mallenexpensify]

@abdulrahuman5196 reassigning, please take over as C+. If you don't have bandwidth, unassign yourself. Thanks

[mountiny]

@Krishna2323 I have seen you post proposals on other issues, can you please give ETA for this PR or I will reassign to someone else tomorrow. Thank you

[Krishna2323]

@mountiny, sorry for the delay, I believe we should wait for #35455 to be merged because similar PRs caused regressions, and I don't want this one to cause a regression. Therefore, I suggest we update the IOU flow sequence accordingly.

Will try again to have a look if we could get this done without waiting for that one.

[Krishna2323]

@abdulrahuman5196, we need to wait until this gets merged & these #34614 #34610 are merged because we will be using IOURequestStepParticipants for edit flows also so we need to pass the correct action from IOURequestStepAmount & IOURequestStepDistance.

cc: @mountiny

edit: Will raise a PR by EOD.

[Krishna2323]

@abdulrahuman5196, PR is up but as I said we need to wait for #35455 to get merged, because the send money flow still uses old components/routes.

send_flow_participants.mp4

[abdulrahuman5196]

Got it. I agree we could wait for the PR, to avoid cross conflicts given this is LOW priority.

@Krishna2323 since you are owner of the PR as well, kindly do update us once the PR is ready for review.

[Krishna2323]

Sure!

[melvin-bot]

This issue has not been updated in over 15 days. @isabelastisser, @mountiny, @abdulrahuman5196, @Krishna2323 eroding to Monthly issue.

P.S. Is everyone reading this sure this is really a near-term priority? Be brave: if you disagree, go ahead and close it out. If someone disagrees, they'll reopen it, and if they don't: one less thing to do!

[isabelastisser]

@Krishna2323 @abdulrahuman5196 what's the next step here?

[Krishna2323]

#35455 is still in progress. I'm the author of that PR also, and we are very close to merging it.

[Krishna2323]

#35455 is merged, will be raising PR for this very soon.

[DylanDylann]

@Krishna2323 Could you speed-up this issue to unblock other issues

[Krishna2323]

Sorry for delay, started working on the PR, will be ready for review today.

[Krishna2323]

@abdulrahuman5196, the PR is ready for review. I haven't added recordings yet because I believe we should incorporate all required/suggested changes first. What do you think? I recently encountered a regression because I updated the code after the recordings were uploaded. The updated code had an issue that could have been easily identified during recordings.

[isabelastisser]

Hey @abdulrahuman5196, can you please provide an update? Thanks!

[mountiny]

Asked in slack too https://expensify.slack.com/archives/C02NK2DQWUX/p1711752832574839

[Krishna2323]

@isabelastisser, PR was deployed to production on 24th April, I think this is ready for payments process.

[isabelastisser]

@Krishna2323 and @abdulrahuman5196, please accept the offers in Upwork and I will process the payments. Thanks!

[Krishna2323]

@isabelastisser, accepted, thanks!

[abdulrahuman5196]

@isabelastisser Accepted the offer.