HIGH: [UX Reliability] [$250] The loading spinner is not shown when a public room is accessed anonymously for the first time

[m-natarajan]

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: 1.4.55-0
Reproducible in staging?: y
Reproducible in production?: y
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by: @marcochavez
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1710955781785969

Action Performed:

Open chrome dev tools and click on Clear site data from Application tab
Navigate to a public room like https://staging.new.expensify.com/r/868417741568295

Expected Result:

The loading spinner is shown when a public room is accessed anonymously for the first time

Actual Result:

The loading spinner is not shown when a public room is accessed anonymously for the first time

Workaround:

unknown

Platforms:

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

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

Recording.2881.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01094c26a6aa176e3f
• Upwork Job ID: 1784727625880760320
• Last Price Increase: 2024-04-28
• Automatic offers:
• DylanDylann | Contributor | 0

[melvin-bot]

Triggered auto assignment to @adelekennedy (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[shahinyan11]

Proposal

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

The loading spinner is not shown when a public room is accessed anonymously for the first time

What is the root cause of that problem?

The SplashScreenHider component calls BootSplash.hide() when rendering. Here we hide the SplashScreenHider depended shouldHideSplash which is true as long as the opening of public room is in progress. ( Look at these lines and notice that the hasAttemptedToOpenPublicRoom is updated in the above useEffect with isCheckingPublicRoom in deeps ).

But isCheckingPublicRoom will be set to false until the process of opening the public room is completed in here which causes hasAttemptedToOpenPublicRoom to be set to true ahead of time.

And here isNetworkOffline is true because the callback of NetInfo.addEventListener is called multiple times and state.isInternetReachable is null during the first few calls

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

Remove this part of code. Since above we already call openReport(reportID, '', [], {}, '0', true); where the parameter isFromDeepLink is set true so Onyx.set(ONYXKEYS.IS_CHECKING_PUBLIC_ROOM, false) will always be called here.

What alternative solutions did you explore? (Optional)

Use a separate function subscribeToNetInfo for the web version .

function subscribeToNetInfo() {
    window.addEventListener('offline', (event) => {
        setOfflineStatus(true)
    });

    window.addEventListener('online', (event) => {
        setOfflineStatus(false)
    });
}    

What alternative solutions did you explore? (Optional)

1. Update this line like below

{!initialUrl && shouldHideSplash && <SplashScreenHider onHide={onSplashHide} />}

2. Add finally method for Navigation.waitForProtectedRoutes which will call BootSplash.hide

Navigation.waitForProtectedRoutes().then(() => {
    const route = ReportUtils.getRouteFromLink(url);

    if (route && Session.isAnonymousUser() && !Session.canAnonymousUserAccessRoute(route)) {
        Session.signOutAndRedirectToSignIn(true);
        return;
    }

    // We don't want to navigate to the exitTo route when creating a new workspace from a deep link,
    // because we already handle creating the optimistic policy and navigating to it in App.setUpPoliciesAndNavigate,
    // which is already called when AuthScreens mounts.
    if (new URL(url).searchParams.get('exitTo') === ROUTES.WORKSPACE_NEW) {
        return;
    }

    if (shouldSkipDeepLinkNavigation(route)) {
        return;
    }

    Navigation.navigate(route as Route, CONST.NAVIGATION.ACTION_TYPE.PUSH);
}).finally(BootSplash.hide);

[shahinyan11]

@adelekennedy The issue is still reproducible, would you mind to give some explanation why was it closed as completed ?

[marcochavezf]

I'm going to re-open since it's impacting the experience for new users in our existing public rooms

[melvin-bot]

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