[HOLD for payment 2025-01-24] [$250] IOS - Empty screen seen when navigating back from workspace description the second time

[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.0.71-0
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: Y
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): nathanmulugetatesting+2338@gmail.com
Issue reported by: Applause - Internal Team

Action Performed:

1. Open IOS hybrid app
2. Create a workspace give it a custom description
3. Navigate to the inbox
4. Open workspace chat
5. Tap on the custom description to navigate to description setting of the workspace
6. Navigate back twice by tapping on the top left back icon until you reach workspace editor page
7. Tap on Workspace chat
8. Re do step 5
9. Tap on the top corner back icon or swipe from left to right

Expected Result:

Empty screen does not get shown

Actual Result:

Empty screen gets shown and the workspace profile settings page animation is wrong, it slides from right to left after the empty screen has been shown first

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

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

Screenshots/Videos

Add any screenshot/video evidence

Bug6684551_1733335793079.ScreenRecording_12-04-2024_21-02-36_1.1.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021865096772528155887
• Upwork Job ID: 1865096772528155887
• Last Price Increase: 2025-01-10
• Automatic offers:
• ishpaul777 | Reviewer | 105677024
• ikevin127 | Contributor | 105677027

Issue Owner

Current Issue Owner: @muttmuure

[melvin-bot]

Triggered auto assignment to @muttmuure (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]

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

[melvin-bot]

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

[ikevin127]

Proposal

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

Empty screen gets shown and the workspace profile settings page animation is wrong, it slides from right to left after the empty screen has been shown first.

What is the root cause of that problem?

TLDR: The same RCA detailed in my proposal of this other issue.

Note

This issue is only present on narrow layout devices (native / mWeb) where screens displayed in RHP act as a modal.

App/src/pages/workspace/WorkspaceInitialPage.tsx

Lines 360 to 376 in 3baf965

	// We are checking if the user can access the route.
	// If user can't access the route, we are dismissing any modals that are open when the NotFound view is shown
	const canAccessRoute = activeRoute && menuItems.some((item) => item.routeName === activeRoute);
	useEffect(() => {
	if (!shouldShowNotFoundPage && canAccessRoute) {
	return;
	}
	if (wasRendered.current) {
	return;
	}
	wasRendered.current = true;
	// We are dismissing any modals that are open when the NotFound view is shown
	Navigation.isNavigationReady().then(() => {
	Navigation.closeRHPFlow();
	});
	}, [canAccessRoute, shouldShowNotFoundPage]);

When we open the workspace's initial page, the active route becomes Workspace_Initial. However, the current canAccessRoute logic only checks for the sub-page route - therefore when it compares the active route with itself, it fails because menuItems doesn't contain Workspace_Initial.

We actually have the logic to only run it once here, but when we open the search page, all routes are "hidden" as explained here. Because of this, the wasRendered logic in WorkspaceInitialPage won't work as expected -> when we try to open the filter page, the previously "hidden" routes are added back to the stack and canAccessRoute becomes false which will dismiss any RHP that we try to open (Filters).

Credits to bernhardoj for the RCA.

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

We had a similar issue which I reviewed recently here where we navigated away from WorkspaceProfileSharePage to a report without dismissing the currently opened modal which caused a weird UI bug in the QR Code because the same modal would be opened twice.

Same as proposed in the other issue, a practical solution for this kind of problem is to simply replace the way we navigate away from WS to the report here:

App/src/pages/workspace/WorkspaceInitialPage.tsx

Line 457 in b595f5d

onPress={() => Navigation.navigate(ROUTES.REPORT_WITH_ID.getRoute(currentUserPolicyExpenseChat?.reportID ?? '-1'))}

to use Navigation.dismissModal instead:

onPress={() => Navigation.dismissModal(currentUserPolicyExpenseChat?.reportID ?? '-1')}

Why dismissing the modal first fixes our issue ?
Because as explained in RCA, on narrow layout devices (native / mWeb) screens displayed in RHP act as a modal and by dismissing it when navigating to the report, all the conditions which lead to the empty screen showing when navigating back in our case, will now work as expected.

Important

I proposed the same solution for this issue and because this solution would fix both issues, if my solution is selected on any of the two issues -> we should put the other one on HOLD.

Result video (before / after)

iOS: Native

Before	After
before.mp4	after.mp4