Skip to content

fix(frontend): stabilize admin execution pagination bar#6050

Open
Raja-Hamid wants to merge 1 commit into
apache:mainfrom
Raja-Hamid:fix-admin-navigation-bar
Open

fix(frontend): stabilize admin execution pagination bar#6050
Raja-Hamid wants to merge 1 commit into
apache:mainfrom
Raja-Hamid:fix-admin-navigation-bar

Conversation

@Raja-Hamid

Copy link
Copy Markdown

What changes were proposed in this PR?

The Admin → Executions page had an inconsistent, "jumpy" page-number bar compared to every other list in the app (#3586).

Root cause. It was the only paginated page that re-ran its entire query every second via setInterval(() => this.ngOnInit(), 1000) while driving a manual server-side pager ([nzFrontPagination]="false" with bound [nzPageIndex]/[nzPageSize]/[nzTotal]). Every tick reassigned the data and total under the pager, with no request cancellation, so the bar reshuffled every second and raced the user's clicks. Separately, onQueryParamsChange used an else-if that dropped the page index whenever the page size changed, desyncing the highlighted page from the data.

Fix (frontend-only, admin-execution.component.ts):

  • The 1s interval now only ticks the client-side elapsed-time/status of already-loaded rows (updateTimeStatus()); data is refreshed by a decoupled 5s switchMap-cancelled poll that refetches only the current page, never touches page index/size, and updates the total only when it actually changed.
  • Rewrote onQueryParamsChange to read page size and index from every event and clamp the page into range (order-independent) — fixing the size-change desync and the out-of-range/empty cases.
  • Split fetchData() (user-initiated) and fetchCurrentPage() (background/silent); kill/pause/resume now trigger a prompt refresh instead of waiting for the next tick.

Before: the bar flickered/reshuffled every second and could jump on click or page-size change.
After: the bar is stable when idle, follows clicks, re-centers predictably, and clamps correctly on page-size change — consistent with the rest of the app (e.g. Admin → Users).

Page Bar Demo (After)

Any related issues, documentation, discussions?

Closes #3586

How was this PR tested?

Unit tests (Vitest) — added 8 cases in admin-execution.component.spec.ts covering first/last page, page-size change, order-independent size+index change, single-page, empty results, and no-double-fetch on sort/filter:

corepack yarn ng test --watch=false --include="**/admin-execution.component.spec.ts"
10/10 passing (8 new + 2 existing). Three of the new cases were red against the old code (page-size-change desync, order-independent size+index change, empty-results clamp) and green after the fix.

Manual — ran the bin/single-node stack + ng serve, seeded ~65 workflows/executions, and verified on Admin → Executions that the page bar follows clicks, re-centers, stays idle-stable, and clamps on page-size change; compared side-by-side against Admin → Users (built-in pager) — now consistent.

Was this PR authored or co-authored using generative AI tooling?

Generated-by: Yes, alongside Claude Code

The admin Executions page re-ran its full query every second via
setInterval(ngOnInit) while driving a manual server-side pager, so the
page-number bar jumped and raced user clicks — unlike every other list.

- Replace the 1s self-refresh with a 1s client-side time tick plus a 5s
  switchMap-cancelled poll that never touches page index/size and only
  updates the total when it changes.
- Rewrite onQueryParamsChange to read page size and index together and
  clamp into range (order-independent), fixing desync on size changes.
- Refresh promptly after kill/pause/resume.

Closes apache#3586
@github-actions github-actions Bot added fix frontend Changes related to the frontend GUI labels Jul 1, 2026
@github-actions

github-actions Bot commented Jul 1, 2026

Copy link
Copy Markdown
Contributor

👋 Thanks for your first contribution to Texera, @Raja-Hamid!

If you're looking for a good place to start, browse issues labeled starter-task; they're scoped to be approachable for newcomers.

You can drive common housekeeping yourself by commenting one of these commands on its own line:

  • Issues. Comment /take to assign an open issue to yourself, or /untake to release it. You can find unclaimed work with the search filter is:issue is:open no:assignee.
  • Sub-issues. To link issues into a parent/child hierarchy, comment /sub-issue #5166 #5222 on the parent to attach those children (or /unsub-issue #5166 #5222 to detach them). From a child issue, comment /parent-issue #5166 to set its parent, or /unparent-issue to clear it (the current parent is detected automatically). References may be written as #5166 or as a bare 5166; cross-repository references are not supported.
  • Pull requests (author only). Comment /request-review @user to request a review from someone, or /unrequest-review @user to withdraw that request.

Each command must match exactly: /take this will not work, only /take does. For the full contribution flow, see CONTRIBUTING.md.

@github-actions

github-actions Bot commented Jul 1, 2026

Copy link
Copy Markdown
Contributor

Automated Reviewer Suggestions

Based on the git blame history of the changed files, we recommend the following reviewers:

  • Contributors with relevant context: @Ma77Ball, @Yicong-Huang
    You can notify them by mentioning @Ma77Ball, @Yicong-Huang in a comment.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

fix frontend Changes related to the frontend GUI

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Inconsistent Behavior of Admin Page Navigation Bar

1 participant