[HOLD for payment 2025-05-05] Cards - Adding a card & refreshing page displays learn more page briefly

[IuliiaHerets]

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: V9.1.30-0
Reproducible in staging?: Yes
Reproducible in production?: No
Email or phone of affected tester (no customers): Slottwo1 in1@gmail.com
Issue reported by: Applause Internal Team
Device used: Redminote 10s android 13
App Component: Workspace Settings

Action Performed:

1. Go to https://staging.new.expensify.com/home
2. Go to workspace settings - company cards
3. Add a american express corporate card
4. Refresh the page

Expected Result:

Adding a card & refreshing page must not display learn more page briefly.

Actual Result:

Adding a card & refreshing page displays learn more page briefly before updating to cards page.

Workaround:

Unknown

Platforms:

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6806886_1745036499692.Screenrecorder-2025-04-19-09-43-21-595.mp4

View all open jobs on GitHub

Issue Owner

Current Issue Owner: @VictoriaExpensify

[melvin-bot]

Triggered auto assignment to @VictoriaExpensify (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[melvin-bot]

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

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

[melvin-bot]

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

[nkdengineer]

Proposal

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

Adding a card & refreshing page displays learn more page briefly before updating to cards page.

What is the root cause of that problem?

This comes from #60261

They forgot to pass isLoading to cardFeeds in this memo

App/src/hooks/useCardFeeds.tsx

Line 34 in b8b86db

return Object.values(allFeeds).reduce<CardFeeds & {settings: Required<CardFeeds['settings']>}>(

So isLoading here will be false

App/src/pages/workspace/companyCards/WorkspaceCompanyCardsPage.tsx

Line 76 in b8b86db

const isLoading = !isOffline && (!cardFeeds || (!!cardFeeds.isLoading && isEmptyObject(cardsList)));

So instead of displaying ActivityIndicator here:

App/src/pages/workspace/companyCards/WorkspaceCompanyCardsPage.tsx

Lines 144 to 150 in b8b86db

	{!!isLoading && (
	<ActivityIndicator
	size={CONST.ACTIVITY_INDICATOR_SIZE.LARGE}
	style={styles.flex1}
	color={theme.spinner}
	/>
	)}

Empty state here will be displayed instead:

App/src/pages/workspace/companyCards/WorkspaceCompanyCardsPage.tsx

Line 169 in b8b86db

{isNoFeed && <WorkspaceCompanyCardPageEmptyState route={route} />}

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

Pass isLoading to cardFeeds as well after here

App/src/hooks/useCardFeeds.tsx

Line 35 in b8b86db

(acc, feed) => {

acc.isLoading = feed?.isLoading ?? !feed;

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

None

What alternative solutions did you explore? (Optional)

NA

Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.

[mountiny]

Cc @VickyStash @puneetlath

[arosiclair]

Looks like a new feature so I'll just demote this