[Due for payment 2026-03-19] WS Settings - Blank page after importing csv file to enable Per diem

[lanitochka17]

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.3.36-0
Reproducible in staging?: Yes
Reproducible in production?: No
If this was caught during regression testing, add the test name, ID and link from BrowserStack: https://test-management.browserstack.com/projects/2219752/folder/13176674/test-cases/41237177
Email or phone of affected tester (no customers): gatantm+6210@gmail.com
Issue reported by: Applause Internal Team
Bug source: Regression TC Execution
Device used: MacOS 26.2, Safari
App Component: Workspace Settings

Action Performed:

1. Launch expensify and go to WS tab
2. Open or create a WS
3. Go to More Features and enable Per diem
4. Click to import the CSV select the valid file, enable the settings and confirm

Expected Result:

User is back to WS with per diem enabled and imported settings shown

Actual Result:

The app is stuck on empty page

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Bug7100439_1773264954329.Recording__1539.mp4

Bug7100439_1773264954323!German_Per_Diem_-Dependent_Tags___2.csv

View all open jobs on GitHub

[melvin-bot]

Triggered auto assignment to @neil-marcellini (DeployBlockerCash), see https://stackoverflowteams.com/c/expensify/questions/9980/ for more details.

[melvin-bot]

💬 A slack conversation has been started in #expensify-open-source

[github-actions]

👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open `StagingDeployCash` deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

1. Identify the pull request that introduced this issue and revert it.
2. Find someone who can quickly fix the issue.
3. Fix the issue yourself.

[OSBotify]

Investigation Summary

Classification: Frontend bug
Causing PR: #84799 - "Fix member import crash and missing navigation after confirmation" by @MelvinBot (High confidence)
Related Issues: #84489 (fixed by PR #84799)

Recommendation: REVERT

PR #84799 should be reverted immediately. While it successfully fixed the member import crash issue, it appears to have introduced a regression in the per diem import flow (and potentially other import flows like categories and tags).

Labels: Keeping DeployBlockerCash label as this is a frontend bug that blocks the App deploy.

Detailed Analysis

Evidence

• The bug is reproducible on staging (version 9.3.36-0) but NOT on production
• PR Fix member import crash and missing navigation after confirmation #84799 was merged on March 11, 2026 and is included in the staging deploy checklist (Deploy Checklist: New Expensify 2026-03-11 #84953)
• PR Fix member import crash and missing navigation after confirmation #84799 modified ImportSpreadsheetConfirmModal.tsx, ModalContext.tsx, and useConfirmModal.ts
• The bug occurs during per diem CSV import, which uses the same ImportSpreadsheetConfirmModal component that PR Fix member import crash and missing navigation after confirmation #84799 modified

Verification

Affected files for per diem import:

• /home/runner/_work/App/App/src/pages/workspace/perDiem/ImportedPerDiemPage.tsx - Uses ImportSpreadsheetConfirmModal
• /home/runner/_work/App/App/src/components/ImportSpreadsheetConfirmModal.tsx - Modified by PR Fix member import crash and missing navigation after confirmation #84799

PR #84799 changes confirmed:

• Added id: 'import-spreadsheet-confirm' to the showConfirmModal call
• Added useCallback and useMemo to ModalContext to prevent infinite loops
• Modified the modal promise management logic to deduplicate modals by ID

Root Cause

PR #84799 introduced a shared modal id (import-spreadsheet-confirm) for ALL import confirmation modals (members, categories, tags, per diem) to prevent duplicate modals. However, this appears to have created an interaction bug:

1. The ImportSpreadsheetConfirmModal component has a useEffect that calls showConfirmModal()
2. When showConfirmModal() is called with the same id, the ModalContext reuses the existing promise instead of creating a new modal
3. The .then(() => { closeImportPageAndModal(); }) callback gets attached to this promise
4. If the useEffect re-fires (due to dependency changes), multiple callbacks can be attached to the same promise
5. When the modal closes and the promise resolves, ALL callbacks fire, potentially calling closeImportPageAndModal() multiple times
6. Multiple calls to Navigation.goBack() could cause navigation state corruption, resulting in the blank page

The same modal deduplication logic that fixed the member import crash appears to have broken the per diem import flow.

[MelvinBot]

Proposal

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

After importing a CSV file to enable Per Diem in Workspace Settings and confirming the import in the success modal, the app gets stuck on a blank page instead of navigating back to the workspace Per Diem page. This is a regression in staging 9.3.36-0, not reproducible in production.

What is the root cause of that problem?

PR #84799 ("Fix member import crash and missing navigation after confirmation") modified ImportSpreadsheetConfirmModal.tsx to add id: 'import-spreadsheet-confirm' to the showConfirmModal call. This enables modal promise deduplication — when showConfirmModal is called multiple times with the same id, it returns the same promise instead of creating a new modal.

The problem is that the useEffect in ImportSpreadsheetConfirmModal (src/components/ImportSpreadsheetConfirmModal.tsx:32-47) has closeImportPageAndModal in its dependency array. In ImportedPerDiemPage, closeImportPageAndModal is defined inline without useCallback (src/pages/workspace/perDiem/ImportedPerDiemPage.tsx:147), so it gets a new reference on every render. Each re-render triggers the effect, which calls showConfirmModal with the same id, getting back the same promise, and attaches another .then(() => closeImportPageAndModal()) handler.

When the user clicks "Got it," the promise resolves and all accumulated .then() handlers fire simultaneously, each calling Navigation.goBack(ROUTES.WORKSPACE_PER_DIEM.getRoute(policyID)). Multiple goBack calls overshoot the navigation stack, leaving the user on a blank page.

Additionally, ImportedPerDiemPage does not pass shouldHandleNavigationBack={false} to ImportSpreadsheetConfirmModal. On web, the Modal pushes/pops browser history entries when this prop is true (the default), which triggers React Navigation's resetRoot — adding yet another conflicting navigation action. PR #84799 correctly added shouldHandleNavigationBack={false} for ImportedMembersConfirmationPage but missed applying the same fix to the Per Diem and Tags import pages.

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

Two changes are needed:

1. Add shouldHandleNavigationBack={false} to the ImportSpreadsheetConfirmModal usage in:

   • src/pages/workspace/perDiem/ImportedPerDiemPage.tsx
   • src/pages/workspace/tags/ImportedTagsPage.tsx
   • src/pages/workspace/tags/ImportedMultiLevelTagsPage.tsx

   This matches the pattern already applied in ImportedCategoriesPage.tsx (line 162) and ImportedMembersConfirmationPage.tsx (line 221).

2. Wrap closeImportPageAndModal in useCallback in each of those pages to stabilize its reference and prevent the useEffect from re-firing and accumulating .then() handlers on the deduplicated promise.

What alternative solutions did you explore? (Optional)

• Changing the default of shouldHandleNavigationBack to false in ImportSpreadsheetConfirmModal: This would fix all import pages at once, but could change behavior for any callers that intentionally rely on the default true behavior.
• Removing closeImportPageAndModal from the useEffect dependency array: This would prevent the re-fire issue but would be a lint violation and could cause stale closure bugs.
• Using a ref for closeImportPageAndModal inside ImportSpreadsheetConfirmModal: Would prevent accumulated handlers without requiring callers to memoize, but adds complexity.

---

Next Steps for Contributor+ team: Reply with @MelvinBot implement this to create a draft PR, @MelvinBot <your feedback> to refine this analysis, or explain why you are rejecting Melvin's proposal.