feat(library): real page-1 cover thumbnails and shelf search

[punyamsingh]

Render the first page of each PDF to a compact JPEG thumbnail at import
time and store it on the cached doc, so the shelf shows actual book
covers instead of a title-initial tile. Falls back to the letter tile
for docs cached before covers shipped or whose render failed.

Add a title/author search box to the populated shelf (shown once the
library grows past a handful of books), with an empty-result message and
the add-book tile hidden while filtering.

https://claude.ai/code/session_01MJHpoe4dutMMAHVk78tt1F

Summary by CodeRabbit

• New Features
  • Library shelf now includes search functionality to filter books by title and author (appears when more than 6 items are present).
  • Book cover thumbnails are automatically extracted from imported PDFs and displayed in the library view, with fallback to initial letter tiles when unavailable.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
wereadpdf	Ready	Preview, Comment	Jun 14, 2026 8:37pm

[coderabbitai]

Warning

Review limit reached

@punyamsingh, we couldn't start this review because you've reached your PR review rate limit.

More reviews will be available in 53 minutes and 59 seconds. Learn how PR review limits work.

Your organization has used up its prepaid credits, and credit purchases are no longer available. Enable the review add-on in the billing tab to keep reviews running — you're only billed for reviews past your plan's rate limits ($0.25/file).

⌛ How to resolve this issue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available.

Please see our Fair Usage Limits Policy for further information.

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: ef4fbf08-af00-4db5-8c59-c02a844ddeae

📥 Commits

Reviewing files that changed from the base of the PR and between c5d324f and 6910d1f.

📒 Files selected for processing (2)

• src/components/Library.tsx
• src/lib/pdf-extract.ts

📝 Walkthrough

Walkthrough

Adds a renderCover helper to pdf-extract.ts that captures page 1 as a JPEG data URL during PDF import. The cover is stored in ExtractedDoc and CachedDoc, then passed through to the Library shelf UI where BookCover renders it as a thumbnail. Library.tsx also gains query-driven shelf search that filters by title/author and conditionally shows a Search input, hero, and DropZone.

Changes

Cover pipeline and shelf search

Layer / File(s)	Summary
Data contract additions: ExtractedDoc and CachedDoc cover fields src/lib/pdf-extract.ts, src/lib/reader-store.ts	ExtractedDoc and CachedDoc each gain an optional cover?: string field documented as a best-effort page-1 JPEG data URL that may be absent for older cached docs or when rendering fails.
Cover rendering and PDF import wiring src/lib/pdf-extract.ts, src/components/App.tsx	New renderCover helper renders PDF page 1 to a scaled canvas and returns a JPEG data URL, releasing the canvas bitmap in finally and swallowing render errors. extractPdf calls renderCover before text extraction and includes the result in its return. App forwards extracted.cover into the CachedDoc upsert.
BookCover thumbnail display and shelf search src/components/Library.tsx	BookCover accepts optional cover?: string and conditionally renders an <img> thumbnail instead of the gradient/initial placeholder. ContinueHero and BookCard pass item.doc.cover to BookCover. Library gains query state with memoized title/author filtering, a Search-icon input shown when items exceed 6, and suppresses the hero and DropZone tile while filtering; an empty filtered result renders a no-match message.

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant App
  participant extractPdf
  participant renderCover
  participant ReaderStore
  participant Library

  User->>App: drop / import PDF file
  App->>extractPdf: extractPdf(file)
  extractPdf->>renderCover: renderCover(pdf)
  renderCover-->>extractPdf: cover JPEG data URL (or undefined)
  extractPdf-->>App: ExtractedDoc { cover, title, author, ... }
  App->>ReaderStore: upsert CachedDoc { cover, title, author, ... }
  User->>Library: view shelf
  Library->>ReaderStore: read shelf items
  Library-->>User: BookCover renders img thumbnail when cover present

Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐇 A canvas blinks, a page unfurls,
The rabbit paints in thumbnail swirls.
Each book now wears its cover bright,
And searching shelves is pure delight.
No more plain initials standing tall —
A little JPEG says it all! 📚

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 22.22% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and concisely describes both main features: real page-1 cover thumbnails and shelf search functionality, which align perfectly with the changeset's primary objectives.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch claude/kindle-ux-improvements-g9cj4t

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}