EPMRPP-116948 || Extend Pagination, Table, and icons for latest-only Test Executions UI#305
Conversation
…Test Executions UI
|
Warning Review limit reached
Next review available in: 9 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the 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 configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (2)
WalkthroughAdds ChangesPagination accent total tooltip
Table sort-disabled column tooltips
New icon export
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Suggested labels
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ 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 |
There was a problem hiding this comment.
Actionable comments posted: 2
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/components/pagination/pagination.tsx (1)
20-32: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick winEncode the new prop precedence in the public type.
PaginationPropsstill allowswarningContentandaccentTotalTooltiptogether, butItemCounterdropswarningContentwheneveraccentTotalTooltipis set. That makes consumer content disappear with no type error. Please make those props mutually exclusive (or assert on the unsupported combination) so the API matches the rendered behavior.🤖 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/pagination/pagination.tsx` around lines 20 - 32, PaginationProps currently lets warningContent and accentTotalTooltip be passed together even though ItemCounter ignores warningContent whenever accentTotalTooltip is present. Update the public type around PaginationProps/ItemCounter to make those props mutually exclusive, or add a runtime assertion in the Pagination render path that rejects the unsupported combination, so the declared API matches the actual precedence behavior.
🧹 Nitpick comments (1)
src/components/pagination/pagination.stories.tsx (1)
113-148: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winExercise the cap-state branch in this story.
This example never sets
limitExceeded, so it does not cover the regression-prone part of the feature: replacing the usual+/warning UI whenaccentTotalTooltipis present. Setting the story up with the capped state would make it match the PR contract more closely.Suggested tweak
export const WithAccentTotalTooltip: Story = { args: { activePage: 1, totalItems: 10000, pageSize: 50, totalPages: 200, + limitExceeded: true, },🤖 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/pagination/pagination.stories.tsx` around lines 113 - 148, The WithAccentTotalTooltip story is not exercising the capped-state branch because it never sets limitExceeded, so it still shows the normal total/count behavior instead of the accent/tooltip replacement UI. Update the story’s args and/or Pagination props in WithAccentTotalTooltip so it explicitly represents the cap state, using limitExceeded alongside accentTotalTooltip, and keep the story focused on the Pagination component behavior that distinguishes the capped display from the standard warning UI.
🤖 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/pagination/itemsCounter/itemCounter.tsx`:
- Around line 35-42: The accentTotalTooltip branch in itemCounter.tsx mounts
Tooltip during render, but Tooltip reads document and will break server
rendering. Update the accent-total conditional to be SSR-safe by either
rendering a plain span fallback on the server or gating the Tooltip usage behind
a client-only check, and keep the existing accent-total / Tooltip behavior for
client renders.
In `@src/components/table/table.tsx`:
- Around line 316-345: The disabled-sort path in renderColumnSortLabel currently
wraps the header label in Tooltip, which introduces a second focusable target
inside the existing header control. Update the table header button behavior so
the tooltip is attached to the header button itself, or make the Tooltip wrapper
unfocusable and apply aria-disabled to the sortable header when
sortDisabledColumnTooltips[columnKey] is present. Keep the change localized to
renderColumnSortLabel, ColumnHeaderText, and the header click handling in
table.tsx.
---
Outside diff comments:
In `@src/components/pagination/pagination.tsx`:
- Around line 20-32: PaginationProps currently lets warningContent and
accentTotalTooltip be passed together even though ItemCounter ignores
warningContent whenever accentTotalTooltip is present. Update the public type
around PaginationProps/ItemCounter to make those props mutually exclusive, or
add a runtime assertion in the Pagination render path that rejects the
unsupported combination, so the declared API matches the actual precedence
behavior.
---
Nitpick comments:
In `@src/components/pagination/pagination.stories.tsx`:
- Around line 113-148: The WithAccentTotalTooltip story is not exercising the
capped-state branch because it never sets limitExceeded, so it still shows the
normal total/count behavior instead of the accent/tooltip replacement UI. Update
the story’s args and/or Pagination props in WithAccentTotalTooltip so it
explicitly represents the cap state, using limitExceeded alongside
accentTotalTooltip, and keep the story focused on the Pagination component
behavior that distinguishes the capped display from the standard warning 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: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: aa474b00-7970-452b-a01e-d0e9552ec087
⛔ Files ignored due to path filters (1)
src/components/icons/svg/latestExecutions.svgis excluded by!**/*.svg
📒 Files selected for processing (9)
src/components/icons/index.tssrc/components/pagination/itemsCounter/itemCounter.module.scsssrc/components/pagination/itemsCounter/itemCounter.tsxsrc/components/pagination/pagination.stories.tsxsrc/components/pagination/pagination.tsxsrc/components/table/table.module.scsssrc/components/table/table.stories.tsxsrc/components/table/table.tsxsrc/components/table/types.ts
Summary
Adds ui-kit building blocks required by EPMRPP-116948 / US-TEX-ATE-027 in the Test Executions plugin when Latest executions only is applied.
Changes
LatestExecutionsIcon@reportportal/ui-kitPagination/ItemCounteraccentTotalTooltip?: ReactNodelimitExceeded+suffix andwarningContenticon for that total segment{Y} of 10 000 itemswith tooltip at the latest-only display cap without reusing US-TEX-ATE-006 pagination warning UITablesortDisabledColumnTooltips?: Record<string, ReactNode>Tooltipand sort clicks are ignoredSummary by CodeRabbit