refactor: update usePageNavigation hook to utilize refs for book and pages length, improving performance and reducing unnecessary dependencies

This commit is contained in:
Julien Froidefond
2025-10-29 14:01:14 +01:00
parent b49177ffbf
commit e0b90a7893

View File

@@ -29,19 +29,26 @@ export function usePageNavigation({
const [showEndMessage, setShowEndMessage] = useState(false); const [showEndMessage, setShowEndMessage] = useState(false);
const syncTimeoutRef = useRef<NodeJS.Timeout | null>(null); const syncTimeoutRef = useRef<NodeJS.Timeout | null>(null);
const currentPageRef = useRef(currentPage); const currentPageRef = useRef(currentPage);
const bookRef = useRef(book);
const pagesLengthRef = useRef(pages.length);
// Garder currentPage à jour dans la ref pour le cleanup // Garder les refs à jour
useEffect(() => { useEffect(() => {
currentPageRef.current = currentPage; currentPageRef.current = currentPage;
}, [currentPage]); }, [currentPage]);
useEffect(() => {
bookRef.current = book;
pagesLengthRef.current = pages.length;
}, [book, pages.length]);
// Sync progress // Sync progress
const syncReadProgress = useCallback( const syncReadProgress = useCallback(
async (page: number) => { async (page: number) => {
try { try {
ClientOfflineBookService.setCurrentPage(book, page); ClientOfflineBookService.setCurrentPage(bookRef.current, page);
const completed = page === pages.length; const completed = page === pagesLengthRef.current;
await fetch(`/api/komga/books/${book.id}/read-progress`, { await fetch(`/api/komga/books/${bookRef.current.id}/read-progress`, {
method: "PATCH", method: "PATCH",
headers: { "Content-Type": "application/json" }, headers: { "Content-Type": "application/json" },
body: JSON.stringify({ page, completed }), body: JSON.stringify({ page, completed }),
@@ -50,7 +57,7 @@ export function usePageNavigation({
logger.error({ err: error }, "Sync error:"); logger.error({ err: error }, "Sync error:");
} }
}, },
[book, pages.length] [] // Pas de dépendances car on utilise des refs
); );
const debouncedSync = useCallback( const debouncedSync = useCallback(