Reset "pageToScrollToIndex" after page selection

In case the current page changed after selecting a page, the previously selected page couldn't be selected again since the "pageToScrollToIndex" was still set to this page
This commit is contained in:
schroda
2024-12-28 01:28:12 +01:00
parent a69447384b
commit c5630ca5ce
5 changed files with 14 additions and 6 deletions

View File

@@ -70,6 +70,7 @@ const BaseReaderViewer = forwardRef(
{ {
currentPageIndex, currentPageIndex,
pageToScrollToIndex, pageToScrollToIndex,
setPageToScrollToIndex,
pages, pages,
setPages, setPages,
totalPages, totalPages,
@@ -90,6 +91,7 @@ const BaseReaderViewer = forwardRef(
ReaderStatePages, ReaderStatePages,
| 'currentPageIndex' | 'currentPageIndex'
| 'pageToScrollToIndex' | 'pageToScrollToIndex'
| 'setPageToScrollToIndex'
| 'pages' | 'pages'
| 'setPages' | 'setPages'
| 'totalPages' | 'totalPages'
@@ -228,6 +230,10 @@ const BaseReaderViewer = forwardRef(
// handle user page selection // handle user page selection
useLayoutEffect(() => { useLayoutEffect(() => {
if (pageToScrollToIndex == null) {
return;
}
const pageToScrollTo = getPage(pageToScrollToIndex, pages); const pageToScrollTo = getPage(pageToScrollToIndex, pages);
if (isContinuousReadingModeActive) { if (isContinuousReadingModeActive) {
@@ -251,6 +257,7 @@ const BaseReaderViewer = forwardRef(
const newPageIndex = getNextIndexFromPage(pageToScrollTo); const newPageIndex = getNextIndexFromPage(pageToScrollTo);
const isLastPage = newPageIndex === totalPages - 1; const isLastPage = newPageIndex === totalPages - 1;
setPageToScrollToIndex(null);
updateCurrentPageIndex(newPageIndex, !isLastPage); updateCurrentPageIndex(newPageIndex, !isLastPage);
}, [pageToScrollToIndex]); }, [pageToScrollToIndex]);
@@ -386,6 +393,7 @@ export const ReaderViewer = withPropsFrom(
[ [
'currentPageIndex', 'currentPageIndex',
'pageToScrollToIndex', 'pageToScrollToIndex',
'setPageToScrollToIndex',
'pages', 'pages',
'setPages', 'setPages',
'totalPages', 'totalPages',

View File

@@ -14,7 +14,7 @@ export const ReaderStatePagesContext = createContext<ReaderStatePages>({
totalPages: 0, totalPages: 0,
currentPageIndex: 0, currentPageIndex: 0,
setCurrentPageIndex: () => undefined, setCurrentPageIndex: () => undefined,
pageToScrollToIndex: 0, pageToScrollToIndex: null,
setPageToScrollToIndex: () => undefined, setPageToScrollToIndex: () => undefined,
setTotalPages: () => undefined, setTotalPages: () => undefined,
pageUrls: [], pageUrls: [],

View File

@@ -15,7 +15,7 @@ import { ReaderStatePages } from '@/modules/reader/types/ReaderProgressBar.types
export const ReaderStatePagesContextProvider = ({ children }: { children: ReactNode }) => { export const ReaderStatePagesContextProvider = ({ children }: { children: ReactNode }) => {
const [totalPages, setTotalPages] = useState<ReaderStatePages['totalPages']>(0); const [totalPages, setTotalPages] = useState<ReaderStatePages['totalPages']>(0);
const [currentPageIndex, setCurrentPageIndex] = useState<ReaderStatePages['currentPageIndex']>(0); const [currentPageIndex, setCurrentPageIndex] = useState<ReaderStatePages['currentPageIndex']>(0);
const [pageToScrollToIndex, setPageToScrollToIndex] = useState<ReaderStatePages['pageToScrollToIndex']>(0); const [pageToScrollToIndex, setPageToScrollToIndex] = useState<ReaderStatePages['pageToScrollToIndex']>(null);
const [pageUrls, setPageUrls] = useState<ReaderStatePages['pageUrls']>([]); const [pageUrls, setPageUrls] = useState<ReaderStatePages['pageUrls']>([]);
const [pageLoadStates, setPageLoadStates] = useState<ReaderStatePages['pageLoadStates']>([{ loaded: false }]); const [pageLoadStates, setPageLoadStates] = useState<ReaderStatePages['pageLoadStates']>([{ loaded: false }]);
const [pages, setPages] = useState<ReaderStatePages['pages']>([createPageData('', 0)]); const [pages, setPages] = useState<ReaderStatePages['pages']>([createPageData('', 0)]);

View File

@@ -181,7 +181,7 @@ const BaseReader = ({
}); });
setCurrentPageIndex(0); setCurrentPageIndex(0);
setPageToScrollToIndex(0); setPageToScrollToIndex(null);
setTotalPages(0); setTotalPages(0);
setPages([createPageData('', 0)]); setPages([createPageData('', 0)]);
setPageUrls([]); setPageUrls([]);
@@ -216,7 +216,7 @@ const BaseReader = ({
} else { } else {
setArePagesFetched(false); setArePagesFetched(false);
setCurrentPageIndex(0); setCurrentPageIndex(0);
setPageToScrollToIndex(0); setPageToScrollToIndex(null);
setTotalPages(0); setTotalPages(0);
setPages([createPageData('', 0)]); setPages([createPageData('', 0)]);
setPageUrls([]); setPageUrls([]);

View File

@@ -27,8 +27,8 @@ export interface ReaderStatePages {
setTotalPages: React.Dispatch<React.SetStateAction<number>>; setTotalPages: React.Dispatch<React.SetStateAction<number>>;
currentPageIndex: number; currentPageIndex: number;
setCurrentPageIndex: React.Dispatch<React.SetStateAction<number>>; setCurrentPageIndex: React.Dispatch<React.SetStateAction<number>>;
pageToScrollToIndex: number; pageToScrollToIndex: number | null;
setPageToScrollToIndex: React.Dispatch<React.SetStateAction<number>>; setPageToScrollToIndex: React.Dispatch<React.SetStateAction<number | null>>;
pageUrls: string[]; pageUrls: string[];
setPageUrls: React.Dispatch<React.SetStateAction<string[]>>; setPageUrls: React.Dispatch<React.SetStateAction<string[]>>;
pageLoadStates: { loaded: boolean; error?: boolean }[]; pageLoadStates: { loaded: boolean; error?: boolean }[];