refacto: cover split and simplify

src/components/ui/book-cover.tsx

@@ -0,0 +1,37 @@
+"use client";
+
+import { CoverClient } from "./cover-client";
+import { ProgressBar } from "./progress-bar";
+import { BookCoverProps, getImageUrl } from "./cover-utils";
+import { ClientOfflineBookService } from "@/lib/services/client-offlinebook.service";
+
+export function BookCover({
+  book,
+  alt = "Image de couverture",
+  className,
+  quality = 80,
+  sizes = "100vw",
+}: BookCoverProps) {
+  if (!book) return null;
+
+  const imageUrl = getImageUrl("book", book.id);
+  const isCompleted = book.readProgress?.completed || false;
+
+  const currentPage = ClientOfflineBookService.getCurrentPage(book);
+  const totalPages = book.media.pagesCount;
+  const showProgress = currentPage && totalPages && currentPage > 0 && !isCompleted;
+
+  return (
+    <div className="relative w-full h-full">
+      <CoverClient
+        imageUrl={imageUrl}
+        alt={alt}
+        className={className}
+        quality={quality}
+        sizes={sizes}
+        isCompleted={isCompleted}
+      />
+      {showProgress && <ProgressBar progress={currentPage} total={totalPages} type="book" />}
+    </div>
+  );
+}

src/components/ui/cover-utils.tsx

@@ -0,0 +1,23 @@
+import { KomgaBook, KomgaSeries } from "@/types/komga";
+
+export interface BaseCoverProps {
+  alt?: string;
+  className?: string;
+  quality?: number;
+  sizes?: string;
+}
+
+export interface BookCoverProps extends BaseCoverProps {
+  book?: KomgaBook;
+}
+
+export interface SeriesCoverProps extends BaseCoverProps {
+  series: KomgaSeries;
+}
+
+export function getImageUrl(type: "series" | "book", id: string) {
+  if (type === "series") {
+    return `/api/komga/images/series/${id}/thumbnail`;
+  }
+  return `/api/komga/images/books/${id}/thumbnail`;
+}

src/components/ui/cover.tsx

@@ -1,79 +0,0 @@
-"use client";
-
-import { CoverClient } from "./cover-client";
-import { ProgressBar } from "./progress-bar";
-
-interface BaseCoverProps {
-  type: "series" | "book";
-  id: string;
-  alt?: string;
-  className?: string;
-  quality?: number;
-  sizes?: string;
-  isCompleted?: boolean;
-}
-
-interface BookCoverProps extends BaseCoverProps {
-  type: "book";
-  currentPage?: number;
-  totalPages?: number;
-}
-
-interface SeriesCoverProps extends BaseCoverProps {
-  type: "series";
-  readBooks?: number;
-  totalBooks?: number;
-}
-
-type CoverProps = BookCoverProps | SeriesCoverProps;
-
-function getImageUrl(type: "series" | "book", id: string) {
-  if (type === "series") {
-    return `/api/komga/images/series/${id}/thumbnail`;
-  }
-  return `/api/komga/images/books/${id}/thumbnail`;
-}
-
-export function Cover(props: CoverProps) {
-  const {
-    type,
-    id,
-    alt = "Image de couverture",
-    className,
-    quality = 80,
-    sizes = "100vw",
-    isCompleted = false,
-  } = props;
-
-  const imageUrl = getImageUrl(type, id);
-
-  const showProgress = () => {
-    if (type === "book") {
-      const { currentPage, totalPages } = props;
-      return currentPage && totalPages && currentPage > 0 && !isCompleted ? (
-        <ProgressBar progress={currentPage} total={totalPages} type="book" />
-      ) : null;
-    }
-
-    if (type === "series") {
-      const { readBooks, totalBooks } = props;
-      return readBooks && totalBooks && readBooks > 0 && !isCompleted ? (
-        <ProgressBar progress={readBooks} total={totalBooks} type="series" />
-      ) : null;
-    }
-  };
-
-  return (
-    <div className="relative w-full h-full">
-      <CoverClient
-        imageUrl={imageUrl}
-        alt={alt}
-        className={className}
-        quality={quality}
-        sizes={sizes}
-        isCompleted={isCompleted}
-      />
-      {showProgress()}
-    </div>
-  );
-}

src/components/ui/series-cover.tsx

@@ -0,0 +1,36 @@
+"use client";
+
+import { CoverClient } from "./cover-client";
+import { ProgressBar } from "./progress-bar";
+import { SeriesCoverProps, getImageUrl } from "./cover-utils";
+
+export function SeriesCover({
+  series,
+  alt = "Image de couverture",
+  className,
+  quality = 80,
+  sizes = "100vw",
+}: SeriesCoverProps) {
+  if (!series) return null;
+
+  const imageUrl = getImageUrl("series", series.id);
+  const isCompleted = series.booksCount === series.booksReadCount;
+
+  const readBooks = series.booksReadCount;
+  const totalBooks = series.booksCount;
+  const showProgress = readBooks && totalBooks && readBooks > 0 && !isCompleted;
+
+  return (
+    <div className="relative w-full h-full">
+      <CoverClient
+        imageUrl={imageUrl}
+        alt={alt}
+        className={className}
+        quality={quality}
+        sizes={sizes}
+        isCompleted={isCompleted}
+      />
+      {showProgress && <ProgressBar progress={readBooks} total={totalBooks} type="series" />}
+    </div>
+  );
+}