ChoChoX/suwayomi-material-you-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Revert "Reduce rerenders on current page changes"

Browse Source 
This reverts commit 3e9078420a.

Fixes #1040
This commit is contained in:
schroda
2025-12-02 21:51:44 +01:00
parent 8358a2f51e
commit 13d6d1e525
1 changed files with 27 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
src/features/reader/hooks/useReaderSetChaptersState.ts
View File

@@ -6,7 +6,7 @@
* file, You can obtain one at https://mozilla.org/MPL/2.0/. * file, You can obtain one at https://mozilla.org/MPL/2.0/.
*/ */
import { useEffect, useMemo, useRef } from 'react'; import { useEffect } from 'react';
import { useLocation, useNavigate } from 'react-router-dom'; import { useLocation, useNavigate } from 'react-router-dom';
import { Chapters } from '@/features/chapter/services/Chapters.ts'; import { Chapters } from '@/features/chapter/services/Chapters.ts';
import { requestManager } from '@/lib/requests/RequestManager.ts'; import { requestManager } from '@/lib/requests/RequestManager.ts';
@@ -40,66 +40,36 @@ export const useReaderSetChaptersState = (
const { updateInitialChapter } = locationState ?? {}; const { updateInitialChapter } = locationState ?? {};
const finalInitialChapter = updateInitialChapter ? undefined : initialChapter; const finalInitialChapter = updateInitialChapter ? undefined : initialChapter;
const newMangaChapters = chaptersResponse.data?.chapters.nodes;
const newCurrentChapter = useMemo(
() => (newMangaChapters ? (newMangaChapters[newMangaChapters.length - chapterSourceOrder] ?? null) : undefined),
[newMangaChapters, chapterSourceOrder],
);
const newInitialChapter = finalInitialChapter ?? newCurrentChapter;
const newChapterForDuplicatesHandling = chapterForDuplicatesHandling ?? newCurrentChapter;
const filteredChapters = useMemo(() => {
if (!newMangaChapters) {
return newMangaChapters;
}
return shouldSkipFilteredChapters
? filterChapters(mangaChapters ?? newMangaChapters, chapterListOptions)
: newMangaChapters;
}, [newMangaChapters, shouldSkipFilteredChapters, mangaChapters, chapterListOptions]);
const uniqueChapters = useMemo(() => {
if (!filteredChapters || !newChapterForDuplicatesHandling) {
return filteredChapters;
}
return shouldSkipDupChapters
? Chapters.removeDuplicates(newChapterForDuplicatesHandling, filteredChapters)
: filteredChapters;
}, [filteredChapters, shouldSkipDupChapters, newChapterForDuplicatesHandling]);
const visibleChapters = useMemo(() => {
if (!uniqueChapters) {
return [];
}
return uniqueChapters.map((chapter) => getReaderChapterFromCache(chapter.id)!);
}, [uniqueChapters]);
const prevVisibleChaptersRef = useRef<typeof visibleChapters>([]);
useEffect(() => { useEffect(() => {
// Check if visibleChapters actually changed by comparing chapter IDs const newMangaChapters = chaptersResponse.data?.chapters.nodes;
const hasChaptersChanged = const newCurrentChapter = newMangaChapters
visibleChapters.length !== prevVisibleChaptersRef.current.length || ? (newMangaChapters[newMangaChapters.length - chapterSourceOrder] ?? null)
visibleChapters.some((chapter, index) => chapter.id !== prevVisibleChaptersRef.current[index]?.id); : undefined;
const newInitialChapter = finalInitialChapter ?? newCurrentChapter;
const newChapterForDuplicatesHandling = chapterForDuplicatesHandling ?? newCurrentChapter;
// Use the previous reference if chapters haven't actually changed const visibleChapters = (() => {
const stableVisibleChapters = hasChaptersChanged ? visibleChapters : prevVisibleChaptersRef.current; if (!newMangaChapters || !newChapterForDuplicatesHandling) {
return [];
}
// Update the ref for next comparison const filteredChapters = shouldSkipFilteredChapters
if (hasChaptersChanged) { ? filterChapters(mangaChapters ?? newMangaChapters, chapterListOptions)
prevVisibleChaptersRef.current = visibleChapters; : newMangaChapters;
} const uniqueChapters = shouldSkipDupChapters
? Chapters.removeDuplicates(newChapterForDuplicatesHandling, filteredChapters)
: filteredChapters;
return uniqueChapters.map((chapter) => getReaderChapterFromCache(chapter.id)!);
})();
const nextChapter = const nextChapter =
newCurrentChapter && newCurrentChapter &&
Chapters.getNextChapter(newCurrentChapter, stableVisibleChapters, { Chapters.getNextChapter(newCurrentChapter, visibleChapters, {
offset: DirectionOffset.NEXT, offset: DirectionOffset.NEXT,
}); });
const previousChapter = const previousChapter =
newCurrentChapter && newCurrentChapter &&
Chapters.getNextChapter(newCurrentChapter, stableVisibleChapters, { Chapters.getNextChapter(newCurrentChapter, visibleChapters, {
offset: DirectionOffset.PREVIOUS, offset: DirectionOffset.PREVIOUS,
}); });
@@ -115,7 +85,7 @@ export const useReaderSetChaptersState = (
return { return {
...prevState, ...prevState,
mangaChapters: prevState.mangaChapters ?? newMangaChapters, mangaChapters: prevState.mangaChapters ?? newMangaChapters,
chapters: stableVisibleChapters, chapters: visibleChapters,
initialChapter: newInitialChapter, initialChapter: newInitialChapter,
chapterForDuplicatesHandling: newChapterForDuplicatesHandling, chapterForDuplicatesHandling: newChapterForDuplicatesHandling,
currentChapter: newCurrentChapter, currentChapter: newCurrentChapter,
@@ -140,12 +110,11 @@ export const useReaderSetChaptersState = (
}; };
}); });
}, [ }, [
visibleChapters, chaptersResponse.data?.chapters.nodes,
newCurrentChapter, chapterSourceOrder,
newInitialChapter, shouldSkipDupChapters,
shouldSkipFilteredChapters,
finalInitialChapter, finalInitialChapter,
newMangaChapters, chapterListOptions,
newChapterForDuplicatesHandling,
locationState,
]); ]);
}; };