Skip to content

Filter partitions by state and sort by progress#552

Open
TheSentinel454 wants to merge 1 commit into
masterfrom
ui/partitions-filter-sort
Open

Filter partitions by state and sort by progress#552
TheSentinel454 wants to merge 1 commit into
masterfrom
ui/partitions-filter-sort

Conversation

@TheSentinel454
Copy link
Copy Markdown
Collaborator

@TheSentinel454 TheSentinel454 commented May 11, 2026

Summary

  • On the backfill detail page, the partitions table can be long and visually uniform. Adds a state filter (All / RUNNING / PAUSED / COMPLETE / CANCELLED) and click-to-sort on the Progress (%) header (cycles none → desc → asc → none).
  • Both operate client-side via a small new Stimulus controller. State is persisted in the URL query string (?state=RUNNING&sort=progress_desc) so it survives the 10s auto-reload tick and is shareable.
  • Partitions still computing progress are always sorted to the bottom regardless of sort direction.
  • Includes dev/seed_partitions.sql for populating an existing backfill with mixed-state synthetic partitions to test the new UI locally.

Implementation notes

  • Pure additive change: row-level data-partition-state / data-progress-pct attributes are emitted server-side; the controller reads them, hides non-matching rows via the hidden class, and reorders via tbody.appendChild.
  • No changes to auto_reload_controller.js. Because the controller's element lives inside the partitions turbo-frame, every auto-reload swap triggers a fresh connect() which re-reads the URL and re-applies filter + sort — no custom cross-frame events needed.

Test plan

  • Start the dev service + a client (e.g. McDees), create + start a backfill.
  • Run mysql -u root backfila_development --init-command="SET @run_id := <ID>" < dev/seed_partitions.sql to seed 10 partitions in mixed states.
  • Reload the backfill detail page; verify all 10 rows render with the new filter dropdown and sortable Progress (%) header.
  • Change filter to RUNNING — only the 5 running rows remain.
  • Click Progress (%) — rows sort desc; computing/precomputing rows go to bottom. Click again for asc.
  • Wait through a 10s auto-reload tick; verify filter + sort persist.
  • Copy the URL and open in a new tab; verify filter + sort are restored from query string.
Screen.Recording.2026-05-11.at.11.18.14.AM.mov

🤖 Generated with Claude Code

On the backfill detail page, the partitions table can be long and uniform.
Add a state filter (All / RUNNING / PAUSED / COMPLETE / CANCELLED) and make
the Progress (%) header click-to-sort (none -> desc -> asc -> none).

Both operate client-side via a new Stimulus controller; state is persisted
in the URL query string so it survives the 10s auto-reload tick and is
shareable. Partitions still computing progress are sorted to the bottom
regardless of direction.

Also includes dev/seed_partitions.sql for populating an existing backfill
with mixed-state synthetic partitions to test the new UI.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Copy link
Copy Markdown
Collaborator

@mpawliszyn mpawliszyn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd appreciate @adrw 's review first. But if he doesn't have time, its a small enough change.

Comment thread dev/seed_partitions.sql
@@ -0,0 +1,47 @@
-- Dev-only seed for the partitions table UI (testing filter + sort).
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't love how brittle this is but I don't have a better solution right now.

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, I'm open to just not committing this. I used this locally to just add some test data and agree this isn't the best long term approach. It seemed like a more niche usage for me.

static targets = ["filter", "tbody", "sortIndicator"];

connect() {
const params = new URLSearchParams(window.location.search);
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@adrw WDYT?

@TheSentinel454 TheSentinel454 requested a review from adrw May 12, 2026 01:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants