fix(web): accueil — rétablir la barre d'avancement dans les livres en cours (Meter avec progressPercent dans renderHomeBook, tuiles « en cours » pointant de nouveau vers le lecteur — correctif bug #47, régression de l'évolution #45)
This commit is contained in:
@ -3,7 +3,7 @@ import { BookOpen, LibraryBig, ScanLine } from "lucide-react";
|
||||
import { api } from "../api/client";
|
||||
import type { DashboardData } from "../api/types";
|
||||
import { bookDisplayTitle, bookVolumeLabel } from "../book/metadata";
|
||||
import { EmptyState, LoadingState, Panel } from "../components/ui";
|
||||
import { EmptyState, LoadingState, Meter, Panel } from "../components/ui";
|
||||
import { navigate } from "../router";
|
||||
|
||||
export function HomePage() {
|
||||
@ -26,10 +26,14 @@ export function HomePage() {
|
||||
|
||||
if (!state) return <LoadingState />;
|
||||
|
||||
const renderHomeBook = (item: DashboardData["books"][number], className = "home-book-card") => {
|
||||
const renderHomeBook = (
|
||||
item: DashboardData["books"][number],
|
||||
className = "home-book-card",
|
||||
options: { href?: string; progressPercent?: number } = {}
|
||||
) => {
|
||||
const volumeLabel = bookVolumeLabel(item);
|
||||
return (
|
||||
<button key={item.id} className={className} onClick={() => navigate(`/book/${item.id}`)}>
|
||||
<button key={item.id} className={className} onClick={() => navigate(options.href ?? `/book/${item.id}`)}>
|
||||
<span className="home-book-cover" aria-hidden="true">
|
||||
{item.coverPath ? <img src={api.bookCoverUrl(item.id)} alt="" /> : <BookOpen size={24} />}
|
||||
</span>
|
||||
@ -37,6 +41,7 @@ export function HomePage() {
|
||||
{volumeLabel && <span className="home-book-volume">{volumeLabel}</span>}
|
||||
<strong>{bookDisplayTitle(item)}</strong>
|
||||
<span>{item.author ?? "Auteur inconnu"}</span>
|
||||
{options.progressPercent !== undefined && <Meter value={options.progressPercent} />}
|
||||
</span>
|
||||
</button>
|
||||
);
|
||||
@ -63,7 +68,12 @@ export function HomePage() {
|
||||
</div>
|
||||
{state.continueReading.length ? (
|
||||
<div className="continue-grid">
|
||||
{state.continueReading.map((item) => renderHomeBook(item.book, "home-book-card continue-tile"))}
|
||||
{state.continueReading.map((item) =>
|
||||
renderHomeBook(item.book, "home-book-card continue-tile", {
|
||||
href: `/reader/${item.book.id}`,
|
||||
progressPercent: item.progress.percent
|
||||
})
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<EmptyState title="Aucune trace" detail="Les lectures reprises apparaitront ici." />
|
||||
|
||||
@ -21,6 +21,9 @@ describe("home progress list layout", () => {
|
||||
|
||||
expect(source).toContain("renderHomeBook");
|
||||
expect(source).toContain("home-book-card");
|
||||
expect(source).toContain("progressPercent");
|
||||
expect(source).toContain("<Meter value={options.progressPercent} />");
|
||||
expect(source).toContain("progressPercent: item.progress.percent");
|
||||
expect(source).not.toContain("<BookCard");
|
||||
expect(source).not.toContain("FormatPill");
|
||||
expect(source).not.toContain("bookMetadataState");
|
||||
|
||||
Reference in New Issue
Block a user