Background: As a WWT user, I want to be informed regarding the loading status and errors, so that I can understand why I am not seeing WWT when I expect to see it.
Requirements:
- When the data is loading for WWT, the information bar should display the "loading state" (as shown in the mockup example below).
- The information bar should be a darker shade of blue.
- The text (in white) should read "Who Wrote That? is loading. This might take a while."
- When there is an API error, the information bar should display the "error state" (as shown in the mockup example below).
- The information bar should be red .
- The text (in white) should read (as default) "API Error: Please refresh the page or try again later."
- For 200 OK, the text should read: "API Error: Please try again later."
- For 429 Too Many Requests, the text should read: "API Error: Please try again later."
- For 400 Bad Request, the text should read: "API Error: Please contact us about this issue."
- For 503 Service Unavailable, the text should read: "API Error: Please contact us about this issue."
- For issues when the server is unreachable, the text should read: "API Error: Please contact us about this issue."
- The "contact us" text can be linked to a sub-heading of the Who Wrote That talk page. [active discussion about exact placement is in comments below]
- The error text should be implemented in a way that takes into account that we may have more targeted messaging based on specific errors in the future.
Notes
- For details regarding possible errors, refer to the investigation: T229714
Visual Examples:
Note: For the visual specifications, you may refer to the CSS provided in the Zeplin project link. You can click on a particular element to see detailed CSS info.