This PR addresses Issue #76 which requests that image loading errors be handled with the substitution of a placeholder image.
Changes
Selected a magnifying glass as a preliminary placeholder image. Gave the image a dark orange drop-shadow to give it the appearance of a warning or urgent matter while keeping the UI usable. I want to notify the user but ultimately leave things as pleasant and usable as possible so they don't feel pressured to fix the issue immediately, it can be handled on their own time, the link will still operate in the meantime.
useCacheImage was updated to substitute a placeholder image when there is a failure loading the intended image and return an error object to allow the caller to handle as they see fit. Here I use it to supply alternate title and style attribute values on error.
Updated the Dial component to use the new error response:
Implemented useCacheImage in the DialDetails component to further reduce outbound image requests:
Summary
This PR addresses Issue #76 which requests that image loading errors be handled with the substitution of a placeholder image.
Changes
useCacheImagewas updated to substitute a placeholder image when there is a failure loading the intended image and return an error object to allow the caller to handle as they see fit. Here I use it to supply alternatetitleandstyleattribute values on error.Dialcomponent to use the new error response:useCacheImagein theDialDetailscomponent to further reduce outbound image requests: