[Due for payment 2026-08-07] [$250] Workspace, Tags and Per diems empty state is slightly shifted up

[applause-bot]

If you haven’t already, check out our contributing guidelines for onboarding. To join our Slack channel, fill out this form.

---

Version Number: 9.4.46-2
Reproducible in staging?: Yes
Reproducible in production?: No
If this was caught during regression testing, add the test name, ID and link from BrowserStack: #93335
Email or phone of affected tester (no customers): sdsjodijnsdojsosjio@gmail.com
Issue reported by: Applause Internal Team
Bug source: Exploratory - Significant User Experience Deterioration
Device used: Mac 26.5 / Chrome
App Component: Workspace Settings

Action Performed:

Precondition:

• Enable Tags and Per diems.
• Do not add tags and per diems.

1. Go to staging.new.expensify.com
2. Go to workspace settings > Tags.
3. Go to workspace settings > Per diems.

Expected Result:

Tags and Per diems empty state will have the same alignment as production.

Actual Result:

Tags and Per diems empty state have different alignment from production.
The empty state is slightly shifted up.

The same issue also happens on empty workspace page.

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Bug7221398_1785367789290.19.mp4

View all open jobs on GitHub

Applause Internal Information
Exported by: Julia Ponikarchuk
Bug ID: 7221398

Issue Owner

Current Issue Owner: @aimane-chnaif

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~022082817981269848147
• Upwork Job ID: 2082817981269848147
• Last Price Increase: 2026-07-30

[applause-bot]

While Applause doesn't embed attachments for this bug, here are the links for quick view:
https://platform.applause.com/services/links/v1/external/3d1e4e6738c9c046652a990625e95732e721919046077b5b3eb57da3f6507701

[melvin-bot]

You have been assigned to this deploy blocker because you recently merged this PR: #93335

[melvin-bot]

@NikkiWines @gijoe0295 you have been assigned to this deploy blocker because you reviewed the offending PR: #93335

[melvin-bot]

@aimane-chnaif you have been assigned to this deploy blocker because you authored the offending PR: #93335

[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.

[MelvinBot]

Deploy Blocker Analysis

Confirmed offending PR: #93335 ("add table semantics to workspace data tables for screen readers") — High confidence. Melvin's auto-assignment (author aimane-chnaif, reviewers NikkiWines, gijoe0295) is correct.

Root cause: The PR wraps Table children in a new TableSemanticContainer, which groups the contiguous Header/Body run in an extra <View style={[styles.flex1, styles.mnh0]}> (TableSemanticContainer.tsx:44-59). Even when a table is empty, TableHeader/TableBody still return valid (null-rendering) elements (TableBody.tsx:92-94), so the wrapper still renders with flex: 1. That adds a second flexGrow: 1 sibling next to the empty-state ScrollView (also flexGrow: 1), halving the ScrollView's height. Its vertically-centered illustration therefore shifts up — exactly the reported symptom.

Why it's wide-web only: the new markup is gated behind shouldUseTableSemantics(), which returns true only on web + wide layout — matching the report (Windows/MacOS Chrome, not native/mWeb, reproduces on staging not production).

Recommendation: Roll forward with a targeted fix (do not revert). The PR touches 33 files adding ARIA table semantics across 20+ tables; reverting would drop all of that for a small layout side-effect. Suggested fix: in TableSemanticContainer.tsx, short-circuit to raw children (or drop styles.flex1 from the wrapper) when rowCount === 0 — an empty table has no rows to expose to screen readers anyway, so this preserves the accessibility semantics for populated tables while restoring the pre-PR layout for empty states. Verify on wide web across Tags, Per diems, and the empty Workspaces list.

Evidence chain

• Empty state renders its illustration in a ScrollView using emptyStateForeground = { flexGrow: 1, justifyContent: 'center', alignItems: 'center' } (styles/index.ts:5795-5800) — content is vertically centered in whatever space the ScrollView occupies.
• flex1 = { flex: 1 } (flex.ts:17-19), i.e. flexGrow: 1.
• Before the PR, the empty-state ScrollView was the only growing sibling → took all free vertical space → centered content sat in the middle. After the PR, the empty semantic wrapper is a second equal-growing sibling → ScrollView height roughly halved → centered content shifts up.
• All three affected surfaces compose the same Table (e.g. Per diems: WorkspacePerDiemTable/index.tsx:130-134), Tags via WorkspaceTagsTable, and the empty Workspaces list via WorkspaceListTable (also modified by the PR).
• Timeline: add table semantics to workspace data tables for screen readers #93335 merged 2026-07-29, landing in the 9.4.46 staging deploy. Reproduces on staging, not production. ✅

---

Next Steps for Contributor+ team:
To accept: @MelvinBot implement this to create a draft PR.
To refine: @MelvinBot <your feedback>
To reject: Explain why you are rejecting Melvin's analysis.