Zulip-desktop: Loading indicator while navigating in webview

[abhigyank]

Add some kind of indicator of loading when we move from one page to another in a webview.
Example: When one logs in (especially through third party auth) or logs out, add an indication that the request for logging in or logging out has taken place and that the next webpage is loading.

This can be added just like a browser like Chrome shows loading indicator by changing the reload button when a page is loading.

Discussion can be found here.

[abhigyank]

@zulipbot label "Type: Enhancement"

[kanishk98]

@zulipbot claim

[kanishk98]

While it's easy to handle the logout case, I'm not sure of how to take care of _all_ requests that should prompt a spinner to come up. As indicated here, we could either just check for GitHub/Google logins by keeping an eye on all network requests being made, or we could define a list of certain operations that do not require a spinner in the webview (or a loading icon in the sidebar, as suggested by @abhigyank) and then display an indicator for everything else.

I think this needs a little more discussion for a good implementation.

[kanishk98]

I'd also like to add that I'm not sure if a spinner is the best way to show progress here. I think GitHub's approach is one we could borrow here: display some non-invasive progress line at the top of the webview. This would make our work (as listed above) easier as well because we won't have to maintain a list of operations that do _not_ require a progress list (even if it's a message being sent, which requires a network request, the indicator is pretty standard in apps like iMessage).

The only network request I can think of where a progress line would be unnecessary is the downloading of profile images. I believe we can disqualify those easily.

Since this is a design-related issue, I'd like some suggestions here. @rishig what would you suggest?

[rishig]

I think we do want an infinite loading indicator, rather than a progress bar, since progress bars are often a lot of work to get right.

Just tried this out, and even on pretty good internet I can see that e.g. clicking on "Log in with Google" is slow enough that you're tempted to click again. For buttons like that I think the right solution can be to add a loading indicator in the button itself.

On screens where there isn't a button we control, I think either using our loading screen indicator (the green dots) or putting a loading indicator on the realm icon could both make sense.

[rishig]

(And agreed with a comment in the czo thread that e.g. putting a loading indicator on the google button sounds like a webapp project.)

[kanishk98]

For buttons like that I think the right solution can be to add a loading indicator in the button itself.

Yeah, that'd solve the problem.

On screens where there isn't a button we control, I think either using our loading screen indicator (the green dots) or putting a loading indicator on the realm icon could both make sense.

Hasn't that already been addressed though? I think @abhigyank's main concern was the login flow, and if this needs to be taken up on the webapp side, then there's not much else for us to do here.

[kanishk98]

@rishig @abhigyank please let me know how to go ahead with solving this problem - it is a pretty disconcerting bug. If you think that there's nothing else to be done on the desktop app, should I abandon the issue here and raise it in the webapp repo?

[rishig]

yeah, that sounds like a good plan. Seems like it shouldn't be a hard fix. Thanks for keeping track of this!

[abhigyank]

I think the putting a loading indicator on the google and other auth buttons could be on the webapp. But I guess the the indication would be limited to the buttons then. What happens when you click on login in the Google Auth page (It feels stuck/hang after entering credentials on Google/Github) ? We can't control that and other pages. Plus there is the logout too (that is not much of a use-case I guess). So I suppose, a desktop centric minimal "loading" indication would be good.

[kanishk98]

We can't control that and other pages.

Hmm, I think you're right. I ignored the login flow after the buttons on our webapp.
Okay, I'll read about how browsers identify when to show the loading icon (they don't show one when I send a message here, for example, even though it's a network request), and I'll write that into our sidebar icon.

Thanks for the help!

[zulipbot]

Hello @kanishk98, you have been unassigned from this issue because you have not updated this issue or any referenced pull requests for over 14 days.

You can reclaim this issue or claim any other issue by commenting @zulipbot claim on that issue.

Thanks for your contributions, and hope to see you again soon!

[kanishk98]

Opened a PR that should fix this issue.