Migrate money request merchant, description and date steps to dynamic by suneox · Pull Request #98393 · Expensify/App

suneox · 2026-08-12T04:46:38Z

Explanation of Change

Part 1 of #83852 migrates three money request steps off the legacy backTo param and onto dynamic routes: MONEY_REQUEST_STEP_MERCHANT (expense-merchant), MONEY_REQUEST_STEP_DESCRIPTION (expense-description) and MONEY_REQUEST_STEP_DATE (expense-date). Each one follows the query-param template already used by MONEY_REQUEST_STEP_TAX_RATE / MONEY_REQUEST_STEP_TAG on main: the params that used to live in the path (action, iouType, transactionID, reportID, optional reportActionID) become query params of the dynamic suffix, the page is renamed to Dynamic* and resolves its back destination with useDynamicBackPath instead of reading route.params.backTo.

Every call site (the confirmation list merchant/description/date fields, MoneyRequestView and SplitExpenseEditPage) now navigates with createDynamicRoute, and every screen those taps come from is listed in entryScreens so no entry point is silently blocked. The suffixes are namespaced expense-* because dynamic route paths must be globally unique and bare description / date-select are already taken. OldRoutes.ts keeps the legacy URLs working (with a dedicated longer pattern for the optional reportActionID segment), covered by new unit tests in tests/navigation/getMatchingNewRouteTest.ts.

Fixed Issues

$ #83852
PROPOSAL:

Tests

DYNAMIC_ROUTES.MONEY_REQUEST_STEP_MERCHANT — edit the merchant of an expense

Case 1.1 — Confirmation page → Merchant → save → back

Target: src/components/MoneyRequestConfirmationList/sections/MerchantField.tsx:138

Precondition: you are on the Confirmation step of a new expense sent to a workspace chat.

Open the app and sign in.
Tap the FAB (+) → Create expense.
On the Manual tab, enter an amount → Next.
Pick a workspace chat as the recipient → the Confirmation page opens.
Tap the Merchant row.
Verify the URL becomes <confirmation-url>/expense-merchant?action=create&iouType=submit&transactionID=…&reportID=… and the Merchant page opens.
Type a new merchant → Save.
Verify you land back on the Confirmation page, the suffix is gone from the URL and the new merchant is shown.

Case 1.2 — Expense report view (RHP) → Merchant → save → back

Target: src/components/ReportActionItem/MoneyRequestView.tsx:1280

Open a workspace chat and tap an existing expense → the transaction thread (expense detail) opens.
Tap the Merchant row.
Verify the URL gets /expense-merchant?action=edit&iouType=…&transactionID=…&reportID=… appended.
Change the merchant → Save.
Verify you go back to the expense detail (suffix removed) and the new value is shown.

Case 1.3 — Header back button (no save)

Target: src/pages/iou/request/step/DynamicIOURequestStepMerchant.tsx

Repeat steps 1–5 of Case 1.1 to open the Merchant page.
Without editing anything, tap the header back arrow.
Verify you return to the Confirmation page, the suffix is removed and no /not-found page appears.
Repeat from the expense detail (Case 1.2) and verify back returns to the expense detail, not to the Confirmation page.

Case 1.4 — Refresh / deep link

Open the Merchant page as in Case 1.2 and copy the URL.
Press F5 on that URL.
Verify the stack is restored — the RHP shows the Merchant page and back still returns to the expense detail.
Paste the URL in a new tab (cold load) and verify the same result.

Case 1.5 — Legacy URL redirect

Target: src/libs/Navigation/linkingConfig/OldRoutes.ts

Grab the transactionID and reportID of an expense.
Open /edit/submit/merchant/<transactionID>/<reportID>.
Verify it redirects to /r/<reportID>/expense-merchant?action=edit&iouType=submit&transactionID=<transactionID>&reportID=<reportID> and renders the Merchant page (no /not-found).
Open the reportActionID variant /edit/submit/merchant/<transactionID>/<reportID>/<reportActionID> and verify the new URL also carries &reportActionID=….

Case 1.6 — Save while offline

Open the Merchant page from the expense detail (Case 1.2).
Go offline (Settings → Troubleshoot → Force offline, or DevTools → Network → Offline).
Change the merchant → Save.
Verify you still land back on the expense detail with the value shown as pending, and you are not stuck on the Merchant page.

DYNAMIC_ROUTES.MONEY_REQUEST_STEP_DESCRIPTION — edit the description of an expense

Case 2.1 — Confirmation page → Description → save → back

Target: src/components/MoneyRequestConfirmationList/sections/DescriptionField.tsx:151

FAB → Create expense → Manual → enter an amount → Next → pick a workspace chat → Confirmation.
Tap the Description row.
Verify the URL gets /expense-description?action=create&iouType=submit&transactionID=…&reportID=… appended.
Type a description → Save.
Verify you are back on the Confirmation page with the new description shown.

Case 2.2 — Expense report view (RHP) → Description → save → back

Target: src/components/ReportActionItem/MoneyRequestView.tsx:1254

Open an existing expense → expense detail (transaction thread).
Tap the Description row.
Verify the URL gets /expense-description?action=edit&… appended and the Description page opens.
Edit → Save and verify you return to the expense detail.

Case 2.3 — Split expense edit → Description → back

Target: src/pages/iou/SplitExpenseEditPage.tsx:332

Precondition: an expense in the Split expense flow.

Open the expense detail of a valid expense.
⋮ (or the Split button) → Split expense.
Tap one split row → the Split expense edit page opens.
Tap the Description row.
Verify the URL gets /expense-description?action=edit&iouType=split-expense&transactionID=<OPTIMISTIC_TRANSACTION_ID>&reportID=… appended.
Edit → Save and verify you return to Split expense edit, not to the expense detail.

Case 2.4 — Refresh / deep link

Open the Description page as in Case 2.2, copy the URL → F5.
Verify the stack is restored (RHP shows Description) and back returns to the expense detail.
Paste the URL in a new tab and verify the same result.

Case 2.5 — Legacy URL redirect

Open /edit/submit/description/<transactionID>/<reportID>.
Verify it redirects to /r/<reportID>/expense-description?action=edit&iouType=submit&transactionID=…&reportID=… and renders the Description page.
Open /r/<reportID>/description (report description) and verify it still opens the report description page, unaffected by the new mapping.

DYNAMIC_ROUTES.MONEY_REQUEST_STEP_DATE — edit the date of an expense

Case 3.1 — Confirmation page → Date → pick a date → back

Target: src/components/MoneyRequestConfirmationList/sections/DateField.tsx:154

FAB → Create expense → Manual → enter an amount → Next → pick a workspace chat → Confirmation.
Tap the Date row.
Verify the URL gets /expense-date?action=create&iouType=submit&transactionID=…&reportID=… appended.
Pick another date → Save.
Verify you are back on the Confirmation page with the new date shown.

Case 3.2 — Expense report view (RHP) → Date → back

Target: src/components/ReportActionItem/MoneyRequestView.tsx:1305

Open the expense detail of an expense.
Tap the Date row and verify the URL gets /expense-date?action=edit&… appended.
Change the date → Save and verify you return to the expense detail with the new date.

Case 3.3 — Split expense edit → Date → back

Target: src/pages/iou/SplitExpenseEditPage.tsx:435

Reach the Split expense edit page as in Case 2.3.
Tap the Date row and verify the URL gets /expense-date?action=edit&iouType=split-expense&… appended.
Change the date → Save and verify you return to Split expense edit.

Case 3.4 — Refresh / deep link

Open the Date page as in Case 3.2 → copy the URL → F5.
Verify the RHP shows the Date page and back returns to the expense detail.
Paste the URL in a new tab and verify the same result.

Case 3.5 — Legacy URL redirect

Open /edit/submit/date/<transactionID>/<reportID>.
Verify it redirects to /r/<reportID>/expense-date?action=edit&iouType=submit&transactionID=…&reportID=… and renders the Date page.

Cross-cutting — entry allow-list and no regression on similarly named routes

Case 4.1 — Entry from Search / expense report view

Target: src/ROUTES.ts (entryScreens of the three new dynamic routes)

Go to the Reports tab (or Search) → open an expense report.
Open one expense inside that report (RHP).
Tap Merchant, then Description, then Date.
Verify all three open their page (no dead tap, no /not-found), which proves entryScreens is complete.
Back out of each one and verify you return to the same expense inside the report.

Case 4.2 — No regression on similarly named routes

Open any room/chat → Details → Description (report description).
Verify the report description page still opens and the URL /r/<reportID>/description is unchanged.
Open Duplicate review → Merchant (if a duplicate transaction exists).
Verify the duplicate-review merchant route still works as before.

Case 4.3 — Automated tests

npx jest tests/navigation/getMatchingNewRouteTest.ts tests/navigation/dynamicRoutesUniquePathTest.ts tests/unit/useActiveRouteTest.ts

Run the command above.
Verify all tests pass (the full tests/navigation suite is 42 suites / 488 tests passing).

Verify that no errors appear in the JS console

Offline tests

Same as tests — navigation refactor, offline behavior unchanged (Case 1.6 covers saving a field while offline).

QA Steps

Test case 1: Edit the merchant of an expense from the confirmation page

Sign in to the app.
Tap the + button → Create expense.
On the Manual tab, enter an amount → Next.
Pick a workspace chat as the recipient so the confirmation page opens.
Tap the Merchant row.
Verify the Merchant page opens and the URL ends with /expense-merchant?action=create&iouType=submit&transactionID=...&reportID=....
Enter a merchant name → Save.
Verify you are back on the confirmation page, the URL no longer ends with expense-merchant, and the merchant row shows the new value.

Test case 2: Edit the description of an expense from the expense detail

Open a workspace chat and tap an existing expense to open its detail view.
Tap the Description row.
Verify the Description page opens and the URL ends with /expense-description?action=edit&iouType=...&transactionID=...&reportID=....
Enter a description → Save.
Verify you are back on the expense detail and the description row shows the new value.

Test case 3: Edit the date of an expense from the expense detail

Open a workspace chat and tap an existing expense to open its detail view.
Tap the Date row.
Verify the Date page opens and the URL ends with /expense-date?action=edit&iouType=...&transactionID=...&reportID=....
Pick a different date → Save.
Verify you are back on the expense detail and the date row shows the new date.

Test case 4: Open merchant, description and date from an expense report

Go to the Reports tab and open an expense report.
Open one expense inside that report.
Tap the Merchant row, go back, tap the Description row, go back, then tap the Date row.
Verify each row opens its own page and that going back always returns you to the same expense inside the report.

Verify that no errors appear in the JS console

PR Author Checklist

Screenshots/Videos

Android: Native

Android: mWeb Chrome

iOS: Native

iOS: mWeb Safari

MacOS: Chrome / Safari

CleanShot.2026-08-12.at.12.11.20.1.mp4

Case 1.1 — Confirmation page → Merchant → save → back

Case 1.2 — Expense report view (RHP) → Merchant → save → back

Case 1.3 — Header back button (no save)

1 3-2-entry-merchant-from-expense-detail

Case 1.4 — Refresh / deep link

1 4-1-before-merchant-step-before-refresh

1 4-3-after-back-merchant-back-expense-detail

Case 1.5 — Legacy URL redirect

1 5-1-before-merchant-reportactionid-oldurl

1 5-2-entry-merchant-reportactionid-redirected

Case 1.6 — Save while offline

Case 2.1 — Confirmation page → Description → save → back

Case 2.2 — Expense report view (RHP) → Description → save → back

Case 2.3 — Split expense edit → Description → back

Case 2.4 — Refresh / deep link

2 4-1-before-description-step-before-refresh

2 4-2-entry-description-step-after-refresh

2 4-3-after-back-description-back-expense-detail

Case 2.5 — Legacy URL redirect

2 5-2-entry-report-description-unchanged

Case 3.1 — Confirmation page → Date → pick a date → back

Case 3.2 — Expense report view (RHP) → Date → back

Case 3.3 — Split expense edit → Date → back

Case 3.4 — Refresh / deep link

3 4-3-after-back-date-back-expense-detail

Case 3.5 — Legacy URL redirect

Case 4.1 — Entry from Search / expense report view

4 1-3-after-back-date-search-expense-detail

4 1-3-after-back-description-search-expense-detail

4 1-3-after-back-merchant-search-expense-detail

Case 4.2 — No regression on similarly named routes

4 2-1-before-duplicates-review-merchant-oldurl

4 2-2-entry-duplicates-review-merchant-redirected

melvin-bot · 2026-08-12T04:46:45Z

@huult 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]

… routes Replaces the legacy `backTo` param on MONEY_REQUEST_STEP_MERCHANT, MONEY_REQUEST_STEP_DESCRIPTION and MONEY_REQUEST_STEP_DATE with dynamic routes, following the MONEY_REQUEST_STEP_TAX_RATE query-param template. - add `expense-merchant`, `expense-description` and `expense-date` entries to DYNAMIC_ROUTES and drop the static route definitions - rename the pages to Dynamic* and resolve the back path with useDynamicBackPath - register the new DYNAMIC_STEP_* screens in the linking config, navigation types, modal stack navigator and the step HOC unions - update every call site (confirmation list fields, MoneyRequestView, SplitExpenseEditPage) to createDynamicRoute - add OldRoutes redirects (with the optional reportActionID variants) and unit tests Part 1 of Expensify#83852.

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 9cc060c0cd

ℹ️ 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".

chatgpt-codex-connector · 2026-08-12T04:53:27Z

    },
+    MONEY_REQUEST_STEP_MERCHANT: {
+        path: 'expense-merchant',
+        entryScreens: [


Include split bill details in the dynamic entry screens

When the original actor can still edit an incomplete split bill, DynamicSplitBillDetailsPage renders MoneyRequestConfirmationList with editable Merchant/Description/Date rows; these rows now navigate by appending expense-* to the current /r/:reportID/split/:reportActionID URL. The dynamic route parser only accepts that suffix if the base focused screen is in entryScreens, but these new allow-lists omit SCREENS.SPLIT_DETAILS.DYNAMIC_ROOT, so those taps from split bill details fall through to the normal parser/not-found instead of opening the edit step. Please add the split details screen to the new merchant/description/date dynamic route entry screens.

Useful? React with 👍 / 👎.

Issue can not reproduce and behavior still the same latest staging

CleanShot.2026-08-12.at.12.19.23.1.mp4

Issue found while editing split expense.

CleanShot.2026-08-12.at.13.00.53.1.mp4

And fixed

CleanShot.2026-08-12.at.13.15.35.1.mp4

codecov · 2026-08-12T04:53:43Z

Codecov Report

✅ Changes either increased or maintained existing code coverage, great job!

Files with missing lines	Coverage Δ
src/SCREENS.ts	`100.00% <ø> (ø)`
...oneyRequestConfirmationList/sections/DateField.tsx	`78.72% <ø> (ø)`
...uestConfirmationList/sections/DescriptionField.tsx	`76.66% <ø> (ø)`
...RequestConfirmationList/sections/MerchantField.tsx	`71.73% <ø> (ø)`
...c/components/ReportActionItem/MoneyRequestView.tsx	`75.05% <ø> (ø)`
src/libs/Navigation/linkingConfig/OldRoutes.ts	`100.00% <ø> (ø)`
src/libs/Navigation/linkingConfig/config.ts	`66.66% <ø> (ø)`
src/pages/iou/SplitExpenseEditPage.tsx	`0.00% <ø> (ø)`
...iou/request/step/withFullTransactionOrNotFound.tsx	`96.00% <ø> (ø)`
.../iou/request/step/withWritableReportOrNotFound.tsx	`87.09% <ø> (ø)`
... and 5 more
... and 237 files with indirect coverage changes

… and date steps An incomplete split bill still renders `MoneyRequestConfirmationList` with editable Merchant/Description/Date rows for its original actor, so those taps append the `expense-*` suffix to `/r/:reportID/split/:reportActionID`. Without the split details screen in `entryScreens`, `getStateFromPath` rejects the suffix and the app falls through to `/not-found`. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

huult · 2026-08-12T07:00:48Z

Reviewer Checklist

I have verified the author checklist is complete (all boxes are checked off).
I verified the correct issue is linked in the ### Fixed Issues section above
I verified testing steps are clear and they cover the changes made in this PR
- I verified the steps for local testing are in the Tests section
- I verified the steps for Staging and/or Production testing are in the QA steps section
- I verified the steps cover any possible failure scenarios (i.e. verify an input displays the correct error message if the entered data is not correct)
- I turned off my network connection and tested it while offline to ensure it matches the expected behavior (i.e. verify the default avatar icon is displayed if app is offline)
I checked that screenshots or videos are included for tests on all platforms
I included screenshots or videos for tests on all platforms
I verified that the composer does not automatically focus or open the keyboard on mobile unless explicitly intended. This includes checking that returning the app from the background does not unexpectedly open the keyboard.
I verified tests pass on all platforms & I tested again on:
- Android: HybridApp
- Android: mWeb Chrome
- iOS: HybridApp
- iOS: mWeb Safari
- MacOS: Chrome / Safari
If there are any errors in the console that are unrelated to this PR, I either fixed them (preferred) or linked to where I reported them in Slack
I verified proper code patterns were followed (see Reviewing the code)
- I verified that comments were added to code that is not self explanatory
- I verified that any new or modified comments were clear, correct English, and explained "why" the code was doing something instead of only explaining "what" the code was doing.
- I verified any copy / text that was added to the app is grammatically correct in English. It adheres to proper capitalization guidelines (note: only the first word of header/labels should be capitalized), and is either coming verbatim from figma or has been approved by marketing (in order to get marketing approval, ask the Bug Zero team member to add the Waiting for copy label to the issue)
If a new code pattern is added I verified it was agreed to be used by multiple Expensify engineers
I verified that this PR follows the guidelines as stated in the Review Guidelines
I verified other components that can be impacted by these changes have been tested, and I retested again (i.e. if the PR modifies a shared library or component like Avatar, I verified the components using Avatar have been tested & I retested again)
If a new component is created I verified that:
- A similar component doesn't exist in the codebase
- All props are defined accurately
- The component has a clear name that is non-ambiguous and the purpose of the component can be inferred from the name alone
- The only data being stored in the state is data necessary for rendering and nothing else
- The component has the minimum amount of code necessary for its purpose, and it is broken down into smaller components in order to separate concerns and functions
If a new CSS style is added I verified that:
- A similar style doesn't already exist
- The style can't be created with an existing StyleUtils function (i.e. StyleUtils.getBackgroundAndBorderStyle(theme.componentBG)
If the PR modifies code that runs when editing or sending messages, I tested and verified there is no unexpected behavior for all supported markdown - URLs, single line code, code blocks, quotes, headings, bold, strikethrough, and italic.
If the PR modifies a generic component, I tested and verified that those changes do not break usages of that component in the rest of the App (i.e. if a shared library or component like Avatar is modified, I verified that Avatar is working as expected in all cases)
If the PR modifies a component related to any of the existing Storybook stories, I tested and verified all stories for that component are still working as expected.
If the PR modifies a component or page that can be accessed by a direct deeplink, I verified that the code functions as expected when the deeplink is used - from a logged in and logged out account.
If the PR modifies the UI (e.g. new buttons, new UI components, changing the padding/spacing/sizing, moving components, etc) or modifies the form input styles:
- I verified that all the inputs inside a form are aligned with each other.
- I added Design label and/or tagged @Expensify/design so the design team can review the changes.
For any bug fix or new feature in this PR, I verified that sufficient unit tests are included to prevent regressions in this flow.
If the main branch was merged into this PR after a review, I tested again and verified the outcome was still expected according to the Test steps.
I have checked off every checkbox in the PR reviewer checklist, including those that don't apply to this PR.

Screenshots/Videos

Android: HybridApp

Android: mWeb Chrome

iOS: HybridApp

iOS: mWeb Safari

MacOS: Chrome / Safari

suneox requested review from a team as code owners August 12, 2026 04:46

melvin-bot Bot assigned suneox Aug 12, 2026

melvin-bot Bot requested review from JmillsExpensify and huult and removed request for a team August 12, 2026 04:46

suneox marked this pull request as draft August 12, 2026 04:47

suneox force-pushed the 83852-migrate-money-request-part-1-suneox branch from 9cc060c to 42ab058 Compare August 12, 2026 04:49

chatgpt-codex-connector Bot reviewed Aug 12, 2026

View reviewed changes

suneox marked this pull request as ready for review August 12, 2026 05:25

Navigation Menu

Uh oh!

Migrate money request merchant, description and date steps to dynamic - #98393

Migrate money request merchant, description and date steps to dynamic#98393
suneox wants to merge 2 commits into
Expensify:mainfrom
suneox:83852-migrate-money-request-part-1-suneox

suneox commented Aug 12, 2026 •

edited

Loading

Uh oh!

melvin-bot Bot commented Aug 12, 2026

Uh oh!

chatgpt-codex-connector Bot left a comment

Uh oh!

chatgpt-codex-connector Bot Aug 12, 2026

Uh oh!

suneox Aug 12, 2026

Uh oh!

suneox Aug 12, 2026

Uh oh!

codecov Bot commented Aug 12, 2026 •

edited by github-actions Bot

Loading

Uh oh!

huult commented Aug 12, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

suneox commented Aug 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Explanation of Change

Fixed Issues

Tests

Case 1.1 — Confirmation page → Merchant → save → back

Case 1.2 — Expense report view (RHP) → Merchant → save → back

Case 1.3 — Header back button (no save)

Case 1.4 — Refresh / deep link

Case 1.5 — Legacy URL redirect

Case 1.6 — Save while offline

Case 2.1 — Confirmation page → Description → save → back

Case 2.2 — Expense report view (RHP) → Description → save → back

Case 2.3 — Split expense edit → Description → back

Case 2.4 — Refresh / deep link

Case 2.5 — Legacy URL redirect

Case 3.1 — Confirmation page → Date → pick a date → back

Case 3.2 — Expense report view (RHP) → Date → back

Case 3.3 — Split expense edit → Date → back

Case 3.4 — Refresh / deep link

Case 3.5 — Legacy URL redirect

Case 4.1 — Entry from Search / expense report view

Case 4.2 — No regression on similarly named routes

Case 4.3 — Automated tests

Offline tests

QA Steps

Test case 1: Edit the merchant of an expense from the confirmation page

Test case 2: Edit the description of an expense from the expense detail

Test case 3: Edit the date of an expense from the expense detail

Test case 4: Open merchant, description and date from an expense report

PR Author Checklist

Screenshots/Videos

Uh oh!

melvin-bot Bot commented Aug 12, 2026

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

chatgpt-codex-connector Bot Aug 12, 2026

Choose a reason for hiding this comment

Uh oh!

suneox Aug 12, 2026

Choose a reason for hiding this comment

Uh oh!

suneox Aug 12, 2026

Choose a reason for hiding this comment

Uh oh!

codecov Bot commented Aug 12, 2026 • edited by github-actions Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

huult commented Aug 12, 2026

Reviewer Checklist

Screenshots/Videos

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

suneox commented Aug 12, 2026 •

edited

Loading

codecov Bot commented Aug 12, 2026 •

edited by github-actions Bot

Loading