GitHub Issue 1534: Cap row counts for React grid pagination - #2074
Conversation
| // the true last page is unknown, so offer the last page of the known (capped) range and drop the total-pages footer | ||
| expect(screen.queryByText('Last Page')).not.toBeInTheDocument(); | ||
| expect(screen.getByText('Page 34')).toBeInTheDocument(); | ||
| expect(screen.queryByText('34 Total Pages')).not.toBeInTheDocument(); |
There was a problem hiding this comment.
In the UI, I see a "Count All Rows" option. Should this check for that to exist?
There was a problem hiding this comment.
Yep, the test case below checks that.
| )} | ||
| {rowCountCapped && onShowTotalRowCount && ( | ||
| <MenuItem disabled={disabled || loadingTotalCount} onClick={onShowTotalRowCount}> | ||
| {loadingTotalCount ? <LoadingSpinner msg="Counting…" /> : 'Count All Rows'} |
There was a problem hiding this comment.
minor: using the "Counting..." text for loading here seems a bit odd. I would suggest just "Loading...". Also I'd suggest something like "Load Total Count" instead of "Count All Rows".
There was a problem hiding this comment.
Msg updated to show "Loading...". We did discuss between different label options and landed on "Load Total Count"
| {rowCountCapped ? ( | ||
| // The true last page is unknown, so jump to the last page of the known (capped) range | ||
| <MenuItem disabled={disabled} onClick={loadLastPage}> | ||
| {`Page ${pageCount.toLocaleString()}`} |
There was a problem hiding this comment.
I get why this happens, but when I selected the "Page 5,000" option, the grid ended up loading the total row count. However, if I did that and then refreshed the page, the count went back to "100,000+". Seems like only selectin gth e"Count all rows" or going beyond page 5,000 should load that count.
There was a problem hiding this comment.
We actually decided to drop Page 5,000 and always support Last Page. Changes are in now.
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| keyValue?: any; | ||
| /** | ||
| * Cap the pagination row count at this many rows (defaults to DEFAULT_MAX_COUNT). Above the cap the grid shows |
There was a problem hiding this comment.
I'm confused by the comment here "Above the cap the grid shows N+". I think something like "When the grid has more that this number of rows it will show the max as N+"
| const model = this.state.queryModels[id]; | ||
| // Once the user pages to the last page within a capped count, there may be more rows beyond the cap. Re-fire | ||
| // the count once with an exact count (maxCount=0) so paging can continue past the cap. forceExact does the | ||
| // same on explicit user request, regardless of the current page. |
There was a problem hiding this comment.
this is likely the code related to my previous comment about how going to Page 5,000 loads the total row count but then refreshing the page when in that state will go back to 100,000+ as the total. Based on this comment, it sounds like that reload should flip to the force exact count.
There was a problem hiding this comment.
Good catch. Fix here so loading last capped page from URL will also do full count.
2 participants
Rationale
Have React grids cap their pagination count by default so large grids stay responsive, displaying "N+" and still allowing the user to page past the cap. The grid requests a bounded count, treats a capped total as a floor throughout the pagination and selection UI, and re-fires an exact count once the user reaches the edge of the known range.
Related Pull Requests
Changes