Adding loading step to customize query selection

[robertandremitchell]

PULL REQUEST

Summary

This adds a loading step to the customize query step to prevent from getting ahead of the db load.

I think the only other open questions I had:

• do we want the customize query button unclickable until an actual selection is made? If you click the button, it just takes you to a blank version of the page, which could be a little confusing if the user does think they made a selection.

• is Social Determinants of Health supposed to be broken? Getting this error:
  No results found for query: Social Determinants of Health

I can open up a ticket to look more closely at it, but I wasn't sure if this was a known bug or if anyone knew offhand why it may now be broken.

Related Issue

Fixes #47

Acceptance Criteria

Please copy the acceptance criteria from your ticket and paste it here for your reviewer(s)

For frontend PR’s - include a description (including anything that’s out of scope) for what you want the designers to review

• ex: “Check out the whitespace on the page, as well as the dropdowns in the form. Here is the corresponding Figma link. You can ignore everything else. Also, the button at the bottom doesn’t work now”

Additional Information

Anything else the review team should know?

Checklist

• If this code affects the other scrum team, have they been notified? (In Slack, as reviewers, etc.)

[fzhao99]

For the good of the order, the proper UX pattern for this would be to implement a loading skeleton. Since we have enough to know what the overall layout of the page would be / on the happy path the page would load on the order of seconds, having a intermediary loading state that mimics the final result helps with user orientation / perceptions of load times.

Recognizing that's a bit out of scope though, my opinion is just having customize query disabled w/o the loading overlay is fine. Having the spinner blink through the loading state is a bit jarring for what we need at this point.

I think while you're at it, gating customize query selection until a valid option is selected is a good add!

[fzhao99]

lgtm!

[robertandremitchell]

made some follow-up tickets:

• Fix Social Determinants of Health in Customize Query Screen #52
• Add Skeleton Screen structure to LoadingView #51