[Due for payment 2025-03-31] [$500][HIGH] Hybrid - Green/red dot on 'Inbox' disappear after close and open the app again.

[jponikarchuk]

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.12-2
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: Yes, reproducible on both
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Email or phone of affected tester (no customers): testexpensify9+00008@gmail.com
Issue reported by: Applause Internal Team
Device used: Samsung A15, Android 14 | iPhone SE 3rd generation (2022), iOS 18.3.1
App Component: Other

Action Performed:

1. Open Hybrid app
2. Loggin
3. Close the app & open it again
4. Tap on 'Reports' (the green/red dot is shown on 'Inbox' button)
5. Tap on 'Settings'

Expected Result:

The green/red button should be displayed

Actual Result:

The green/red button is not shown (Until the user opens any expense that has a pending action).

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Bug6769014_1741808265704.SkreenRecording_03-12-2025_16-27-53_1.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021900188126174179653
• Upwork Job ID: 1900188126174179653
• Last Price Increase: 2025-03-13

Issue Owner

Current Issue Owner: @allroundexperts

[melvin-bot]

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

[bernhardoj]

Proposal

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

The GBR doesn'st show on Home tab bottom tab icon.

What is the root cause of that problem?

The GBR will show if getChatTabBrickRoad returns info.

App/src/components/Navigation/BottomTabBar/index.tsx

Lines 60 to 61 in 2496dfa

	useEffect(() => {
	setChatTabBrickRoad(getChatTabBrickRoad(activeWorkspaceID, orderedReportIDs));

But in our case, it's undefined. It gets the value by iterating over all report that is shown in LHN and check if a report has GBR or not.

App/src/libs/WorkspacesSettingsUtils.ts

Lines 143 to 166 in 2496dfa

	const allReports = orderedReportIDs.map((reportID) => reportsCollection?.[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`]);
	// If policyID is undefined, then all reports are checked whether they contain any brick road
	const policyReports = policyID ? Object.values(allReports).filter((report) => report?.policyID === policyID) : Object.values(allReports);
	let reportWithGBR: OnyxEntry<Report>;
	const reportWithRBR = policyReports.find((report) => {
	const brickRoad = report ? getBrickRoadForPolicy(report) : undefined;
	if (!reportWithGBR && brickRoad === CONST.BRICK_ROAD_INDICATOR_STATUS.INFO) {
	reportWithGBR = report;
	return false;
	}
	return brickRoad === CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR;
	});
	if (reportWithRBR) {
	return reportWithRBR;
	}
	if (reportWithGBR) {
	return reportWithGBR;
	}
	return undefined;

However, the policyReports contains undefined collection. orderedReportIDs contains valid reportID values, but when retrieving it from reportsCollection, we get undefined. It's because the reportsCollection isn't available yet.

App/src/libs/WorkspacesSettingsUtils.ts

Lines 41 to 48 in 2496dfa

	let reportsCollection: OnyxCollection<Report>;
	Onyx.connect({
	key: ONYXKEYS.COLLECTION.REPORT,
	waitForCollectionCallback: true,
	callback: (value) => {
	reportsCollection = value;
	},
	});

It has the same root cause as #56158 (comment).

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

I will propose the same main solution as #56158 (comment).

Instead of passing the list of reportIDs, we can directly pass the list of reports.

const [reports] = useOnyx(ONYXKEYS.COLLECTION.REPORT, {selector: (values) => {
    const newReports = {};
    orderedReportIDs.forEach((reportID) => {
        newReports[reportID] = values?.[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`];
    })
    return newReports;
}});
...
setChatTabBrickRoad(getChatTabBrickRoad(activeWorkspaceID, reports));

We won't need the allReports anymore because we will use the report collection from the param.

App/src/libs/WorkspacesSettingsUtils.ts

Lines 138 to 145 in 2496dfa

	function getChatTabBrickRoadReport(policyID: string | undefined, orderedReportIDs: string[] = []): OnyxEntry<Report> {
	if (!orderedReportIDs.length) {
	return undefined;
	}
	const allReports = orderedReportIDs.map((reportID) => reportsCollection?.[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`]);
	// If policyID is undefined, then all reports are checked whether they contain any brick road
	const policyReports = policyID ? Object.values(allReports).filter((report) => report?.policyID === policyID) : Object.values(allReports);

For the alternative solution, it's the same as the other issue I linked above.

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

N/A

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~021900188126174179653

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @allroundexperts (External)

[mallenexpensify]

Added status of HIGH cuz I suspect this affects most-all users (even though I never look at the dots at the bottom of the app)