feat: mark as read

src/components/ui/mark-as-read-button.tsx

@@ -0,0 +1,65 @@
+"use client";
+
+import { CheckCircle2 } from "lucide-react";
+import { Button } from "./button";
+import { useToast } from "./use-toast";
+
+interface MarkAsReadButtonProps {
+  bookId: string;
+  pagesCount: number;
+  isRead?: boolean;
+  onSuccess?: () => void;
+  className?: string;
+}
+
+export function MarkAsReadButton({
+  bookId,
+  pagesCount,
+  isRead = false,
+  onSuccess,
+  className,
+}: MarkAsReadButtonProps) {
+  const { toast } = useToast();
+
+  const handleMarkAsRead = async (e: React.MouseEvent) => {
+    e.stopPropagation(); // Empêcher la propagation au parent
+    try {
+      const response = await fetch(`/api/komga/books/${bookId}/read-progress`, {
+        method: "PATCH",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify({ page: pagesCount, completed: true }),
+      });
+
+      if (!response.ok) {
+        throw new Error("Erreur lors de la mise à jour");
+      }
+
+      toast({
+        title: "Succès",
+        description: "Le tome a été marqué comme lu",
+      });
+      onSuccess?.();
+    } catch (error) {
+      toast({
+        title: "Erreur",
+        description: "Impossible de marquer le tome comme lu",
+        variant: "destructive",
+      });
+    }
+  };
+
+  return (
+    <Button
+      variant="ghost"
+      size="icon"
+      onClick={handleMarkAsRead}
+      className={`h-8 w-8 p-0 rounded-br-lg rounded-tl-lg ${className}`}
+      disabled={isRead}
+      aria-label="Marquer comme lu"
+    >
+      <CheckCircle2 className="h-5 w-5" />
+    </Button>
+  );
+}