[CP Staging] Fix non-reimbursable pay button options in report header#87023
[CP Staging] Fix non-reimbursable pay button options in report header#87023cristipaval merged 2 commits intomainfrom
Conversation
… header
PayPrimaryAction was missing the hasOnlyNonReimbursableTransactions check
that PayActionButton (preview) already had, causing onlyShowPayElsewhere
to be true for non-reimbursable reports. This made SettlementButton show
only "Mark as Paid" instead of also showing "Pay with Business Account".
Co-authored-by: {"message":"Not Found","documentation_url":"https://docs.github.com/rest/issues/comments#get-an-issue-comment","status":"404"} <{"message":"Not Found","documentation_url":"https://docs.github.com/rest/issues/comments#get-an-issue-comment","status":"404"}@users.noreply.github.com>
Codecov Report✅ Changes either increased or maintained existing code coverage, great job!
|
|
@situchan please go ahead and review |
| const onlyShowPayElsewhere = reportHasOnlyNonReimbursableTransactions | ||
| ? false | ||
| : !canIOUBePaid && canIOUBePaidAction(moneyRequestReport, chatReport, policy, bankAccountList, transaction ? [transaction] : undefined, true, undefined, invoiceReceiverPolicy); | ||
| const shouldShowPayButton = isPaidAnimationRunning || canIOUBePaid || onlyShowPayElsewhere || reportHasOnlyNonReimbursableTransactions; |
There was a problem hiding this comment.
This logic is duplicated in several places so maybe worth follow-up for code dry (not in this PR since this will be CP'ed to staging)
|
@MelvinBot mark as ready for review and add [CP Staging] prefix to the PR title. |
MelvinBot
changed the title
|
Done! PR is now marked as ready for review and title has been updated with the [CP Staging] prefix. |
Reviewer Checklist
Screenshots/VideosAndroid: HybridAppAndroid: mWeb ChromeiOS: HybridAppScreen.Recording.2026-04-03.at.5.37.16.PM.moviOS: mWeb SafariMacOS: Chrome / SafariScreen.Recording.2026-04-03.at.5.29.16.PM.mov |
|
The core fix looks correct — the One thing to consider: |
@MelvinBot yes, this guard should be added here too |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 882ccd283a
ℹ️ About Codex in GitHub
Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
| const onlyShowPayElsewhere = reportHasOnlyNonReimbursableTransactions | ||
| ? false | ||
| : !canIOUBePaid && canIOUBePaidAction(moneyRequestReport, chatReport, policy, bankAccountList, transaction ? [transaction] : undefined, true, undefined, invoiceReceiverPolicy); | ||
| const shouldShowPayButton = isPaidAnimationRunning || canIOUBePaid || onlyShowPayElsewhere || reportHasOnlyNonReimbursableTransactions; |
There was a problem hiding this comment.
Setting onlyShowPayElsewhere to false when reportHasOnlyNonReimbursableTransactions is true makes the header expose direct payment options again, but this component’s confirmPayment path has no non-reimbursable guard (unlike MoneyRequestReportPreview/PayActionButton.tsx and MoneyReportHeader.tsx, which block non-ELSEWHERE types). In this scenario, choosing VBBA/other direct methods from the header now proceeds to payMoneyRequest instead of showing the non-reimbursable error flow, causing inconsistent and incorrect payment behavior for reports that should only allow mark-as-paid.
Useful? React with 👍 / 👎.
There was a problem hiding this comment.
Added the non-reimbursable payment guard to PayPrimaryAction.tsx using the existing useNonReimbursablePaymentModal hook — same pattern as MoneyReportHeader.tsx and PayActionButton.tsx. If a user selects a non-ELSEWHERE payment type on a non-reimbursable report, it now shows the error modal instead of proceeding to payMoneyRequest.
Co-authored-by: situchan <108292595+situchan@users.noreply.github.com> Co-authored-by: Situ Chandra Shil <situchan@users.noreply.github.com>
|
@cristipaval Please copy/paste the Reviewer Checklist from here into a new comment on this PR and complete it. If you have the K2 extension, you can simply click: [this button] |
|
The only failing check is All other checks (ESLint, typecheck, tests, builds, Prettier, spellcheck, etc.) are either ✅ passing or still running from the latest push. No code changes are needed. |
|
Code Review: Looks good ✅ The change correctly aligns
No issues found. |
|
Codex Review: Didn't find any major issues. Keep them coming! ℹ️ About Codex in GitHubCodex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
If Codex has suggestions, it will comment; otherwise it will react with 👍. When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback". |
|
🚧 @cristipaval has triggered a test Expensify/App build. You can view the workflow run here. |
|
🧪🧪 Use the links below to test this adhoc build on Android, iOS, and Web. Happy testing! 🧪🧪
|
|
✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release. |
…HeaderButtons [CP Staging] Fix non-reimbursable pay button options in report header (cherry picked from commit 687fb80) (cherry-picked to staging by jasperhuangg)
|
🚀 Cherry-picked to staging by https://github.com/jasperhuangg in version: 9.3.52-1 🚀
|
|
No help site changes are required for this PR. This PR is a bug fix that restores the correct payment button behavior for non-reimbursable expenses in the report header — it aligns The existing help site articles that mention non-reimbursable expenses (e.g., expense types, accounting connection configuration, reimbursement methods) remain accurate and don't reference the specific payment button options shown in the report header. |
4 participants
Explanation of Change
PayPrimaryAction.tsx(the report header's pay button) was missing thehasOnlyNonReimbursableTransactionscheck when computingonlyShowPayElsewhere. For non-reimbursable expenses, this causedonlyShowPayElsewhereto betrue, which madeSettlementButtononly show "Mark as Paid" instead of also showing "Pay with Business Account".The preview's
PayActionButton.tsxalready handled this correctly by forcingonlyShowPayElsewhere=falsewhen the report has only non-reimbursable transactions. This PR alignsPayPrimaryAction.tsxwith that existing pattern.This regression was introduced by #86723, which extracted the PAY action into
PayPrimaryAction.tsxbut used the pre-Expensify/App#83329 logic that didn't account for non-reimbursable transactions.Fixed Issues
$ #87018
PROPOSAL: #87018 (comment)
Tests
Offline tests
N/A — payment buttons are hidden offline via the existing
isDisabled={isOffline && !canAllowSettlement}guard.QA Steps
PR Author Checklist
### Fixed Issuessection aboveTestssectionOffline stepssectionQA stepssectiontoggleReportand notonIconClick)src/languages/*files and using the translation methodSTYLE.md) were followedAvatar, I verified the components usingAvatarare working as expected)StyleUtils.getBackgroundAndBorderStyle(theme.componentBG))npm run compress-svg)Avataris modified, I verified thatAvataris working as expected in all cases)Designlabel and/or tagged@Expensify/designso the design team can review the changes.ScrollViewcomponent to make it scrollable when more elements are added to the page.mainbranch was merged into this PR after a review, I tested again and verified the outcome was still expected according to theTeststeps.Screenshots/Videos
Android: Native
Android: mWeb Chrome
iOS: Native
iOS: mWeb Safari
MacOS: Chrome / Safari