Fix reader page retry button in continuous reading modes
In these modes the reader does not load leading pages to prevent the resulting layout shift on load. This behavior prevented the retry button functionality. Due to the way loading/failed pages are rendered and how the current page is detected, it's possible that the retry button for a leading page is visible, which resulted in showing a retry button without any functionality. fixes #1088
This commit is contained in:
@@ -75,14 +75,16 @@ export const SpinnerImage = ({ ref, ...props }: SpinnerImageProps) => {
|
||||
|
||||
const showMissingImageIcon = !src.length;
|
||||
|
||||
const previousSrc = usePrevious(src);
|
||||
|
||||
const [imageSourceUrl, setImageSourceUrl] = useState<string>();
|
||||
const [imgLoadRetryKey, setImgLoadRetryKey] = useState(0);
|
||||
const [isLoading, setIsLoading] = useState<boolean>();
|
||||
const [hasError, setHasError] = useState(false);
|
||||
const [isVisible, setIsVisible] = useState(false);
|
||||
|
||||
const previousSrc = usePrevious(src);
|
||||
const previousImgLoadRetryKey = usePrevious(imgLoadRetryKey);
|
||||
const previousRetryKeyPrefix = usePrevious(retryKeyPrefix);
|
||||
|
||||
const updateImageState = (loading: boolean, error: boolean = false, aborted: boolean = false) => {
|
||||
setIsLoading(loading);
|
||||
setHasError(error);
|
||||
@@ -105,7 +107,15 @@ export const SpinnerImage = ({ ref, ...props }: SpinnerImageProps) => {
|
||||
const didSrcChange = previousSrc !== src;
|
||||
const isLoadedAndSrcUnchanged = !!imageSourceUrl && !didSrcChange;
|
||||
|
||||
if (showMissingImageIcon || !shouldLoad || isLoadedAndSrcUnchanged) {
|
||||
const isLocalRetry =
|
||||
hasError && previousImgLoadRetryKey !== undefined && previousImgLoadRetryKey !== imgLoadRetryKey;
|
||||
const isGlobalRetry =
|
||||
hasError && previousRetryKeyPrefix !== undefined && previousRetryKeyPrefix !== retryKeyPrefix;
|
||||
const isRetry = isLocalRetry || isGlobalRetry;
|
||||
|
||||
const finalShouldLoad = shouldLoad || isRetry;
|
||||
|
||||
if (showMissingImageIcon || !finalShouldLoad || isLoadedAndSrcUnchanged) {
|
||||
return () => {};
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user