[$250] Remove MoneyRequestDatePage.js and copy any changes since Nov 27 into IOURequestStepDate.js #34608

tgolen · 2024-01-16T20:49:20Z

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: MoneyRequestDatePage
New Component IOURequestStepDate

Solution

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

Look at the history of the Old Component
If there are any changes since Nov 27, 2023 which have not been added to the New Component, copy those changes
Replace all uses of the Old Component with the New Component
Remove all traces of Old Component
Be sure to update all routes and navigation to use the new :action param (instead of being hard-coded with "create")
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/~0155d041c50cef598e
Upwork Job ID: 1747632794805731328
Last Price Increase: 2024-01-24
Automatic offers:

DylanDylann | Contributor | 28130672
brunovjk | Contributor | 28132561

The text was updated successfully, but these errors were encountered:

melvin-bot · 2024-01-16T20:49:25Z

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

Krishna2323 · 2024-01-16T22:02:23Z

Proposal

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

Remove MoneyRequestDatePage.js and copy any changes since Nov 27 into IOURequestStepDate.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. There are total 7 commits after 27th Nov in the old component and most of them are about renaming constants and DatePicker component and imports.

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

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

Line 98 in a7a3e7f

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

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 430 in a2f5bd5

[SCREENS.MONEY_REQUEST.DATE]: ROUTES.MONEY_REQUEST_DATE.route,

App/src/libs/Navigation/types.ts

Line 198 in a2f5bd5

[SCREENS.MONEY_REQUEST.DATE]: {

Note: The below 2 steps can be omitted because we only use IOURequestStepDate for IOU creation flow.

Need to update to :action here:

App/src/ROUTES.ts

Line 338 in a2f5bd5

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

Need to pass the action here:

App/src/components/MoneyTemporaryForRefactorRequestConfirmationList.js

Line 775 in a2f5bd5

Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_DATE.getRoute(iouType, transaction.transactionID, reportID, Navigation.getActiveRouteWithoutParams()));

Result

njmulsqb · 2024-01-17T01:38:37Z

I would love to take this!

melvin-bot · 2024-01-17T14:51:44Z

Job added to Upwork: https://www.upwork.com/jobs/~0155d041c50cef598e

melvin-bot · 2024-01-17T14:51:50Z

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

ghost · 2024-01-17T14:55:41Z

I want to work on it

ishpaul777 · 2024-01-17T14:58:47Z

Would love to work on this

ghost · 2024-01-17T15:14:29Z

Proposal

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

Remove MoneyRequestDatePage.js and copy any changes since Nov 27 into IOURequestStepDate.js

What is the root cause of that problem?

The main changes are in the DatePicker that has been added in the old component after 27th November 2023,

App/src/pages/iou/MoneyRequestDatePage.js

Lines 103 to 105 in 3033f99

    
           <InputWrapper 
        
               InputComponent={DatePicker} 
        
               inputID="moneyRequestCreated"

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

In the new component i.e. here https://github.com/Expensify/App/blob/main/src/pages/iou/request/IOURequestStartPage.js, we will add DatePicker and update the component accordingly.

dukenv0307 · 2024-01-17T15:28:29Z

Proposal

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

Remove MoneyRequestDatePage.js and copy any changes since Nov 27 into IOURequestStepDate.js

What is the root cause of that problem?

This is a refactor

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

Look at the history of the Old Component
If there are any changes since Nov 27, 2023 which have not been added to the New Component, copy those changes

The history change here: https://github.com/Expensify/App/blob/main/src/pages/iou/MoneyRequestDatePage.js

We have had some changes since Nov 27, 2023 but it's the refactor change and has already been applied in IOURequestStepDate. So no need to change here.

Replace all uses of the Old Component with the New Component
Remove all traces of Old Component

MoneyRequestDatePage isn't used in any component so we don't need to have any updates here.

We only need to remove MoneyRequestDatePage in ModalStackNavigators, remove .MONEY_REQUEST.DATE from SCREENS, and remove MONEY_REQUEST_DATE route

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

Line 98 in a8acf44

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

Be sure to update all routes and navigation to use the new :action param (instead of being hard-coded with "create")

Update the getRoute function with an extra param action and return it instead of always returning create

getRoute: (action: ValueOf<typeof CONST.IOU.ACTION>, iouType: ValueOf<typeof CONST.IOU.TYPE>, transactionID: string, reportID: string, backTo: string) =>
            getUrlWithBackToParam(`${action}/${iouType}/date/${transactionID}/${reportID}`, backTo),

App/src/ROUTES.ts

Lines 339 to 340 in a8acf44

    
           getRoute: (iouType: ValueOf<typeof CONST.IOU.TYPE>, transactionID: string, reportID: string, backTo = '') => 
        
               getUrlWithBackToParam(`create/${iouType}/date/${transactionID}/${reportID}`, backTo),

Update any logic like isEditing to use the new action param from the route

OPTIONAL: Re-use IOURequestStepDate for the edit case and remove EditRequestDatePage. We can get the action from the route param to update the logic when saving the date accordingly.

To handle updateDate function for edit case we can re-use the logic of saveDate in EditRequestPage.

And when we click on the date option in MoneyRequestView we will navigate to the route of IOURequestStepDate with action param is edit.

What alternative solutions did you explore? (Optional)

NA

melvin-bot · 2024-01-17T17:57:04Z

Upwork job price has been updated to $250

Krishna2323 · 2024-01-23T10:35:22Z

Proposal Updated

Added a note about why should we not include the action param.

sobitneupane · 2024-01-24T02:50:30Z

@muttmuure I won't be able to review proposals before weekend. Please feel free to reassign the issue if it is urgent.

DylanDylann · 2024-01-24T04:22:40Z

@muttmuure I have context with this Epic in here. I am happy to take this one as a C+ contributor

dukenv0307 · 2024-01-24T10:21:21Z

Updated proposal to remove EditRequestDatePage.

melvin-bot · 2024-01-24T16:00:36Z

📣 It's been a week! Do we have any satisfactory proposals yet? Do we need to adjust the bounty for this issue? 💸

brunovjk · 2024-01-24T21:30:54Z

Proposal

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

This belongs to Wave 5 cleanup
Phase 2 is all about removing the original components and any of the duplicated efforts.

What is the root cause of that problem?

Replace MoneyRequestDatePage and EditRequestCreatedPage to IOURequestStepDate. This new component will handle both the create and edit flow based on action param.

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

Look at the history of the Old Component
If there are any changes since Nov 27, 2023 which have not been added to the New Component, copy those changes

Checked the 7 commits made to the MoneyRequestDatePage component since 27-Nov. IOURequestStepDate is already updated with those changes. This way there will be no need to arrange any changes from MoneyRequestDatePage to be transferred to IOURequestStepDate

Replace all uses of the Old Component with the New Component
Remove all traces of Old Component

There is no use of the component other than ModalStackNavigators. We must remove the MoneyRequestDatePage component along with:

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

Line 98 in f56f180

[SCREENS.MONEY_REQUEST.DATE]: () => require('../../../pages/iou/MoneyRequestDatePage').default as React.ComponentType,
The new component uses STEP_DATE and has it own linkingConfig, SCREENS and ROUTES already configured, we must remove DATE from linkingConfig, SCREENS and ROUTES

Be sure to update all routes and navigation to use the new :action param (instead of being hard-coded with "create")

Update Type navigation according to new route and getRoute.
to

    [SCREENS.MONEY_REQUEST.STEP_DATE]: {
        iouType: string;
        transactionID: string;
        reportID: string;
        backTo: string;
    };

Update route and getRoute to use the new :action param.

    MONEY_REQUEST_STEP_DATE: {
        route: ':action/:iouType/date/:transactionID/:reportID?',
        getRoute: (action: ValueOf<typeof CONST.IOU.ACTION>, iouType: ValueOf<typeof CONST.IOU.TYPE>, transactionID: string, reportID: string, backTo = '') =>
            getUrlWithBackToParam(`${action}/${iouType}/date/${transactionID}/${reportID}`, backTo),
    },

Add CONST.IOU.ACTION.CREATE at MoneyTemporaryForRefactorRequestConfirmationList to follow ROUTES.MONEY_REQUEST_STEP_DATE changes.

Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_DATE.getRoute(CONST.IOU.ACTION.CREATE, iouType, transaction.transactionID, reportID, Navigation.getActiveRouteWithoutParams()));

Update any logic like isEditing to use the new action param from the route

Update MoneyRequestView to follow ROUTES.MONEY_REQUEST_STEP_DATE changes.

Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_DATE.getRoute(CONST.IOU.ACTION.EDIT, CONST.IOU.TYPE.REQUEST, transaction.transactionID, report.reportID, Navigation.getActiveRouteWithoutParams()))

Add an isDraft variable to control if we are CREATing or EDITing. Update IOURequestStepDate.js to accommodate the CREATE, EDIT and SPLIT_EDIT of the Date field. We need to use IOU.updateMoneyRequestDate as was done in EditRequestPage and setDraftSplitTransaction like EditSplitBillPage. Something like:

    route: {
        params: {iouType, action, reportID, transactionID, backTo},
    },
...
const isDraft = action === CONST.IOU.ACTION.CREATE;
...
    Navigation.goBack(isDraft && backTo || ROUTES.HOME);
...
const updateDate = (value) => {
    const newDate = value.moneyRequestCreated.trim();
    if (newDate === transaction.created) {
        navigateBack();
        return;
    }
    if (iouType === CONST.IOU.TYPE.SPLIT && action === CONST.IOU.ACTION.EDIT) {
        IOU.setDraftSplitTransaction(transaction.transactionID, {newDate});
        navigateBack();
        return;
    }
    IOU.setMoneyRequestCreated_temporaryForRefactor(transactionID, newDate, isDraft);

    if (action === CONST.IOU.ACTION.EDIT) {
        IOU.updateMoneyRequestDate(transactionID, reportID, newDate);
    }
    navigateBack();
};

Update setMoneyRequestCreated_temporaryForRefactor to use isDraft :

...
 * @param {Boolean} isDraft - Indicates whether it's a draft or not
 */
function setMoneyRequestCreated_temporaryForRefactor(transactionID, created, isDraft) {
    const key = isDraft ? ONYXKEYS.COLLECTION.TRANSACTION_DRAFT : ONYXKEYS.COLLECTION.TRANSACTION;
    Onyx.merge(`${key}${transactionID}`, {created});
}

We need to remove any related EDIT_SPLIT_BILL.getRoute

App/src/components/MoneyTemporaryForRefactorRequestConfirmationList.js

Line 786 in aaa658f

Navigation.navigate(ROUTES.EDIT_SPLIT_BILL.getRoute(reportID, reportActionID, CONST.EDIT_REQUEST_FIELD.DATE));

Note: At the PR we double check all (ROUTES.MONEY_REQUEST_STEP_DATE.getRoute(... and EDIT_SPLIT_BILL.getRoute used at Date/Created flow.

What alternative solutions did you explore? (Optional)

N/A

melvin-bot · 2024-01-29T15:43:20Z

@sobitneupane, @muttmuure Huh... This is 4 days overdue. Who can take care of this?

melvin-bot · 2024-01-31T02:46:39Z

Triggered auto assignment to @tgolen, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

brunovjk · 2024-01-31T09:41:02Z

@brunovjk's proposal cover all cases

thank you @DylanDylann, It looks like you copied the link to my proposal wrong hehe Anyway, I'm going to start working on the PR for review

DylanDylann · 2024-01-31T09:42:40Z

It looks like you copied the link to my proposal wrong hehe

Thanks. Updated 😄

DylanDylann · 2024-01-31T09:44:03Z

@brunovjk Please wait to be assigned official before implementing PR

brunovjk · 2024-01-31T10:09:15Z

@brunovjk Please wait to be assigned official before implementing PR

Nice! Thanks!!!

melvin-bot · 2024-01-31T14:44:19Z

📣 @brunovjk 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job
Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

tgolen · 2024-01-31T14:45:34Z

@brunovjk I think these changes also need to be included in your PR:

Remove IOU.setMoneyRequestCreated() and all references
Rename IOU.setMoneyRequestCreated_temporaryForRefactor() to IOU.setMoneyRequestCreated()

brunovjk · 2024-01-31T17:02:31Z

Im on it @tgolen, thank you. PR will be ready for review by 07/02

DylanDylann · 2024-02-05T15:35:01Z

@brunovjk Please raise a PR soon

brunovjk · 2024-02-05T16:40:51Z

@DylanDylann I'm working on it right now, but I'm having a problem with 'edit/split'. In your PRs ( #35641 and #35137) I saw that you 'hard coded' the 'ioutype' in MoneyRequestView.tsx:

getRoute(
                                         CONST.IOU.ACTION.EDIT,
                                         CONST.IOU.TYPE.REQUEST,

I thought that we needed to pass a dynamic iouType. Like we do it at MoneyTemporaryForRefactorRequestConfirmationList.

/create/request/date/, /edit/request/date/ and /create/split/date/ works fine. I'm 100% into it now, as soon I get the /edit/split/date/ I will raise the PR.

DylanDylann · 2024-02-05T16:50:31Z

As I know MoneyRequestView.tsx is only used for REQUEST flow, and isn't used in SPLIT_BILL flow. It is the reason why I hardcoded CONST.IOU.TYPE.REQUEST

brunovjk · 2024-02-05T16:51:37Z

Awesome! Thank you :D

brunovjk · 2024-02-05T20:33:03Z

@DylanDylann The PR is ready for review, but I found a bug, also reproduced on 'staging' that I believe needs to be resolved so that the 'date' flow is perfect, I didn't find a related issue. In PR I bring more information.

DylanDylann · 2024-02-20T14:31:33Z

@muttmuure The PR was deployed to production 5 days ago. It seems the automation bot doesn't work on this issue. Please help to move forward this one

brunovjk · 2024-02-21T23:36:08Z

@muttmuure 👉👈

muttmuure · 2024-02-27T15:18:18Z

All paid up

melvin-bot · 2024-03-11T14:08:59Z

⚠️ Looks like this issue was linked to a Deploy Blocker here

If you are the assigned CME please investigate whether the linked PR caused a regression and leave a comment with the results.

If a regression has occurred and you are the assigned CM follow the instructions here.

If this regression could have been avoided please consider also proposing a recommendation to the PR checklist so that we can avoid it in the future.

tgolen added Engineering Daily KSv2 Help Wanted Apply this label when an issue is open to proposals by contributors Bug Something is broken. Auto assigns a BugZero manager. labels Jan 16, 2024

melvin-bot bot assigned muttmuure Jan 16, 2024

tgolen mentioned this issue Jan 16, 2024

[HOLD for payment 2024-05-22] [LOW] Distance: PHASE 2 CLEANUP - Refactor navigation among screens related to money request features #29107

Closed

25 tasks

tgolen added the External Added to denote the issue can be worked on by a contributor label Jan 17, 2024

melvin-bot bot changed the title ~~Remove MoneyRequestDatePage.js and copy any changes since Nov 27 into IOURequestStepDate.js~~ [$500] Remove MoneyRequestDatePage.js and copy any changes since Nov 27 into IOURequestStepDate.js Jan 17, 2024

melvin-bot bot assigned sobitneupane Jan 17, 2024

mountiny changed the title ~~[$500] Remove MoneyRequestDatePage.js and copy any changes since Nov 27 into IOURequestStepDate.js~~ [$250] Remove MoneyRequestDatePage.js and copy any changes since Nov 27 into IOURequestStepDate.js Jan 17, 2024

melvin-bot bot added the Overdue label Jan 19, 2024

melvin-bot bot removed the Overdue label Jan 24, 2024

melvin-bot bot added the Overdue label Jan 29, 2024

melvin-bot bot assigned tgolen Jan 31, 2024

tgolen assigned brunovjk Jan 31, 2024

DylanDylann mentioned this issue Feb 2, 2024

remove MoneyRequestCategoryPage and refactor route #35458

Merged

50 tasks

melvin-bot bot added the Overdue label Feb 5, 2024

melvin-bot bot removed the Overdue label Feb 5, 2024

brunovjk mentioned this issue Feb 5, 2024

Fix/34608: Remove old CreatedPage #35853

Merged

49 tasks

melvin-bot bot added Reviewing Has a PR in review Weekly KSv2 and removed Daily KSv2 labels Feb 5, 2024

muttmuure added Daily KSv2 and removed Weekly KSv2 labels Feb 27, 2024

muttmuure closed this as completed Feb 27, 2024

DylanDylann mentioned this issue Mar 11, 2024

[HOLD for payment 2024-03-20] [HOLD for payment 2024-03-19] [$500] Tag - Tag list shows old tag as selected when newer tag is selected in Split scan request #38042

Closed

6 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[$250] Remove MoneyRequestDatePage.js and copy any changes since Nov 27 into IOURequestStepDate.js #34608

[$250] Remove MoneyRequestDatePage.js and copy any changes since Nov 27 into IOURequestStepDate.js #34608

tgolen commented Jan 16, 2024 •

edited by melvin-bot bot

Loading

melvin-bot bot commented Jan 16, 2024

Krishna2323 commented Jan 16, 2024 •

edited

Loading

njmulsqb commented Jan 17, 2024

melvin-bot bot commented Jan 17, 2024

melvin-bot bot commented Jan 17, 2024

ghost commented Jan 17, 2024

ishpaul777 commented Jan 17, 2024

ghost commented Jan 17, 2024 •

edited by ghost

Loading

dukenv0307 commented Jan 17, 2024 •

edited

Loading

melvin-bot bot commented Jan 17, 2024

Krishna2323 commented Jan 23, 2024

sobitneupane commented Jan 24, 2024

DylanDylann commented Jan 24, 2024

dukenv0307 commented Jan 24, 2024

melvin-bot bot commented Jan 24, 2024

brunovjk commented Jan 24, 2024 •

edited

Loading

melvin-bot bot commented Jan 29, 2024

melvin-bot bot commented Jan 31, 2024

brunovjk commented Jan 31, 2024 •

edited

Loading

DylanDylann commented Jan 31, 2024 •

edited

Loading

DylanDylann commented Jan 31, 2024

brunovjk commented Jan 31, 2024

melvin-bot bot commented Jan 31, 2024

tgolen commented Jan 31, 2024 •

edited

Loading

brunovjk commented Jan 31, 2024

DylanDylann commented Feb 5, 2024

brunovjk commented Feb 5, 2024

DylanDylann commented Feb 5, 2024

brunovjk commented Feb 5, 2024

brunovjk commented Feb 5, 2024

DylanDylann commented Feb 20, 2024 •

edited

Loading

brunovjk commented Feb 21, 2024

muttmuure commented Feb 27, 2024

melvin-bot bot commented Mar 11, 2024

[$250] Remove MoneyRequestDatePage.js and copy any changes since Nov 27 into IOURequestStepDate.js #34608

[$250] Remove MoneyRequestDatePage.js and copy any changes since Nov 27 into IOURequestStepDate.js #34608

Comments

tgolen commented Jan 16, 2024 • edited by melvin-bot bot Loading

Problem

Solution

melvin-bot bot commented Jan 16, 2024

Krishna2323 commented Jan 16, 2024 • edited Loading

Proposal

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

What is the root cause of that problem?

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

Result

njmulsqb commented Jan 17, 2024

melvin-bot bot commented Jan 17, 2024

melvin-bot bot commented Jan 17, 2024

ghost commented Jan 17, 2024

ishpaul777 commented Jan 17, 2024

ghost commented Jan 17, 2024 • edited by ghost Loading

Proposal

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

What is the root cause of that problem?

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

dukenv0307 commented Jan 17, 2024 • edited Loading

Proposal

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

What is the root cause of that problem?

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

What alternative solutions did you explore? (Optional)

melvin-bot bot commented Jan 17, 2024

Krishna2323 commented Jan 23, 2024

Proposal Updated

sobitneupane commented Jan 24, 2024

DylanDylann commented Jan 24, 2024

dukenv0307 commented Jan 24, 2024

melvin-bot bot commented Jan 24, 2024

brunovjk commented Jan 24, 2024 • edited Loading

Proposal

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

What is the root cause of that problem?

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

What alternative solutions did you explore? (Optional)

melvin-bot bot commented Jan 29, 2024

melvin-bot bot commented Jan 31, 2024

brunovjk commented Jan 31, 2024 • edited Loading

DylanDylann commented Jan 31, 2024 • edited Loading

DylanDylann commented Jan 31, 2024

brunovjk commented Jan 31, 2024

melvin-bot bot commented Jan 31, 2024

tgolen commented Jan 31, 2024 • edited Loading

brunovjk commented Jan 31, 2024

DylanDylann commented Feb 5, 2024

brunovjk commented Feb 5, 2024

DylanDylann commented Feb 5, 2024

brunovjk commented Feb 5, 2024

brunovjk commented Feb 5, 2024

DylanDylann commented Feb 20, 2024 • edited Loading

brunovjk commented Feb 21, 2024

muttmuure commented Feb 27, 2024

melvin-bot bot commented Mar 11, 2024

tgolen commented Jan 16, 2024 •

edited by melvin-bot bot

Loading

Krishna2323 commented Jan 16, 2024 •

edited

Loading

ghost commented Jan 17, 2024 •

edited by ghost

Loading

dukenv0307 commented Jan 17, 2024 •

edited

Loading

brunovjk commented Jan 24, 2024 •

edited

Loading

brunovjk commented Jan 31, 2024 •

edited

Loading

DylanDylann commented Jan 31, 2024 •

edited

Loading

tgolen commented Jan 31, 2024 •

edited

Loading

DylanDylann commented Feb 20, 2024 •

edited

Loading