search

PulseTile / PulseTile-React-Core

PulseTile framework - developed with ReactJS
Apache License 2.0
10 stars 12 forks source link

Invoke detailed loading screens on First Login #278

Open simongamester opened 5 years ago

simongamester commented 5 years ago

When users log into Helm for the first time, there may be a delay between 10 and 120 seconds whilst records are retrieved. We have updated the spinner to include a progress bar and top tips during this waiting period, however these changes will remain hidden by default.

3 new classes can be added to the body class along to set the behaviour:

Below is an example of the short loading progress bar with tips. Body class is: "loading with-tips progress-short" http://jsfiddle.net/rootsol/eo15umbn/3/

Below is an example of the long loading progress bar with tips. Body class is: "loading with-tips progress-long" http://jsfiddle.net/rootsol/eo15umbn/4/

The application already sets the "loading" class when first logging in. We therefore need to add "with-tips" and "progress-long" ONLY when the user first logs in. If the loader is called elsewhere, these classes should not be added, which would default back to displaying just the spinner.

BogdanScherban commented 5 years ago

@simongamester

Simon, we looked at code examples in Jsfiddle, and we can suggest the following:

1) It isn't difficult to add class to , but we can't define connection speed and required connection time. For this reason we can't understand what type of progress bar (short or long) should we use. Or we have to always use "progress-long"?

2) When this information should be displayed? If it should be displayed after first user login - should we locate it after login in and before Terms and Conditions appears?

simongamester commented 5 years ago

  1. My understanding is that connection speed won't make the difference between 5 seconds and 120 seconds, it's the amount of medical records that etherCIS needs to aquire before the user can access the system. That's why we're only applying this loader to first login and not in all cases. I suggest we default to the long progress bar initially, however if we can determine the approximate amount of time it will take to aquire the records, we should use this to switch between the long and short progress bars accordingly. Rob - do you have any thoughts on this?

  2. The loader (main spinner) currently gets displayed after submitting the code received via sms message (see login.myhelm.org), which falls after the Terms and Conditions pop up. The terms and conditions is part of the login screen, not react, so won't have any influence on this. We therefore need to just update the loader from the point of submitting the SMS code up until the patient dashboard is displayed. Please note however that this should only be for first time logins.

simongamester commented 5 years ago

A quick update to the above:

  1. The with-tips and progress-short classes should be applied to the loader in all instances when logging in, not just when they're logging in for the first time. The api/initialise contains a new_patient property (documented here - https://github.com/PulseTile/PulseTile-React-Core/issues/277). When this is set to true, use the patient-long class, when false use patient-short.