[HOLD for payment 2024-11-26] [$250] IOU - Payment option not updated in IOU details when it changed on IOU preview

[IuliiaHerets]

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

---

Version Number: 9.0.49.0
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail: https://expensify.testrail.io/index.php?/tests/view/5087309
Issue reported by: Applause Internal Team

Action Performed:

Precondition: user B sent an IOU to user A

1. Go to https://staging.new.expensify.com/ and log in as user A
2. Navigate to 1:1 chat with user B
3. On the IOU preview select a payment option different from the default one
4. Open the IOU details

Expected Result:

The payment option is the same on both IOU preview and IOU details

Actual Result:

The payment option does get changed on the IOU details.

Workaround:

Unknown

Platforms:

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6635794_1729028836280.Recording__866.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021848758425092470966
• Upwork Job ID: 1848758425092470966
• Last Price Increase: 2024-11-12
• Automatic offers:
• truph01 | Contributor | 104883919

Issue Owner

Current Issue Owner: @garrettmknight

[melvin-bot]

Triggered auto assignment to @garrettmknight (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[IuliiaHerets]

@garrettmknight FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

[FitseTLT]

Edited by proposal-police: This proposal was edited at 2024-10-16 16:24:58 UTC.

Proposal

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

IOU - Payment option not updated in IOU details when it changed on IOU preview

What is the root cause of that problem?

We are currently only saving the payment preference if the report is linked to some policy so it won't save the preference for a DM as in this case.

App/src/components/SettlementButton/index.tsx

Lines 247 to 250 in 4a25c36

	if (policyID === '-1') {
	return;
	}
	savePreferredPaymentMethod(policyID, option.value);

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

We can save the payment preference with chatReportID as the key/id.

App/src/components/SettlementButton/index.tsx

Lines 247 to 250 in 4a25c36

	if (policyID === '-1') {
	return;
	}
	savePreferredPaymentMethod(policyID, option.value);

  if (policyID === '-1' && !chatReportID) {
                            return;
                        }
                        savePreferredPaymentMethod(policyID !== '-1' ? policyID : chatReportID, option.value);
                   

App/src/components/SettlementButton/index.tsx

Line 68 in 4a25c36

const [lastPaymentMethod = '-1', lastPaymentMethodResult] = useOnyx(ONYXKEYS.NVP_LAST_PAYMENT_METHOD, {selector: (paymentMethod) => paymentMethod?.[policyID]});

const [lastPaymentMethod = '-1', lastPaymentMethodResult] = useOnyx(ONYXKEYS.NVP_LAST_PAYMENT_METHOD, {
        selector: (paymentMethod) => paymentMethod?.[policyID === '-1' ? chatReportID : policyID],
    });

App/src/libs/actions/IOU.ts

Line 6800 in 4a25c36

value: {[iouReport?.policyID ?? '-1']: paymentMethodType},

        value: {[iouReport?.policyID ?? chatReport.reportID ?? '-1']: paymentMethodType},

What alternative solutions did you explore? (Optional)

We can also save one payment preference for all non-workspace chats and in that case we can save the preference with the same key for all chats and access it with the key accordingly.

[truph01]

Edited by proposal-police: This proposal was edited at 2024-10-17 12:40:22 UTC.

Proposal

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

The payment option does get changed on the IOU details.

What is the root cause of that problem?

• We already have a logic to save the prefered payment option method:

App/src/components/SettlementButton/index.tsx

Lines 246 to 251 in 4a25c36

	onOptionSelected={(option) => {
	if (policyID === '-1') {
	return;
	}
	savePreferredPaymentMethod(policyID, option.value);
	}}

• With the DM, the above policyID is _FAKE_, so we stored something like _FAKE_ : "Expensify".

• Then we open the IOU detail. In here, we get the saved preferred payment method:

App/src/components/SettlementButton/index.tsx

Line 68 in 4a25c36

const [lastPaymentMethod = '-1', lastPaymentMethodResult] = useOnyx(ONYXKEYS.NVP_LAST_PAYMENT_METHOD, {selector: (paymentMethod) => paymentMethod?.[policyID]});

• In here, the policyID point to the personal policy of the user B - who sent the expense. As a result, the lastPaymentMethod is undefined and we fallback to -1.

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

• In there, introduce a new variable to check whether the report belongs to workspace:

    const policyEmployeeAccountIDs = policyID ? getPolicyEmployeeAccountIDs(policyID) : [];
    const reportBelongsToWorkspace = policyID ? ReportUtils.doesReportBelongToWorkspace(chatReport, policyEmployeeAccountIDs, policyID) : false;

• And update:

App/src/components/SettlementButton/index.tsx

Line 250 in 4a25c36

savePreferredPaymentMethod(policyID, option.value);

                        const policyIDKey = reportBelongsToWorkspace ? policyID : CONST.POLICY.ID_FAKE;
                        savePreferredPaymentMethod(policyIDKey, option.value);

• Finally, update the useOnyx function:
  

  App/src/components/SettlementButton/index.tsx

  Line 68 in 4a25c36

  const [lastPaymentMethod = '-1', lastPaymentMethodResult] = useOnyx(ONYXKEYS.NVP_LAST_PAYMENT_METHOD, {selector: (paymentMethod) => paymentMethod?.[policyID]});

    const policyEmployeeAccountIDs = policyID ? getPolicyEmployeeAccountIDs(policyID) : [];
    const reportBelongsToWorkspace = policyID ? ReportUtils.doesReportBelongToWorkspace(chatReport, policyEmployeeAccountIDs, policyID) : false;
    const policyIDKey = reportBelongsToWorkspace ? policyID : CONST.POLICY.ID_FAKE;
    const [lastPaymentMethod = '-1', lastPaymentMethodResult] = useOnyx(ONYXKEYS.NVP_LAST_PAYMENT_METHOD, {selector: (paymentMethod) => paymentMethod?.[policyIDKey]});
 

• Same logic should be applied in here:
  

  App/src/libs/actions/IOU.ts

  Line 6800 in 4a25c36

  value: {[iouReport?.policyID ?? '-1']: paymentMethodType},

  
  to make sure the paymentMethodType data is saved with the proper policy key.

What alternative solutions did you explore? (Optional)

• Beside saving the prefered payment method in case of DM to CONST.POLICY.ID_FAKE, we can also save to personal policyID of the current user or another key, such as 'default', 'dm', ...

[truph01]

Proposal updated

[melvin-bot]

@garrettmknight Huh... This is 4 days overdue. Who can take care of this?

[melvin-bot]

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

[melvin-bot]

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

[garrettmknight]

This is an inconsistency we can fix, but it's not attached to any project so if it requires any internal/backend changes, I'll close, but if we can complete entirely externally I'm cool with fixing.

[FitseTLT]

This is an inconsistency we can fix, but it's not attached to any project so if it requires any internal/backend changes, I'll close, but if we can complete entirely externally I'm cool with fixing.

It's totally about saving preference in FE @garrettmknight don't worry 👍

[Ollyws]

In here, the policyID point to the personal policy of the user B - who sent the expense. As a result, the lastPaymentMethod is undefined and we fallback to -1.

@truph01
For me the problem is occuring because the chat report has no policyID, while the IOU report for some reason does despite it not being on a workspace.
Why does the IOU report have a policyID here atall?

Screen.Recording.2024-10-23.at.15.57.08.mov

[melvin-bot]

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

[melvin-bot]

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

[melvin-bot]

@garrettmknight @Ollyws this issue was created 2 weeks ago. Are we close to approving a proposal? If not, what's blocking us from getting this issue assigned? Don't hesitate to create a thread in #expensify-open-source to align faster in real time. Thanks!

[melvin-bot]

@garrettmknight, @Ollyws Still overdue 6 days?! Let's take care of this!

[garrettmknight]

@truph01 any response to @Ollyws ?

[truph01]

For me the problem is occuring because the chat report has no policyID, while the IOU report for some reason does despite it not being on a workspace.

@Ollyws When A submits an expense to B: for the chat report, the policyID is set to _FAKE_, whereas for the IOU report, the policyID refers to A's personal policy. I’m not sure why the data is stored this way, but it seems intentional.

[melvin-bot]

📣 @truph01 🎉 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 📖

[jasperhuangg]

Apologies for the delay, have had my hands full with a #migrate implementation, reviewed the proposal and agree that it should work, thanks!

[truph01]

PR is ready

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 9.0.63-3 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• fix: Payment option not updated in IOU details when it changed on IOU preview #52539

If no regressions arise, payment will be issued on 2024-11-26. 🎊

For reference, here are some details about the assignees on this issue:

• @Ollyws requires payment through NewDot Manual Requests
• @truph01 requires payment automatic offer (Contributor)

[melvin-bot]

@Ollyws @garrettmknight @Ollyws The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed. Please copy/paste the BugZero Checklist from here into a new comment on this GH and complete it. If you have the K2 extension, you can simply click: [this button]

[garrettmknight]

@Ollyws please complete the checklist.

[garrettmknight]

Payment Summary:

• Contributor: @truph01 paid $250 via upwork
• Contributor+: @Ollyws $250 via NewDot once checklist is complete.

[Ollyws]

BugZero Checklist:

• [Contributor] Classify the bug:

Bug classification

Source of bug:

• 1a. Result of the original design (eg. a case wasn't considered)
• 1b. Mistake during implementation
• 1c. Backend bug
• 1z. Other:

Where bug was reported:

• 2a. Reported on production
• 2b. Reported on staging (deploy blocker)
• 2c. Reported on both staging and production
• 2d. Reported on a PR
• 2z. Other:

Who reported the bug:

• 3a. Expensify user
• 3b. Expensify employee
• 3c. Contributor
• 3d. QA
• 3z. Other:

• [Contributor] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake.

  Link to comment:

• [Contributor] If the regression was CRITICAL (e.g. interrupts a core flow) A discussion in #expensify-open-source has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner.

  Link to discussion:

• [Contributor] If it was decided to create a regression test for the bug, please propose the regression test steps using the template below to ensure the same bug will not reach production again.

Regression Test Proposal Template

• [BugZero Assignee] Create a GH issue for creating/updating the regression test once above steps have been agreed upon.

  Link to issue:

Regression Test Proposal

Precondition:

Test:

1. Log in as user A
2. Navigate to 1:1 chat with user B
3. On the IOU preview select a payment option different from the default one
4. Open the IOU details
5. Verify the payment option is the same on both IOU preview and IOU details

Do we agree 👍 or 👎

[Ollyws]

Requested in ND.

[melvin-bot]

@garrettmknight, @Ollyws, @jasperhuangg, @truph01 Eep! 4 days overdue now. Issues have feelings too...

[garrettmknight]

Awaiting updated payment summary.

[JmillsExpensify]

Confirming this payment summary is accurate:

• Contributor: @truph01 paid $250 via upwork
• Contributor+: @Ollyws $250 via NewDot

[garrettmknight]

$250 approved for @Ollyws