Page MenuHomePhabricator

Show a loading indicator for suggestions
Closed, ResolvedPublic

Description

In the Translations dashboard, users can access the suggestions view. When landing in the suggestions view some suggestions are loaded immediately, but other suggestions appear after a few seconds.

Oct-13-2017 11-14-51.gif (640×419 px, 3 MB)

We should communicate better the loading to avoid the new results to come as a surprise.
Showing the three pulsing circles that is used as a loading indicator in the editing view can work here. We can show them at the top of the list of suggestions (right below the title) as part of a new element using Base90 ( #F8F9FA) as background for further distinction.

The idea is illustrated below (although you'll have to imagine the three dots moving):

cx-dashboard-loading.png (1,024×768 px, 143 KB)

Event Timeline

Change 385145 had a related patch set uploaded (by Petar.petkovic; owner: Petar.petkovic):
[mediawiki/extensions/ContentTranslation@master] Show a loading indicator for suggestions

https://gerrit.wikimedia.org/r/385145

Change 385145 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] Show a loading indicator for suggestions

https://gerrit.wikimedia.org/r/385145

Change 388457 had a related patch set uploaded (by Esanders; owner: Esanders):
[mediawiki/extensions/ContentTranslation@master] Apply box shadow to header/list wrappers on suggestions page

https://gerrit.wikimedia.org/r/388457

Change 388457 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] Apply box shadow to header/list wrappers on suggestions page

https://gerrit.wikimedia.org/r/388457

Checked in cx-testing

  • the three pulsing circles are shown when suggestions are being loaded after choosing a new language

Screen Shot 2017-11-09 at 1.31.15 PM.png (1,171×554 px, 97 KB)

  • when "Refresh suggestions" is clicked

Screen Shot 2017-11-09 at 1.28.39 PM.png (933×560 px, 114 KB)