Use "BasePager" for infinite scroll chapter change detection

There can be cases where when scrolling backward/forward the first/last page never gets visible in the viewport due to a large width/height of another page.
In that case the intersection observer would never trigger and thus, the chapter wouldn't get changed.

By using the Pager, which always takes up the full width/height, this problem will not be possible, since the start/end of the Pager always enters or leaves the viewport.

src/modules/reader/components/viewer/ReaderChapterViewer.tsx

@@ -149,6 +149,7 @@ const BaseReaderChapterViewer = ({
     const ref = useRef<HTMLDivElement>(null);
     const isCurrentChapterRef = useRef(isCurrentChapter);
     const imageRefs = useRef<(HTMLElement | null)[]>(pages.map(() => null));
+    const pagerRef = useRef<HTMLDivElement>(null);
 
     const actualPages = useMemo(() => {
         const arePagesLoaded = !!totalPages;
@@ -404,14 +405,14 @@ const BaseReaderChapterViewer = ({
                 isCurrentChapter={isCurrentChapter}
                 isPreviousChapterVisible={isPreviousChapterVisible}
                 isNextChapterVisible={isNextChapterVisible}
-                firstImage={imageRefs.current[0]}
-                lastImage={imageRefs.current[imageRefs.current.length - 1]}
+                imageWrapper={pagerRef.current}
             />
             {((!isContinuousReadingModeActive && isCurrentChapter) ||
                 (isContinuousReadingModeActive && (isInitialChapter || isLeadingChapter))) && (
                 <ReaderTransitionPage chapterId={chapterId} type={ReaderTransitionPageMode.PREVIOUS} />
             )}
             <Pager
+                ref={pagerRef}
                 totalPages={totalPages}
                 currentPageIndex={currentPageIndex}
                 pages={actualPages}