blomios/ReadaBook
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

merge: fix/47-home-continue-meter dans develop (barre d'avancement rétablie dans les livres en cours de l'accueil — correctif #47)

Browse Source
This commit is contained in:
Git Agent
2026-08-28 23:36:15 +02:00
parent 28ee33bd0b 72f43c629d
commit 8d5d1bc2ff
2 changed files with 17 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
apps/web/src/pages/HomePage.tsx
View File

@ -3,7 +3,7 @@ import { BookOpen, LibraryBig, ScanLine } from "lucide-react";
import { api } from "../api/client"; import { api } from "../api/client";
import type { DashboardData } from "../api/types"; import type { DashboardData } from "../api/types";
import { bookDisplayTitle, bookVolumeLabel } from "../book/metadata"; 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"; import { navigate } from "../router";
export function HomePage() { export function HomePage() {
@ -26,10 +26,14 @@ export function HomePage() {
if (!state) return <LoadingState />; 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); const volumeLabel = bookVolumeLabel(item);
return ( 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"> <span className="home-book-cover" aria-hidden="true">
{item.coverPath ? <img src={api.bookCoverUrl(item.id)} alt="" /> : <BookOpen size={24} />} {item.coverPath ? <img src={api.bookCoverUrl(item.id)} alt="" /> : <BookOpen size={24} />}
</span> </span>
@ -37,6 +41,7 @@ export function HomePage() {
{volumeLabel && <span className="home-book-volume">{volumeLabel}</span>} {volumeLabel && <span className="home-book-volume">{volumeLabel}</span>}
<strong>{bookDisplayTitle(item)}</strong> <strong>{bookDisplayTitle(item)}</strong>
<span>{item.author ?? "Auteur inconnu"}</span> <span>{item.author ?? "Auteur inconnu"}</span>
{options.progressPercent !== undefined && <Meter value={options.progressPercent} />}
</span> </span>
</button> </button>
); );
@ -63,7 +68,12 @@ export function HomePage() {
</div> </div>
{state.continueReading.length ? ( {state.continueReading.length ? (
<div className="continue-grid"> <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> </div>
) : ( ) : (
<EmptyState title="Aucune trace" detail="Les lectures reprises apparaitront ici." /> <EmptyState title="Aucune trace" detail="Les lectures reprises apparaitront ici." />

3
apps/web/src/pages/HomePageProgressScroll.test.ts
View File

@ -21,6 +21,9 @@ describe("home progress list layout", () => {
expect(source).toContain("renderHomeBook"); expect(source).toContain("renderHomeBook");
expect(source).toContain("home-book-card"); 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("<BookCard");
expect(source).not.toContain("FormatPill"); expect(source).not.toContain("FormatPill");
expect(source).not.toContain("bookMetadataState"); expect(source).not.toContain("bookMetadataState");