Pay with Expensify is shown instead of Pay with business account when all expenses are held

[jponikarchuk]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: 9.2.29-1
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught during regression testing, add the test name, ID and link from BrowserStack: https://test-management.browserstack.com/projects/2219752/test-runs/TR-1235/folder/13176872/41237339/945415001
Email or phone of affected tester (no customers): isjndoisjsijsoj@gmail.com
Issue reported by: Applause Internal Team
Device used: Mac 15.5 / Chrome
App Component: Money Requests

Action Performed:

Precondition:

• "Delay submissions" and "Add approvals" are disabled in Workflows settings.

1. Go to staging.new.expensify.com
2. Go to workspace chat.
3. Create two expenses in the workspace chat.
4. Open the expense report.
5. Click Submit.
6. Click Pay button.
   → Pay with business account button is shown.
7. Click More > Retract.
8. Select both expenses via checkbox.
9. Click More > Hold.
10. Enter reason and save it.
11. Click on Submit button.
12. Click More > Pay.

Expected Result:

Pay with business account button will be shown.

Actual Result:

Pay with Expensify is shown instead of Pay with business account when all expenses are held.

Workaround:

Unknown

Platforms:

• Android: App
• Android: mWeb Chrome
• iOS: App
• iOS: mWeb Safari
• iOS: mWeb Chrome
• Windows: Chrome
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

1.mp4

View all open jobs on GitHub

Issue Owner

Current Issue Owner: @getusha

[melvin-bot]

Triggered auto assignment to @heyjennahay (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.

[ShridharGoel]

Proposal

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

When all expenses on an expense report are on hold, the pay button offers “Pay with Expensify”. For held expenses the product copy should read “Pay with business account”, but the UI currently shows the wrong label.

What is the root cause of that problem?

The business bank account button is created in usePaymentOptions. Its label still references the wallet-specific string and icon meant for “Pay with Expensify”. This comes from the code where the VBBA option uses translate('iou.settleExpensify', …) and the wallet icon.

App/src/hooks/usePaymentOptions.ts

Lines 120 to 124 in eaa9c5c

	[CONST.IOU.PAYMENT_TYPE.VBBA]: {
	text: translate('iou.settleExpensify', {formattedAmount}),
	icon: Expensicons.Wallet,
	value: CONST.IOU.PAYMENT_TYPE.VBBA,
	},

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

Update the VBBA option to use the business translation key and building icon so the UI always shows “Pay with business account”.

[CONST.IOU.PAYMENT_TYPE.VBBA]: {
    text: translate('iou.settleBusiness', {formattedAmount}),
    icon: Expensicons.Building,
    value: CONST.IOU.PAYMENT_TYPE.VBBA,
},

[heyjennahay]

Confirming whether Pay with business account or Pay with Expensify is our standard terminology

[joekaufmanexpensify]

@hungvu193 @getusha @grgia this might be one we missed in the expenses PR a bit back. I would expect the button names for held expenses to be Pay with business account and Mark as paid with no amounts and the same icons as when the expenses are not held. Thoughts?

[melvin-bot]

@heyjennahay Eep! 4 days overdue now. Issues have feelings too...

[heyjennahay]

Bump on #72399 (comment) @hungvu193 @getusha @grgia

[hungvu193]

@getusha Please take over this one

[grgia]

Assigning