Add customizable pagination size#575
Conversation
|
Important Review skippedAuto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Plus Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
📝 WalkthroughWalkthroughA new Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
|
@greptileai review |
|
@coderabbitai review |
✅ Actions performedReview triggered.
|
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
code/frontend/src/app/ui/paginator/paginator.component.ts (1)
18-38:⚠️ Potential issue | 🟠 MajorDefault page size is not present in default options.
pageSizedefaults to25, butpageSizeOptionsdefaults exclude it. That can leave the selector with no matching selected option initially.💡 Proposed fix
- pageSizeOptions = input<number[]>([50, 100, 200, 500]); + pageSizeOptions = input<number[]>([25, 50, 100, 200, 500]); readonly pageSizeSelectOptions = computed<SelectOption[]>(() => - this.pageSizeOptions().map((n) => ({ label: String(n), value: n })) + (this.pageSizeOptions().includes(this.pageSize()) + ? this.pageSizeOptions() + : [this.pageSize(), ...this.pageSize()] + ).map((n) => ({ label: String(n), value: n })) );🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@code/frontend/src/app/ui/paginator/paginator.component.ts` around lines 18 - 38, The pageSizeOptions default array doesn't include the component's default pageSize (25), which can leave the select without a matching option; update the pageSizeOptions input (symbol: pageSizeOptions) to include 25 (e.g., [25,50,100,200,500]) or derive options from the default pageSize so the computed pageSizeSelectOptions always contains an option matching the current pageSize value used by pageSize() and the selection UI.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@code/frontend/src/app/core/services/pagination.service.ts`:
- Around line 5-16: Wrap all localStorage accesses in try/catch inside
getPageSize and setPageSize so SecurityError in private/incognito doesn't
throw—on catch, return defaultValue from getPageSize and make setPageSize a safe
no-op (optionally log). In addition, validate the page size before
persisting/updating in the pagination handler: ensure the new size is a finite
integer > 0 (reuse the same validation as getPageSize) and only call setPageSize
and update the signal/state when the value passes validation; otherwise ignore
or revert to default.
---
Outside diff comments:
In `@code/frontend/src/app/ui/paginator/paginator.component.ts`:
- Around line 18-38: The pageSizeOptions default array doesn't include the
component's default pageSize (25), which can leave the select without a matching
option; update the pageSizeOptions input (symbol: pageSizeOptions) to include 25
(e.g., [25,50,100,200,500]) or derive options from the default pageSize so the
computed pageSizeSelectOptions always contains an option matching the current
pageSize value used by pageSize() and the selection UI.
🪄 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: Repository UI
Review profile: CHILL
Plan: Pro Plus
Run ID: fa8dbfbc-aee5-4e27-9451-82bea513cd06
📒 Files selected for processing (14)
code/frontend/src/app/core/services/pagination.service.tscode/frontend/src/app/features/events/events.component.htmlcode/frontend/src/app/features/events/events.component.tscode/frontend/src/app/features/seeker-stats/quality-tab/quality-tab.component.htmlcode/frontend/src/app/features/seeker-stats/quality-tab/quality-tab.component.tscode/frontend/src/app/features/seeker-stats/searches-tab/searches-tab.component.htmlcode/frontend/src/app/features/seeker-stats/searches-tab/searches-tab.component.tscode/frontend/src/app/features/seeker-stats/upgrades-tab/upgrades-tab.component.htmlcode/frontend/src/app/features/seeker-stats/upgrades-tab/upgrades-tab.component.tscode/frontend/src/app/features/strikes/strikes.component.htmlcode/frontend/src/app/features/strikes/strikes.component.tscode/frontend/src/app/ui/paginator/paginator.component.htmlcode/frontend/src/app/ui/paginator/paginator.component.scsscode/frontend/src/app/ui/paginator/paginator.component.ts
Greptile SummaryThis PR adds customizable pagination size across all paginated views (events, strikes, seeker-stats tabs) by introducing a Confidence Score: 5/5Safe to merge — only one minor API inconsistency in the reusable component's defaults. All findings are P2. The mismatched defaults in PaginatorComponent don't affect any current consumer (all pass explicit values), so there is no present breakage. The implementation is consistent across all five components and the new service is well-guarded. paginator.component.ts — default values for Important Files Changed
Sequence DiagramsequenceDiagram
participant User
participant PaginatorComponent
participant FeatureComponent
participant PaginationService
participant localStorage
User->>PaginatorComponent: Selects new page size
PaginatorComponent->>PaginatorComponent: onPageSizeChange(size)
PaginatorComponent->>FeatureComponent: pageSizeChange.emit(size)
FeatureComponent->>PaginationService: createPageSizeHandler callback(size)
PaginationService->>localStorage: setItem(key, size)
PaginationService->>FeatureComponent: pageSize.set(size)
PaginationService->>FeatureComponent: currentPage.set(1)
PaginationService->>FeatureComponent: reload()
FeatureComponent->>FeatureComponent: loadData() API call
Note over FeatureComponent,localStorage: On next component init
FeatureComponent->>PaginationService: getPageSize(key, 50)
PaginationService->>localStorage: getItem(key)
localStorage-->>PaginationService: stored value
PaginationService-->>FeatureComponent: validated page size
Reviews (1): Last reviewed commit: "added customizable pagination size" | Re-trigger Greptile |
Relates to #568