feat: add responsive feed pagination defaults - #830
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
📝 WalkthroughWalkthroughAdds a configurable infinite-feed preference with mobile fallback, manual “load more” pagination, conditional Virtuoso loading across feed views, footer loading states, settings controls, tests, styles, and translations. ChangesInfinite feed pagination
Estimated code review effort: 3 (Moderate) | ~25 minutes Sequence Diagram(s)sequenceDiagram
participant Settings
participant ContentOptionsStore
participant FeedView
participant Virtuoso
participant FeedFooter
participant FeedPagination
participant LoadMore
Settings->>ContentOptionsStore: setInfiniteFeedEnabled(enabled)
ContentOptionsStore-->>FeedView: persisted preference
FeedView->>FeedView: resolve pagination mode
alt Infinite feed enabled
Virtuoso->>LoadMore: endReached
else Manual pagination
FeedView->>FeedFooter: pass onLoadMore
FeedFooter->>FeedPagination: render load-more control
FeedPagination->>LoadMore: invoke on click
end
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
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. Comment |
|
Addressed Cursor Bugbot's valid loading-state finding in ef34045.\n\nThe manual desktop mode now keeps the loading footer visible while the first page is empty and fetching, then hides it once the 25-post page can expose the Load more control. Added focused regression coverage.\n\nVerified: 176 tests, lint, type-check, build, knip, React Doctor changed scope, desktop/mobile behavior in Chrome/Firefox/WebKit, plus a mid-throttled Chromium first-load pass. |
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes using default effort and found 1 potential issue.
❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.
Reviewed by Cursor Bugbot for commit 6368ca7. Configure here.
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
src/components/feed-footer/feed-footer-utils.test.ts (1)
47-56: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick winAdd exhausted-feed regression coverage.
These tests do not cover
hasMore: false, so they pass despite the helper rendering a permanent loading state after the final page. Add manual and infinite exhausted cases expectingfalse, then runyarn test.🤖 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 `@src/components/feed-footer/feed-footer-utils.test.ts` around lines 47 - 56, Add regression tests in the shouldShowFeedLoading suite for exhausted feeds with hasMore: false, covering both manual pagination (infiniteFeedEnabled: false) and infinite-feed mode (infiniteFeedEnabled: true), and expect false in each case. Run yarn test after updating the tests.Source: Coding guidelines
🤖 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.
Inline comments:
In `@src/components/feed-footer/feed-footer-utils.ts`:
- Around line 29-36: Update shouldShowFeedLoading so an exhausted feed never
reports loading: remove the !hasMore condition and require an actual loading
state based on feedLength and infiniteFeedEnabled, preserving the existing
behavior for initial and active infinite-feed loading.
In `@src/views/community/community.tsx`:
- Around line 197-199: Update the FeedPagination rendering in the community view
so the manual pagination control is mounted only when isOnline is true,
preventing offline clicks from invoking loadMore. Preserve the existing hasMore
and infiniteFeedEnabled conditions, and add a regression test covering a loaded
page with hasMore while offline.
---
Nitpick comments:
In `@src/components/feed-footer/feed-footer-utils.test.ts`:
- Around line 47-56: Add regression tests in the shouldShowFeedLoading suite for
exhausted feeds with hasMore: false, covering both manual pagination
(infiniteFeedEnabled: false) and infinite-feed mode (infiniteFeedEnabled: true),
and expect false in each case. Run yarn test after updating the tests.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 843f9a2b-097b-4795-aea5-2cc22e53cc72
📒 Files selected for processing (51)
public/translations/ar/default.jsonpublic/translations/bn/default.jsonpublic/translations/cs/default.jsonpublic/translations/da/default.jsonpublic/translations/de/default.jsonpublic/translations/el/default.jsonpublic/translations/en/default.jsonpublic/translations/es/default.jsonpublic/translations/fa/default.jsonpublic/translations/fi/default.jsonpublic/translations/fil/default.jsonpublic/translations/fr/default.jsonpublic/translations/he/default.jsonpublic/translations/hi/default.jsonpublic/translations/hu/default.jsonpublic/translations/id/default.jsonpublic/translations/it/default.jsonpublic/translations/ja/default.jsonpublic/translations/ko/default.jsonpublic/translations/mr/default.jsonpublic/translations/nl/default.jsonpublic/translations/no/default.jsonpublic/translations/pl/default.jsonpublic/translations/pt/default.jsonpublic/translations/ro/default.jsonpublic/translations/ru/default.jsonpublic/translations/sq/default.jsonpublic/translations/sv/default.jsonpublic/translations/te/default.jsonpublic/translations/th/default.jsonpublic/translations/tr/default.jsonpublic/translations/uk/default.jsonpublic/translations/ur/default.jsonpublic/translations/vi/default.jsonpublic/translations/zh/default.jsonsrc/components/feed-footer/feed-footer-utils.test.tssrc/components/feed-footer/feed-footer-utils.tssrc/components/feed-footer/feed-footer.module.csssrc/components/feed-footer/feed-footer.tsxsrc/components/feed-footer/feed-pagination.test.tsxsrc/components/feed-footer/feed-pagination.tsxsrc/hooks/use-feed-pagination.test.tssrc/hooks/use-feed-pagination.tssrc/stores/use-content-options-store.test.tssrc/stores/use-content-options-store.tssrc/views/all/all.tsxsrc/views/community/community.tsxsrc/views/domain/domain.tsxsrc/views/home/home.tsxsrc/views/mod/mod.tsxsrc/views/settings/content-options/content-options.tsx

Summary
Verification
yarn test(174 tests)yarn lintyarn type-checkyarn knipyarn buildyarn exec react-doctor . --verbose --scope changed -yNote
Medium Risk
Touches pagination across all main feed views and Virtuoso scroll behavior; regressions could cause double loads or stuck loading states, though tests cover key paths.
Overview
Adds responsive feed pagination: desktop defaults to 25-post pages with a Load more button; mobile keeps infinite scroll via Virtuoso
endReachedunless the user overrides it.A new Feeds section in content options persists an Enable infinite feed preference (
null= device default).useInfiniteFeedEnabledresolves that policy;FeedPaginationshows the button only when infinite mode is off, blocks duplicate loads while a page fetch is in flight, and footer loading text is gated byshouldShowFeedLoading.Feed views (home, all, mod, domain, community) pass
FEED_POSTS_PER_PAGE, wireonLoadMore(includingPromise.allfor combined weekly/monthly/yearly loads), and disable scroll-triggered loading when manual pagination is active. Locale files addload_more,enable_infinite_feed, andfeedsstrings.Reviewed by Cursor Bugbot for commit 1a27f67. Bugbot is set up for automated code reviews on this repo. Configure here.
Summary by CodeRabbit
New Features
Bug Fixes