Adds a toggleable anonymous mode (eye icon in header) that: - Stops syncing read progress to the server while reading - Hides mark as read/unread buttons on book covers and lists - Hides reading status badges on series and books - Hides progress bars on series and book covers - Hides "continue reading" and "continue series" sections on home - Persists the setting server-side in user preferences (anonymousMode) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
43 lines
1.5 KiB
TypeScript
43 lines
1.5 KiB
TypeScript
import { ProgressBar } from "./progress-bar";
|
|
import { BookX } from "lucide-react";
|
|
import type { SeriesCoverProps } from "./cover-utils";
|
|
|
|
export function SeriesCover({
|
|
series,
|
|
alt = "Image de couverture",
|
|
className,
|
|
showProgressUi = true,
|
|
isAnonymous = false,
|
|
}: SeriesCoverProps) {
|
|
const isCompleted = isAnonymous ? false : series.bookCount === series.booksReadCount;
|
|
|
|
const readBooks = isAnonymous ? 0 : series.booksReadCount;
|
|
const totalBooks = series.bookCount;
|
|
const showProgress = Boolean(!isAnonymous && showProgressUi && totalBooks > 0 && readBooks > 0 && !isCompleted);
|
|
const missingCount = series.missingCount;
|
|
|
|
return (
|
|
<div className="relative w-full h-full">
|
|
<img
|
|
src={series.thumbnailUrl}
|
|
alt={alt}
|
|
loading="lazy"
|
|
className={[
|
|
"absolute inset-0 w-full h-full object-cover rounded-lg",
|
|
isCompleted ? "opacity-50" : "",
|
|
className || "",
|
|
]
|
|
.filter(Boolean)
|
|
.join(" ")}
|
|
/>
|
|
{showProgressUi && missingCount != null && missingCount > 0 && (
|
|
<div className="absolute top-1.5 right-1.5 flex items-center gap-0.5 rounded-full bg-orange-500/90 px-1.5 py-0.5 text-white shadow-md backdrop-blur-sm">
|
|
<BookX className="h-3 w-3" />
|
|
<span className="text-[10px] font-bold leading-none">{missingCount}</span>
|
|
</div>
|
|
)}
|
|
{showProgress ? <ProgressBar progress={readBooks} total={totalBooks} type="series" /> : null}
|
|
</div>
|
|
);
|
|
}
|