Files
suwayomi-material-you-webui/src/modules/reader/components/viewer/pager/ReaderPagedPager.tsx
schroda 2ec42d962a Remove context usage from ReaderPage
In case many chapters are rendered, even just the HOC wrapper component re-render due to the context change increases the render time.

Thus, getting rid of these HOC wrapper re-renders by moving the context usage up to the ReaderViewer decreases the render time.
2025-02-03 17:17:35 +01:00

54 lines
1.7 KiB
TypeScript

/*
* Copyright (C) Contributors to the Suwayomi project
*
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
*/
import { memo } from 'react';
import { BasePager } from '@/modules/reader/components/viewer/pager/BasePager.tsx';
import { ReaderPagerProps } from '@/modules/reader/types/Reader.types.ts';
import { createReaderPage } from '@/modules/reader/utils/ReaderPager.utils.tsx';
const BaseReaderPagedPager = ({
onLoad,
onError,
pageLoadStates,
retryFailedPagesKeyPrefix,
...props
}: ReaderPagerProps) => {
const { currentPageIndex, totalPages } = props;
return (
<BasePager
{...props}
createPage={(page, pagesIndex, shouldLoad, shouldDisplay, _setRef, ...baseProps) =>
createReaderPage(
page,
pagesIndex,
true,
pageLoadStates[page.primary.index].loaded,
onLoad,
onError,
shouldLoad,
shouldDisplay && shouldLoad && currentPageIndex === page.primary.index,
currentPageIndex,
totalPages,
...baseProps,
pageLoadStates[page.primary.index].error ? retryFailedPagesKeyPrefix : undefined,
)
}
slots={{
boxProps: {
sx: {
margin: 'auto',
},
},
}}
/>
);
};
export const ReaderPagedPager = memo(BaseReaderPagedPager);