Fix reader page preservation on window resize

For some reason mantines "useWindowEvent" uses a stale callback.
I have no clue why that happens, it is not reproducible in a codesandbox
This commit is contained in:
schroda
2026-05-15 21:10:18 +02:00
parent 60b6a39bdc
commit 89fe9cc00d
2 changed files with 7 additions and 3 deletions

View File

@@ -20,6 +20,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/).
- (**Reader**) Fix scrollbar appearing with "fit to widt/height/screen" page scale mode and applied safe area insets - (**Reader**) Fix scrollbar appearing with "fit to widt/height/screen" page scale mode and applied safe area insets
- (**Reader**) Fix wrongly positioned mobile progress bar current page indicator - (**Reader**) Fix wrongly positioned mobile progress bar current page indicator
- (**Reader**) Fix mobile progress bar previous/next chapter button visibility on hover and while disabled - (**Reader**) Fix mobile progress bar previous/next chapter button visibility on hover and while disabled
- (**Reader**) Fix jumping back to the first page on window resize
## [20260509.01] (r3147) - 2026-05-09 ## [20260509.01] (r3147) - 2026-05-09

View File

@@ -8,7 +8,6 @@
import type { RefObject } from 'react'; import type { RefObject } from 'react';
import { useCallback, useEffect, useLayoutEffect, useRef } from 'react'; import { useCallback, useEffect, useLayoutEffect, useRef } from 'react';
import { useWindowEvent } from '@mantine/hooks';
import type { import type {
IReaderSettingsManga, IReaderSettingsManga,
ReaderPageScaleMode, ReaderPageScaleMode,
@@ -73,7 +72,7 @@ const usePreserveOnWindowResize = (readingMode: ReadingMode, pageScaleMode: Read
return; return;
} }
getReaderPagesStore().setPageToScrollToIndex(pageIndexOnResizeStartRef.current); getReaderPagesStore().setPageToScrollToIndex(pageIndex);
clearTimeout(activeResizeTimeoutRef.current); clearTimeout(activeResizeTimeoutRef.current);
activeResizeTimeoutRef.current = setTimeout(() => { activeResizeTimeoutRef.current = setTimeout(() => {
@@ -82,7 +81,11 @@ const usePreserveOnWindowResize = (readingMode: ReadingMode, pageScaleMode: Read
}, 50); }, 50);
}, [readingMode, pageScaleMode, pageIndex]); }, [readingMode, pageScaleMode, pageIndex]);
useWindowEvent('resize', handleResize); // TODO - revert back to mantines useWindowEvent hook once the issue of it using a stale callback can be fixed
useEffect(() => {
window.addEventListener('resize', handleResize);
return () => window.removeEventListener('resize', handleResize);
}, [handleResize]);
}; };
interface ScrollPreservationInfo { interface ScrollPreservationInfo {