Skip to content
This repository has been archived by the owner on Nov 28, 2022. It is now read-only.

Redesigning the error and loading states in the reference demo #226

Merged
merged 4 commits into from
Jul 26, 2019

Conversation

erunion
Copy link
Member

@erunion erunion commented Jul 2, 2019

This introduces a few minor redesigns to our https://preview.readme.io/reference/ page and introduces:

  • A loading state.
  • Handling error states a little differently and removing the "Like what you see?" box if errors are present.

Loading state

Screen Shot 2019-07-02 at 2 32 31 PM

Better error handling

Old:
Screen Shot 2019-07-02 at 2 30 57 PM

Refreshed:
Screen Shot 2019-07-02 at 2 30 18 PM

@erunion erunion added the type:enhancement A potential new feature to be added, or an improvement we could make label Jul 2, 2019
@erunion erunion requested review from mjcuva and kanadgupta July 2, 2019 21:33
@erunion erunion force-pushed the enhancement/preview-loading-design-tweaks branch from 3e1d267 to dfdfe7d Compare July 2, 2019 21:36
@erunion erunion requested a review from domharrington July 8, 2019 16:34
Copy link
Member

@kanadgupta kanadgupta left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested it locally and it looks good to me!

Copy link
Member

@mjcuva mjcuva left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We should show an error message when the swagger file is invalid. Currently it just gets stuck on the loading screen.

Example file: http://localhost:9966/reference/?url=https://gist.githubusercontent.com/mjcuva/33ca8b2d6615f7a14fb351a4db7dffca/raw/6a585cddf593a1cb7fb5be5670cab81a6d7ee4d1/invalid-swagger.json

@erunion erunion requested a review from rafegoldberg July 17, 2019 22:27
@erunion
Copy link
Member Author

erunion commented Jul 17, 2019

@mjcuva This is ready for review again!

@mjcuva
Copy link
Member

mjcuva commented Jul 18, 2019

If there is a validation error , can we move it inside the "Couldn't be loaded" section and change the copy to be "Invalid API Specification" with the error beneath it and a link to the validation report?

Similar to this (but we can leave the same design we currently have):
image

We shouldn't ever show the "Fetching Swagger/OAS file/Converting Swagger file to OAS 3 stuff"

@erunion
Copy link
Member Author

erunion commented Jul 25, 2019

@mjcuva @rafegoldberg This is ready for review again. I've revised the error states on the preview site to no longer show our debugging "status" text (while retaining it on the demo site since that's more for Explorer development).

Preview site

Unable to parse a spec

Screen Shot 2019-07-25 at 9 49 33 AM

Unable to fetch a spec

Screen Shot 2019-07-25 at 9 49 48 AM

Demo site

Unable to parse a spec

Screen Shot 2019-07-25 at 9 49 37 AM

Unable to fetch a spec

Screen Shot 2019-07-25 at 9 49 54 AM

Copy link
Member

@mjcuva mjcuva left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great!

@erunion erunion merged commit fa557e1 into master Jul 26, 2019
@erunion erunion deleted the enhancement/preview-loading-design-tweaks branch July 26, 2019 18:01
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
type:enhancement A potential new feature to be added, or an improvement we could make
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants