[Due for payment 2026-08-05] Subscription - The "Stay Ahead of the Deadline” modal flickers after login

[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.45-1
Reproducible in staging?: Yes
Reproducible in production?: N/A - new feature, doesn't exist in prod
If this was caught during regression testing, add the test name, ID and link from BrowserStack: #96275
Email or phone of affected tester (no customers): n/a
Issue reported by: Applause Internal Team
Bug source: Exploratory - Significant User Experience Deterioration
Device used: Mac 15.4.1 Safari/Chrome
App Component: Workspace Settings

Action Performed:

1. Go to staging.new.expensify.com
2. Create a new Gmail account.
3. Create a workspace.
4. Wait for 5 minutes.
5. Select any option on the "Stay Ahead of the Deadline” modal.
6. Log out
7. Log in with the same account

Expected Result:

"Stay Ahead of the Deadline” modal should not flicker after login

Actual Result:

The "Stay Ahead of the Deadline” modal flickers after login

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Bug7219302_1785197999317.Recording__2618.mp4

View all open jobs on GitHub

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

Issue Owner

Current Issue Owner: @shubham1206agra

[melvin-bot]

@grgia recently merged #96275, but they are OOO right now, so I'll auto-assign someone else.

[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/48c09dc7d6837e015ea1dc40c9d5b33636011a523003e7e087b4651690c042dd

[melvin-bot]

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

[MelvinBot]

🔍 Investigation Summary

Classification: Frontend bug
Causing PR: #96275 - "Introduce free trial countdown pop-up" by @dukenv0307 (High confidence)
Related Issues: None

Recommendation: ROLL FORWARD

The flicker is a one-frame state race entirely within the new, self-contained trial-reminder feature; a targeted fix in useTrialPaymentReminder/TrialPaymentReminderModalManager is safer and simpler than reverting a 24-file feature PR.

Assigned: @dukenv0307 (PR author), @shubham1206agra and @grgia (approving reviewers) from the highest-confidence causing PR.
Labels: No changes. Kept DeployBlockerCash (App deploy is blocked by an App PR). No DeployBlocker label present.

📋 Detailed Analysis

Evidence

• The modal string "Stay ahead of the deadline" maps to the trialPaymentReminder key in src/languages/en.ts (line 4576).
• That key and the entire feature (TrialPaymentReminderModal, TrialPaymentReminderModalManager, useTrialPaymentReminder) were introduced by PR Introduce free trial countdown pop-up #96275 — the only PR that touches these files (git log shows no prior history for them).
• PR Introduce free trial countdown pop-up #96275 merged 2026-07-24, matches the reported version 9.4.45-1, and is item Make subscribeToState return a simple ID instead of a complex GUID #11 on the current StagingDeployCash checklist (Deploy Checklist: New Expensify 2026-07-27 #97134).
• Matches "N/A - new feature, doesn't exist in prod": this feature ships for the first time in this release.

Verification

• Affected files:
  • src/hooks/useTrialPaymentReminder.ts
  • src/components/TrialPaymentReminderModalManager.tsx
• Confirmed PR Introduce free trial countdown pop-up #96275 adds both files (present in its --json files list), along with src/languages/* and src/libs/SubscriptionUtils.ts.

Root Cause

The flicker (modal briefly shows then hides right after login) is an Onyx-hydration/state race between firstDayFreeTrial and NVP_DISMISSED_TRIAL_PAYMENT_REMINDER.

1. On a fresh mount after login, readinessState starts at LOADING. The readiness effect only waits for firstDayFreeTrialResult to settle (useTrialPaymentReminder.ts#L157-L173). Because the user already waited out the 5‑minute grace window in a prior session, getTrialStartupGraceRemainingMs returns 0 and readinessState jumps straight to READY — before the dismissal value has settled.

2. currentVariation is populated by a separate effect (#L205-L219), which commits on a later render than the readiness/Onyx updates.

3. isEligibleToShow (#L221-L248) does guard on dismissedTimestampResult loading (line 234), but because readiness reaches READY and currentVariation becomes non-null on a render where the dismissal comparison hasn't yet taken effect together, the memo returns true for a single commit.

4. In that one commit, TrialPaymentReminderModalManager flips isModalOpen to true (Manager#L24-L26), the modal renders, then the next render (with the dismissal applied) sets it back to false (lines 27-29) → visible flicker.

Suggested fix (roll forward): Do not allow readinessState to reach READY (or do not allow isEligibleToShow to return true) until all governing Onyx values — firstDayFreeTrial, lastDayFreeTrial, billingFundID, and dismissedTimestamp — have finished loading in the same settled pass. Concretely, add firstDayFreeTrialResult/lastDayFreeTrial loading guards and require dismissedTimestampResult to be settled before promoting to READY, so the manager never observes the transient isEligibleToShow === true for an already-dismissed reminder.