Reader preserve current page on reader mode change (#906)

* Reader: Re-scroll on reader mode change

* Simplify reading mode restore

https://github.com/Suwayomi/Suwayomi-WebUI/pull/906#discussion_r2009147119

Co-authored-by: schroda <50052685+schroda@users.noreply.github.com>

* Move effect as per suggestion

Co-authored-by: schroda <50052685+schroda@users.noreply.github.com>

---------

Co-authored-by: schroda <50052685+schroda@users.noreply.github.com>

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

@@ -260,10 +260,13 @@ const BaseReaderViewer = forwardRef(
             scrollElementRef,
             currentChapter?.id,
             currentChapterIndex,
+            currentPageIndex,
             chaptersToRender,
             visibleChapters,
+            readingMode,
             isContinuousReadingModeActive,
             readingDirection,
+            setPageToScrollToIndex,
         );
 
         useLayoutEffect(() => {

src/modules/reader/hooks/useReaderPreserveScrollPosition.ts

@@ -8,20 +8,24 @@
 
 import { RefObject, useEffect, useLayoutEffect, useRef } from 'react';
 import { ChapterIdInfo } from '@/modules/chapter/services/Chapters.ts';
-import { ReaderStateChapters, ReadingDirection } from '@/modules/reader/types/Reader.types.ts';
+import { ReaderStateChapters, ReadingDirection, ReadingMode } from '@/modules/reader/types/Reader.types.ts';
 import { getOptionForDirection } from '@/modules/theme/services/ThemeCreator.ts';
 import { READING_DIRECTION_TO_THEME_DIRECTION } from '@/modules/reader/constants/ReaderSettings.constants.tsx';
 import { getPreviousNextChapterVisibility } from '@/modules/reader/utils/Reader.utils.ts';
 import { TChapterReader } from '@/modules/chapter/Chapter.types.ts';
+import { ReaderStatePages } from '@/modules/reader/types/ReaderProgressBar.types';
 
 export const useReaderPreserveScrollPosition = (
     scrollElementRef: RefObject<HTMLElement | null>,
     currentChapterId: ChapterIdInfo['id'] | undefined,
     chapterIndex: number,
+    currentPageIndex: number,
     chaptersToRender: TChapterReader[],
     visibleChapters: ReaderStateChapters['visibleChapters'],
+    readingMode: ReadingMode,
     isContinuousReadingModeActive: boolean,
     readingDirection: ReadingDirection,
+    setPageToScrollToIndex: ReaderStatePages['setPageToScrollToIndex'],
 ) => {
     const scrollPosition = useRef({ left: 0, top: 0, scrollWidth: 0, scrollHeight: 0 });
 
@@ -91,4 +95,8 @@ export const useReaderPreserveScrollPosition = (
 
         scrollElement.scrollTo(newLeft, newTop);
     }, [currentChapterId]);
+
+    useLayoutEffect(() => {
+        setPageToScrollToIndex(currentPageIndex);
+    }, [readingMode]);
 };