[Feature] Add merchant and date fields to manual requests

[Beamanator]

Front-end changes for this project issue: https://github.com/Expensify/Expensify/issues/295259

Currently we only show "To", "Amount", and "Description" fields for each manual request. We're in the process of also gathering "merchant" & "date" info for each request, so let's show that in the manual request confirm page:

In the near future, we'll have two new properties in transaction data:

• merchant - the original merchant data, cannot be modified
• modifiedMerchant - if the user modifies the merchant field, we'll set that data here

1. We want to show these new fields behind a “Show more” button that will toggle a new state, showAllFields.
2. When set to true, all fields will be displayed
3. When set to false, we'll show the "Show more" button with a horizontal line as in the screenshot
4. Note: For now, merchant & date fields will not be editable so we do not need the > like other push-to-page fields

Note: Needs this Auth PR to get to prod so we get merchant data in onyx transaction key: https://github.com/Expensify/Auth/pull/8325

Other note: We won't be needing Onyx at all of this 😅 (sorry for the confusion)

[melvin-bot]

Triggered auto assignment to @CortneyOfstad (NewFeature), see https://stackoverflowteams.com/c/expensify/questions/14418#:~:text=BugZero%20process%20steps%20for%20feature%20requests for more details.

[melvin-bot]

Triggered auto assignment to Design team member for new feature review - @shawnborton (NewFeature)

[lukemorawski]

Hey. It's Lucas from Callstack. Happy to work on that feature!

[Beamanator]

Thanks @lukemorawski !

[Beamanator]

Hey @lukemorawski as this is a high priority for us I've switched the priority to Daily and I'd highly appreciate daily updates on your progress iff possible 🙏

[Beamanator]

Oh and by the way @lukemorawski the Auth PR changes are now in production!

[lukemorawski]

@Beamanator Hey Alex. Got the UI ready, but need a hint on plugin in to the real data source. Where should I look for those merchant, modifiedMerchant and date fields in Onyx?

[Beamanator]

Awesome @lukemorawski ! merchant and modifiedMerchant will show up in the transactions onyx collection, and you'll only get that in money request reports - @MariaHCD @Gonals I believe that should work and it's live, right?

[lukemorawski]

@Beamanator yeah, thanks I can see that collection in Onyx and those new fields there. The problem is I can't see the a new transaction there upon creating a new money request. Perhaps I'm doing something wrong? Could please provide the user path to that screen? (sorry, I'm still a bit new to the app and it's data flow)

[Beamanator]

Yeah good question @lukemorawski ! So you don't see the transaction data in Onyx? Did you try Request Money specifically? I just tested that in staging and it works well, I can see transactions_<id> in Onyx

[lukemorawski]

No, I can see them. It's just when I'm creating a new money request, that new transaction is not yet stored in Onyx. That's why I can't access it and display those new fields.

[Beamanator]

Sorry not sure who's not being clear 😅

No, I can see them

So you do or don't see some transaction data in Onyx? 😅

[Beamanator]

Looks like we have a resolution in slack, sorry for the miscommunication :D

[lukemorawski]

The proposal is in callstack internal review

[Beamanator]

Thanks for the update @lukemorawski - would you mind letting us know when you estimate a PR will be up for this? 🙏

[lukemorawski]

@Beamanator should be ready today

[lukemorawski]

Proposal

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

We want to add new fields to the money request page - merchant and date.
Those new fields need to be hidden under the “Show more” button.
Values of those fields are taken from the “iou” object created when creating a new money request.
@reviewers

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

We need to add a simple bool state flag to the MoneyRequestConfirmationList.js and a small button with horizontal line that will toggle this flag. The flag will control the visibility of two new MenuItemWithTopDescription components.
New props would need to be introduced to the MoneyRequestConfirmationList component - one for passing the date and the other to pass the merchant value.
Those props are passed from the MoneyRequestConfirmPage component, and are taken from an Onyx subscription to ‘iou’ object
In order get the new default values in the ‘iou’ object we need to add them to the object merged in resetMoneyRequestInfo function from IOU.js. Default value for merchant is an empty string and date is current date.
In future PRs those values will be editable.

What alternative solutions did you explore? (Optional)

None.

money.request.mov

[Beamanator]

@lukemorawski so far that's looking great!

One question, more for @MariaHCD and @Gonals and @shawnborton - when a user clicks the "Show more" button, I think we want it to disappear so they can't re-hide the other fields (merchant & date), right?

[MariaHCD]

I think we want it to disappear so they can't re-hide the other fields (merchant & date)

Yes, that's my understanding as well: we want the Show more button to be hidden once it is clicked.

[lukemorawski]

@MariaHCD OK. no worries. Will update that.

[Beamanator]

Amazing, thanks @lukemorawski ! I think you're good to raise the PR whenever you can, as that tiny change we discussed above should be quick to implement 👍 🙏

[dylanexpensify]

Wooo! We're getting close to finishing this one, nice work! Now let's blast past that finish line! 🏁 💨

[melvin-bot]

This issue has not been updated in over 15 days. @shawnborton, @Beamanator, @CortneyOfstad, @lukemorawski 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!

[Beamanator]

Adding @situchan since they reviewed the PR 👍

@CortneyOfstad I'm not sure how the automation didn't work for this, but the PR was deployed to production two weeks ago 😅 So we're just waiting for payment here 👍

[dylanexpensify]

I'll take this on for Cortney! Payment coming

[dylanexpensify]

@situchan confirm for me if you're paid in NewDot?

[dylanexpensify]

Payment summary:

• Contributor+: @situchan $1,000

Upwork job. Please apply!

[situchan]

@situchan confirm for me if you're paid in NewDot?

I am using upwork. Can you please send offer?

[dylanexpensify]

Sent invite!

[dylanexpensify]

Offer sent!

[dylanexpensify]

payment sent, contract closed! ty!