Fix profile REP categories pagination to fetch additional pages on load more#2165
Fix profile REP categories pagination to fetch additional pages on load more#2165
Conversation
…ad more Signed-off-by: ragnep <ragneinfo@gmail.com>
|
Warning Rate limit exceeded
⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the 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 have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthroughReplaces per-component category queries with a shared infinite-query ( Changes
Sequence Diagram(s)sequenceDiagram
participant User as User (UI)
participant Header as UserPageRepHeader / MobileRepTabContent
participant Parent as UserPageRep
participant Hook as useRepCategories (useInfiniteQuery)
participant API as RepCategories API
rect rgba(200,200,255,0.5)
User->>Header: clicks "Load more"
Header->>Parent: onShowMore()
end
rect rgba(200,255,200,0.5)
Parent->>Hook: request fetchNextPage() if needed
Hook->>API: GET /rep-categories?page=...
API-->>Hook: returns next page (or next=null)
Hook-->>Parent: new page appended (hasNextPage updated)
end
rect rgba(255,230,200,0.5)
Parent->>Header: update props (visibleCount, hasNextPage, isFetchingNextPage)
Header->>User: render updated list / button state
end
Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 minutes Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 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 |
Signed-off-by: ragnep <ragneinfo@gmail.com>
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
components/user/rep/header/UserPageRepHeader.tsx (1)
48-60: Consider extracting the shared load-more presenter state. ThehiddenLoadedCategoryCount/loadMoreLabel/isLoadMoreDisabledtrio now exists here and incomponents/user/rep/MobileRepTabContent.tsx. A tiny helper would keep the desktop and mobile rules from drifting on the next pagination tweak.Also applies to: 189-197
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@components/user/rep/header/UserPageRepHeader.tsx` around lines 48 - 60, The load-more presentation logic (hiddenLoadedCategoryCount, loadMoreLabel, isLoadMoreDisabled and related hasMore calculation) is duplicated between UserPageRepHeader and MobileRepTabContent; extract this into a small pure helper (e.g., computeLoadMoreState) that takes categories.length, visibleCount, hasNextPage, and isFetchingNextPage and returns { hiddenLoadedCategoryCount, hasMore, loadMoreLabel, isLoadMoreDisabled } and then replace the duplicated blocks in components/user/rep/header/UserPageRepHeader.tsx (the hiddenLoadedCategoryCount/loadMoreLabel/isLoadMoreDisabled usage) and components/user/rep/MobileRepTabContent.tsx to call that helper so both views share the single source of truth for load-more rules.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@components/user/rep/UserPageRep.tsx`:
- Around line 176-227: handleShowMore currently calls fetchNextPage() from
inside the setVisibleCounts updater which introduces a side effect in a React
state updater; compute whether you need to fetch before calling setVisibleCounts
(derive loadedCount, hasNextPage, isFetchingNextPage, and compute
shouldFetchNextPage based on repDirection and repCategories/repCategoriesGiven),
then call setVisibleCounts to update [repDirection] by
VISIBLE_CATEGORY_LOAD_STEP, and finally (outside the setter) call the
appropriate fetchNextPage from repCategoriesQuery or repCategoriesGivenQuery
only if shouldFetchNextPage is true; keep the dependencies for useCallback
updated to include the queries and lengths but remove any fetchNextPage calls
from inside the setter to keep the updater pure.
---
Nitpick comments:
In `@components/user/rep/header/UserPageRepHeader.tsx`:
- Around line 48-60: The load-more presentation logic
(hiddenLoadedCategoryCount, loadMoreLabel, isLoadMoreDisabled and related
hasMore calculation) is duplicated between UserPageRepHeader and
MobileRepTabContent; extract this into a small pure helper (e.g.,
computeLoadMoreState) that takes categories.length, visibleCount, hasNextPage,
and isFetchingNextPage and returns { hiddenLoadedCategoryCount, hasMore,
loadMoreLabel, isLoadMoreDisabled } and then replace the duplicated blocks in
components/user/rep/header/UserPageRepHeader.tsx (the
hiddenLoadedCategoryCount/loadMoreLabel/isLoadMoreDisabled usage) and
components/user/rep/MobileRepTabContent.tsx to call that helper so both views
share the single source of truth for load-more rules.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 65bd6995-f40d-4983-97d9-bfa0ec383780
📒 Files selected for processing (5)
components/user/rep/MobileRepTabContent.tsxcomponents/user/rep/UserPageRep.tsxcomponents/user/rep/UserPageRepMobile.tsxcomponents/user/rep/UserPageRepWrapper.tsxcomponents/user/rep/header/UserPageRepHeader.tsx
Signed-off-by: ragnep <ragneinfo@gmail.com>
|
2 participants
…ad more
Summary by CodeRabbit