arunsarin85 opened a new pull request, #9986:
URL: https://github.com/apache/ozone/pull/9986
## What changes were proposed in this pull request?
The Recon UI v2 ContainerTable had three pagination bugs reported in
HDDS-12643:
1. All data was fetched in a single request and paginated client-side;
lastKey was never used as a cursor.
2. Users could jump directly to any page number.
3. The row limit was not configurable.
Please describe your PR in detail:
This PR fixes all three issues:
1. Server-side pagination (containers.tsx): Replaced the single bulk-fetch +
client-side slice approach with true server-side pagination. Each page fetch
sends limit (page size + 1) and minContainerId to
/api/v1/containers/unhealthy/{STATE}. Fetching one extra item is used solely to
detect whether a next page exists (hasNextPage = response.length > pageSize),
and only pageSize rows are ever displayed. Each tab maintains independent
pagination state so switching tabs does not reset other tabs.
2. No direct page-skip (containersTable.tsx): Replaced Ant Design's
built-in numbered pagination with a custom footer containing only Previous and
Next buttons. Direct page number access is no longer possible.
3. Configurable page size (containersTable.tsx, containers.tsx): Added a
Rows per page dropdown (options: 10, 25, 50, 100) in the footer. Changing the
page size resets all tab states and re-fetches the first page with the new
limit, and is reflected across all tabs.
## What is the link to the Apache JIRA
https://issues.apache.org/jira/browse/HDDS-12643
## How was this patch tested?
1. Mock API (manual): Ran npm run dev with the updated mock:api script
(which now includes --middlewares api/pagination.js). Verified via browser
DevTools that:
- Each page click issues a new GET request with the correct minContainerId
cursor and returns a 200 (not 304) with a different set of container IDs.
- Next is disabled on the last page; Previous is disabled on the first page.
- Changing the Rows per page dropdown resets to page 1 and issues a new
fetch with the updated limit.
- All 5 tabs (Missing, Under-Replicated, Over-Replicated, Mis-Replicated,
Mismatched Replicas) paginate independently.
2. Random-ID validation: Container IDs in db.json are stored in shuffled
(non-sorted) order with non-sequential values. All 5 tabs returned correctly
sorted, correctly paginated results, confirming the middleware's Array.sort
step handles arbitrary ordering in the source data.
<img width="1719" height="1034" alt="image"
src="https://github.com/user-attachments/assets/f9b0a7e3-0168-4371-b297-99343047ef87";
/>
<img width="1708" height="1041" alt="image"
src="https://github.com/user-attachments/assets/11069ae3-30ea-47ce-9080-6500395f4141";
/>
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
