Add logic to retry all errored pages
This commit is contained in:
@@ -51,12 +51,12 @@ export const ReaderPage = forwardRef(
|
||||
doublePage = false,
|
||||
position,
|
||||
shouldLoad,
|
||||
retryKeyPrefix,
|
||||
...props
|
||||
}: Omit<ComponentProps<typeof SpinnerImage>, 'ref' | 'spinnerStyle' | 'imgStyle'> & {
|
||||
display: boolean;
|
||||
doublePage?: boolean;
|
||||
position?: 'left' | 'right';
|
||||
onLoad?: () => void;
|
||||
},
|
||||
ref: ForwardedRef<HTMLImageElement | null>,
|
||||
) => {
|
||||
@@ -71,6 +71,7 @@ export const ReaderPage = forwardRef(
|
||||
|
||||
return (
|
||||
<SpinnerImage
|
||||
key={retryKeyPrefix}
|
||||
{...props}
|
||||
shouldLoad={shouldLoad}
|
||||
shouldDecode
|
||||
|
||||
@@ -47,8 +47,10 @@ export const ReaderViewer = forwardRef((_, ref: ForwardedRef<HTMLDivElement | nu
|
||||
setPages,
|
||||
totalPages,
|
||||
pageUrls,
|
||||
pageLoadStates,
|
||||
setPageLoadStates,
|
||||
transitionPageMode,
|
||||
retryFailedPagesKeyPrefix,
|
||||
} = userReaderStatePagesContext();
|
||||
const { readingMode, shouldOffsetDoubleSpreads, readingDirection } = ReaderService.useSettings();
|
||||
const { setScrollbarXSize, setScrollbarYSize } = useReaderScrollbarContext();
|
||||
@@ -227,6 +229,8 @@ export const ReaderViewer = forwardRef((_, ref: ForwardedRef<HTMLDivElement | nu
|
||||
currentPageIndex={currentPageIndex}
|
||||
pages={actualPages}
|
||||
transitionPageMode={transitionPageMode}
|
||||
pageLoadStates={pageLoadStates}
|
||||
retryFailedPagesKeyPrefix={retryFailedPagesKeyPrefix}
|
||||
imageRefs={imageRefs}
|
||||
onLoad={(pagesIndex, isPrimary = true) => {
|
||||
const page = actualPages[pagesIndex];
|
||||
@@ -240,7 +244,14 @@ export const ReaderViewer = forwardRef((_, ref: ForwardedRef<HTMLDivElement | nu
|
||||
img.src = url;
|
||||
}
|
||||
|
||||
setPageLoadStates((pageLoadStates) => pageLoadStates.toSpliced(index, 1, true));
|
||||
setPageLoadStates((statePageLoadStates) =>
|
||||
statePageLoadStates.toSpliced(index, 1, { loaded: true }),
|
||||
);
|
||||
}}
|
||||
onError={(pageIndex) => {
|
||||
setPageLoadStates((statePageLoadStates) =>
|
||||
statePageLoadStates.toSpliced(pageIndex, 1, { loaded: false, error: true }),
|
||||
);
|
||||
}}
|
||||
/>
|
||||
</Stack>
|
||||
|
||||
@@ -23,7 +23,7 @@ export const BasePager = ({
|
||||
imageRefs,
|
||||
createPage,
|
||||
slots,
|
||||
}: ReaderPagerProps & {
|
||||
}: Omit<ReaderPagerProps, 'pageLoadStates' | 'retryFailedPagesKeyPrefix'> & {
|
||||
createPage: (
|
||||
page: ReaderStatePages['pages'][number],
|
||||
pagesIndex: number,
|
||||
|
||||
@@ -37,7 +37,13 @@ const getPagePosition = (
|
||||
return isLtrReadingDirection ? 'right' : 'left';
|
||||
};
|
||||
|
||||
export const ReaderDoublePagedPager = ({ onLoad, ...props }: ReaderPagerProps) => {
|
||||
export const ReaderDoublePagedPager = ({
|
||||
onLoad,
|
||||
onError,
|
||||
pageLoadStates,
|
||||
retryFailedPagesKeyPrefix,
|
||||
...props
|
||||
}: ReaderPagerProps) => {
|
||||
const { currentPageIndex, pages, totalPages } = props;
|
||||
|
||||
const { readingDirection } = ReaderService.useSettings();
|
||||
@@ -63,10 +69,12 @@ export const ReaderDoublePagedPager = ({ onLoad, ...props }: ReaderPagerProps) =
|
||||
{createReaderPage(
|
||||
page,
|
||||
() => onLoad?.(pagesIndex),
|
||||
() => onError?.(primary.index),
|
||||
shouldLoad,
|
||||
shouldDisplay && isPrimaryPage,
|
||||
currentPage.primary.index,
|
||||
totalPages,
|
||||
pageLoadStates[primary.index].error ? retryFailedPagesKeyPrefix : undefined,
|
||||
hasSecondaryPage
|
||||
? getPagePosition('first', themeDirection, readingDirection.value)
|
||||
: undefined,
|
||||
@@ -76,10 +84,12 @@ export const ReaderDoublePagedPager = ({ onLoad, ...props }: ReaderPagerProps) =
|
||||
createReaderPage(
|
||||
{ ...page, primary: { ...page.secondary! } },
|
||||
() => onLoad?.(pagesIndex, false),
|
||||
() => onError?.(secondary.index),
|
||||
shouldLoad,
|
||||
shouldDisplay && isSecondaryPage,
|
||||
currentSecondaryPageIndex,
|
||||
totalPages,
|
||||
pageLoadStates[secondary.index].error ? retryFailedPagesKeyPrefix : undefined,
|
||||
getPagePosition('second', themeDirection, readingDirection.value),
|
||||
true,
|
||||
)}
|
||||
|
||||
@@ -13,7 +13,13 @@ import { applyStyles } from '@/modules/core/utils/ApplyStyles.ts';
|
||||
import { ReaderPagerProps, ReadingDirection } from '@/modules/reader/types/Reader.types.ts';
|
||||
import { createReaderPage } from '@/modules/reader/utils/ReaderPager.utils.tsx';
|
||||
|
||||
export const ReaderHorizontalPager = ({ onLoad, ...props }: ReaderPagerProps) => {
|
||||
export const ReaderHorizontalPager = ({
|
||||
onLoad,
|
||||
onError,
|
||||
pageLoadStates,
|
||||
retryFailedPagesKeyPrefix,
|
||||
...props
|
||||
}: ReaderPagerProps) => {
|
||||
const { currentPageIndex, totalPages } = props;
|
||||
|
||||
const { pageGap, readingDirection } = ReaderService.useSettings();
|
||||
@@ -28,10 +34,12 @@ export const ReaderHorizontalPager = ({ onLoad, ...props }: ReaderPagerProps) =>
|
||||
createReaderPage(
|
||||
page,
|
||||
() => onLoad?.(pagesIndex),
|
||||
() => onError?.(page.primary.index),
|
||||
shouldLoad,
|
||||
true,
|
||||
currentPageIndex,
|
||||
totalPages,
|
||||
pageLoadStates[page.primary.index].error ? retryFailedPagesKeyPrefix : undefined,
|
||||
undefined,
|
||||
undefined,
|
||||
setRef,
|
||||
|
||||
@@ -10,7 +10,13 @@ import { BasePager } from '@/modules/reader/components/viewer/pager/BasePager.ts
|
||||
import { ReaderPagerProps } from '@/modules/reader/types/Reader.types.ts';
|
||||
import { createReaderPage } from '@/modules/reader/utils/ReaderPager.utils.tsx';
|
||||
|
||||
export const ReaderPagedPager = ({ onLoad, ...props }: ReaderPagerProps) => {
|
||||
export const ReaderPagedPager = ({
|
||||
onLoad,
|
||||
onError,
|
||||
pageLoadStates,
|
||||
retryFailedPagesKeyPrefix,
|
||||
...props
|
||||
}: ReaderPagerProps) => {
|
||||
const { currentPageIndex, totalPages } = props;
|
||||
|
||||
return (
|
||||
@@ -20,10 +26,12 @@ export const ReaderPagedPager = ({ onLoad, ...props }: ReaderPagerProps) => {
|
||||
createReaderPage(
|
||||
page,
|
||||
() => onLoad?.(pagesIndex),
|
||||
() => onError?.(page.primary.index),
|
||||
shouldLoad,
|
||||
shouldDisplay && currentPageIndex === page.primary.index,
|
||||
currentPageIndex,
|
||||
totalPages,
|
||||
pageLoadStates[page.primary.index].error ? retryFailedPagesKeyPrefix : undefined,
|
||||
)
|
||||
}
|
||||
slots={{
|
||||
|
||||
@@ -11,7 +11,13 @@ import { BasePager } from '@/modules/reader/components/viewer/pager/BasePager.ts
|
||||
import { ReaderPagerProps } from '@/modules/reader/types/Reader.types.ts';
|
||||
import { createReaderPage } from '@/modules/reader/utils/ReaderPager.utils.tsx';
|
||||
|
||||
export const ReaderVerticalPager = ({ onLoad, ...props }: ReaderPagerProps) => {
|
||||
export const ReaderVerticalPager = ({
|
||||
onLoad,
|
||||
onError,
|
||||
pageLoadStates,
|
||||
retryFailedPagesKeyPrefix,
|
||||
...props
|
||||
}: ReaderPagerProps) => {
|
||||
const { currentPageIndex, totalPages } = props;
|
||||
|
||||
const { pageGap } = ReaderService.useSettings();
|
||||
@@ -23,10 +29,12 @@ export const ReaderVerticalPager = ({ onLoad, ...props }: ReaderPagerProps) => {
|
||||
createReaderPage(
|
||||
page,
|
||||
() => onLoad?.(pagesIndex),
|
||||
() => onError?.(page.primary.index),
|
||||
shouldLoad,
|
||||
true,
|
||||
currentPageIndex,
|
||||
totalPages,
|
||||
pageLoadStates[page.primary.index].error ? retryFailedPagesKeyPrefix : undefined,
|
||||
undefined,
|
||||
undefined,
|
||||
setRef,
|
||||
|
||||
Reference in New Issue
Block a user