Why so slow to detect current user logged in?

[treb.gatte]

I have an app where I have one group container for the user logged-out state and one group container for the user logged in state.

I have several OAuth methods available for logging in. Once the user completes the log in, the home page returns, showing the original logged out group for about 4 seconds. Then it switches to the logged in group. I’m seeing this even in the Bubble login method.

I’ve tried waits in the workflow, custom states to evaluate on page load, etc., and I can’t seem to get rid of the switching delay. The desire is to have the page open to the logged in experience immediately after log in.

You can see a video of the issue here where the login completes at 7 seconds and the switch is delayed until 11 secs in this case. It varies between 2-4 seconds. Debugger doesn’t show anything unusual. Loom | Free Screen & Video Recording Software

The signup process is run in the reusable header and then returns to the index page where the groups are hosted. The conditions that check for the user logged in state are on the groups.

Do I need a spinner or something here? Pointers to a plugin or how to do this manually?

Any ideas? Thanks!

[rukevweb]

Whenever someone logs in using oAuth, a ?code parameter is added to the page as Bubble logs the user in (which for some reason causes a delay), but means you can show a loading popup when this is not empty for the few seconds it takes (the parameter disappears once the login is complete). Hope that helps.

[treb.gatte]

Thank you @rukevweb! Your insights led me to a solution and I’ve got it working!

In case anyone needs a loading screen and comes here via search, here’s how I did it.

I added a group with a loading animated gif on it that is visible when the page loads.

The group is set to 100% height and width and has a background color of #ffffff. I set it up as a column layout and used the center setting so that the loading image is always centered.

In the Page Load workflow, I have a 1000ms delay and then I hide that group. This all works as expected and was simple once I understood what was going on underneath.