Replace feed infinite scroll with a Show more button

[flvvius]

Swap the IntersectionObserver-driven auto-loading on the interactive
feed for an explicit "Load more" button that calls loadMore on click.
Removes the observer effect and its supporting refs, and keeps a
visually-hidden polite status region for screen readers while a page
loads. The button is disabled during loading and reuses the existing
feed.loadMore / feed.loading strings.

Co-Authored-By: Claude Opus 4.8 noreply@anthropic.com
Claude-Session: https://claude.ai/code/session_012MpkuigW6T4N1exXip6bRp

Summary by CodeRabbit

• New Features

  • Added a “Show more” button to load additional feed items.
  • Added recent search query history, saved across sessions.
  • Improved search focus handling and loading announcements for accessibility.

• Bug Fixes

  • Replaced automatic infinite scrolling with a more predictable, user-controlled loading experience.

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
news	Error		Jul 23, 2026 11:38am
news-web	Ready	Preview, Comment	Jul 23, 2026 11:38am

[coderabbitai]

Warning

Review limit reached

@flvvius, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 57 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

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.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro Plus

Run ID: cd3cd405-b442-4a8b-b9d2-7096e48b6897

📥 Commits

Reviewing files that changed from the base of the PR and between 04990f4 and aeeb096.

📒 Files selected for processing (1)

• apps/web/src/routes/index.tsx

Walkthrough

The main feed route adds search focus and recent-query state, and replaces IntersectionObserver-driven infinite scrolling with an explicit, loading-aware “Show more” button.

Changes

Feed interactions

Layer / File(s)	Summary
Search interaction state apps/web/src/routes/index.tsx	FeedContent tracks search focus, recent searches, and a ref for focusing the search input.
Explicit pagination control apps/web/src/routes/index.tsx	Removes scroll-sentinel observer wiring and adds a button that calls loadMore(pageSize), disables during loading, and updates the loading announcement. The archive comment now describes the button’s crawler limitation.

Estimated code review effort: 2 (Simple) | ~10 minutes

Possibly related PRs

• flvvius/news#57: Modifies the same feed route’s rendering and pagination behavior.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% 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 matches the main change: replacing infinite scroll with an explicit show-more/load-more button.
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.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch claude/feed-pagination-show-more-pbj7ur

---

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.}

[coderabbitai]

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

apps/web/src/routes/index.tsx (1)

357-361: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Update the stale infinite-scroll documentation.

Line 360 says the root feed uses infinite scroll, but it now uses an explicit load-more button. This comment will otherwise mislead future maintenance.

Proposed fix

- * scroll on / stays the interactive experience layered on top.
+ * feed at / uses an explicit load-more control layered on top.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/web/src/routes/index.tsx` around lines 357 - 361, Update the feed
documentation comment near the static crawlable slice to describe the root
feed’s explicit load-more button instead of infinite scroll, while preserving
the existing server-rendered pagination and recent-order details.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Outside diff comments:
In `@apps/web/src/routes/index.tsx`:
- Around line 357-361: Update the feed documentation comment near the static
crawlable slice to describe the root feed’s explicit load-more button instead of
infinite scroll, while preserving the existing server-rendered pagination and
recent-order details.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro Plus

Run ID: 5f7589b4-2121-47fd-881b-b745bb8e3852

📥 Commits

Reviewing files that changed from the base of the PR and between 0321c1b and 04990f4.

📒 Files selected for processing (1)

• apps/web/src/routes/index.tsx