feat: add cache invalidation for series after updating or deleting read progress, and enhance BookGrid and BookList components with refresh functionality

src/components/series/BookGrid.tsx

@@ -2,7 +2,7 @@
 
 import type { KomgaBook } from "@/types/komga";
 import { BookCover } from "@/components/ui/book-cover";
-import { useState, useEffect } from "react";
+import { useState, useEffect, useRef } from "react";
 import { useTranslate } from "@/hooks/useTranslate";
 import { cn } from "@/lib/utils";
 import { useBookOfflineStatus } from "@/hooks/useBookOfflineStatus";
@@ -11,6 +11,7 @@ interface BookGridProps {
   books: KomgaBook[];
   onBookClick: (book: KomgaBook) => void;
   isCompact?: boolean;
+  onRefresh?: () => void;
 }
 
 interface BookCardProps {
@@ -61,12 +62,18 @@ function BookCard({ book, onBookClick, onSuccess, isCompact }: BookCardProps) {
   );
 }
 
-export function BookGrid({ books, onBookClick, isCompact = false }: BookGridProps) {
+export function BookGrid({ books, onBookClick, isCompact = false, onRefresh }: BookGridProps) {
   const [localBooks, setLocalBooks] = useState(books);
   const { t } = useTranslate();
+  const previousBookIdsRef = useRef<string>(books.map((b) => b.id).join(","));
 
   useEffect(() => {
-    setLocalBooks(books);
+    // Ne réinitialiser que si les IDs des livres ont changé (nouvelle page, nouveau filtre, etc.)
+    const newIds = books.map((b) => b.id).join(",");
+    if (previousBookIdsRef.current !== newIds) {
+      setLocalBooks(books);
+      previousBookIdsRef.current = newIds;
+    }
   }, [books]);
 
   if (!localBooks.length) {
@@ -107,6 +114,8 @@ export function BookGrid({ books, onBookClick, isCompact = false }: BookGridProp
         )
       );
     }
+    // Rafraîchir les données après avoir marqué comme lu/non lu
+    onRefresh?.();
   };
 
   return (

src/components/series/BookList.tsx

@@ -2,7 +2,7 @@
 
 import type { KomgaBook } from "@/types/komga";
 import { BookCover } from "@/components/ui/book-cover";
-import { useState, useEffect } from "react";
+import { useState, useEffect, useRef } from "react";
 import { useTranslate } from "@/hooks/useTranslate";
 import { cn } from "@/lib/utils";
 import { useBookOfflineStatus } from "@/hooks/useBookOfflineStatus";
@@ -18,6 +18,7 @@ interface BookListProps {
   books: KomgaBook[];
   onBookClick: (book: KomgaBook) => void;
   isCompact?: boolean;
+  onRefresh?: () => void;
 }
 
 interface BookListItemProps {
@@ -288,12 +289,18 @@ function BookListItem({ book, onBookClick, onSuccess, isCompact = false }: BookL
   );
 }
 
-export function BookList({ books, onBookClick, isCompact = false }: BookListProps) {
+export function BookList({ books, onBookClick, isCompact = false, onRefresh }: BookListProps) {
   const [localBooks, setLocalBooks] = useState(books);
   const { t } = useTranslate();
+  const previousBookIdsRef = useRef<string>(books.map((b) => b.id).join(","));
 
   useEffect(() => {
-    setLocalBooks(books);
+    // Ne réinitialiser que si les IDs des livres ont changé (nouvelle page, nouveau filtre, etc.)
+    const newIds = books.map((b) => b.id).join(",");
+    if (previousBookIdsRef.current !== newIds) {
+      setLocalBooks(books);
+      previousBookIdsRef.current = newIds;
+    }
   }, [books]);
 
   if (!localBooks.length) {
@@ -334,6 +341,8 @@ export function BookList({ books, onBookClick, isCompact = false }: BookListProp
         )
       );
     }
+    // Rafraîchir les données après avoir marqué comme lu/non lu
+    onRefresh?.();
   };
 
   return (

src/components/series/PaginatedBookGrid.tsx

@@ -21,6 +21,7 @@ interface PaginatedBookGridProps {
   totalElements: number;
   defaultShowOnlyUnread: boolean;
   showOnlyUnread: boolean;
+  onRefresh?: () => void;
 }
 
 export function PaginatedBookGrid({
@@ -30,6 +31,7 @@ export function PaginatedBookGrid({
   totalElements,
   defaultShowOnlyUnread,
   showOnlyUnread: initialShowOnlyUnread,
+  onRefresh,
 }: PaginatedBookGridProps) {
   const router = useRouter();
   const pathname = usePathname();
@@ -130,9 +132,9 @@ export function PaginatedBookGrid({
       </div>
 
       {viewMode === "grid" ? (
-        <BookGrid books={books} onBookClick={handleBookClick} isCompact={isCompact} />
+        <BookGrid books={books} onBookClick={handleBookClick} isCompact={isCompact} onRefresh={onRefresh} />
       ) : (
-        <BookList books={books} onBookClick={handleBookClick} isCompact={isCompact} />
+        <BookList books={books} onBookClick={handleBookClick} isCompact={isCompact} onRefresh={onRefresh} />
       )}
 
       <div className="flex flex-col items-center gap-4 sm:flex-row sm:justify-between">