Baluduvamsi2006 opened a new pull request, #3318:
URL: https://github.com/apache/apisix-dashboard/pull/3318
What this PR does
This PR introduces a reusable ResourceListPage component and refactors
existing resource list pages to use it.
Previously, each resource list page (Services, Routes, Consumers, Upstreams,
Stream Routes, SSLs, etc.) duplicated nearly identical logic for ProTable
configuration, pagination, page headers, loading states, and error handling.
This duplication increased maintenance overhead and risked long-term
inconsistencies.
With this change:
Common list-page logic is centralized into a strictly typed
<ResourceListPage /> component.
Resource pages now only define resource-specific columns and API query hooks.
Pagination behavior (pageSizeOptions, showTotal) is configurable per page
instead of being hardcoded.
The original UI behavior is preserved 1:1 (including disabled toolbar
options, layout, and styling).
Performance & Architecture Improvements
Fixed React infinite re-render loops caused by passing inline anonymous hook
functions by instead passing stable, destructured query results.
Preserved existing React Suspense fetching behavior and TanStack Router
loaderDeps prefetching, avoiding regressions such as loading-state flashes or
broken error boundaries.
Ensured API error handling continues to be captured by existing React error
boundaries without behavioral changes.
E2E Test Stability Improvements
This PR also improves Playwright E2E test reliability by:
Removing long, hardcoded static waits (e.g., 8000ms delays) from CI test
flows.
Replacing them with dynamic synchronization using expect().toPass() polling
to wait for backend state propagation.
Tightening selectors and handling idempotent DELETE (404) operations
gracefully.
Improving cross-platform path handling and removing flaky timing assumptions.
Eliminating residual TypeScript lint warnings and mapped-type conflicts.
Why this change is needed
Eliminates hundreds of lines of duplicated boilerplate across the dashboard.
Guarantees consistent list-page behavior and layout across all resources.
Improves frontend maintainability and readability.
Speeds up GitHub Actions E2E runs by removing unnecessary static delays.
Establishes a scalable pattern for future resource list pages.
Checklist
UI refactor only (no API or behavioral changes)
Backward compatible
TypeScript / ESLint passed (0 errors)
Build passed successfully
All Playwright E2E tests passing (37/37)
--
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]
