-
-
Notifications
You must be signed in to change notification settings - Fork 52
Allow filtering workflows to only running, & add dashboard links #2607
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Conversation
- renames `set` method to `update` - adds `set` and `delete` methods that mirror `URLSearchParams` methods
- add "running" filter - persist these filters in url search params
- add link to running workflows - remove dt/dd formatting so that underlines can be rendered - use tabular numbers in overview
- add more dashboard links as well
Co-authored-by: sua yoo <sua@suayoo.com>
@click=${() => | ||
(this.filterBy = { | ||
@click=${() => { | ||
this.searchParams.set("filter", "unscheduled"); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Since search params are coupled withthis.filterBy
, it should probably be reactive, something like (untested:)
updated(changedProperties) {
if (changedProperties.has("filterBy")) {
this.searchParams.delete("page");
if (this.filterby.schedule) {
this.searchParams.set("filter", "unscheduled");
// etc, more logic
}
}
}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yeah, I guess that works, but it feels awkward to me, there's a lot of indirection:
protected updated(
changedProperties: PropertyValues<this> & Map<string, unknown>,
) {
if (changedProperties.has("filterBy")) {
this.searchParams.delete("page");
if (
this.filterBy.schedule === undefined &&
this.filterBy.isCrawlRunning === undefined
) {
this.searchParams.delete("filter");
} else if (
this.filterBy.schedule === true &&
this.filterBy.isCrawlRunning === undefined
) {
this.searchParams.set("filter", "scheduled");
} else if (
this.filterBy.schedule === false &&
this.filterBy.isCrawlRunning === undefined
) {
this.searchParams.set("filter", "unscheduled");
} else if (
this.filterBy.schedule === undefined &&
this.filterBy.isCrawlRunning === true
) {
this.searchParams.set("filter", "running");
}
}
}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe this indicates that the search params could be more mappable, something like ?scheduled=true/false
, ?running=true/false
? Maybe a simplified transformer since setFiltersFromSearchParams
feels similarly expanded?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think I found a pretty good solution in 3024f6d — with a more expanded search param schema I'd also want more UI that maps to that, and I think the current setup functions more like presets than it does a full set of filter controls. I'm not opposed to the idea in the future, but I think it'd take a bit more UI design first.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
On second thought, I think I've come around on this, I do see the benefit when it comes to decoupling UI from stored state a bit more. I took a go at this in e83686b, let me know what you think?
Closes #2527
Changes
SearchParamsController
with a more flexible APIset
method toupdate
set
anddelete
methods that mirror the ones onURLSearchParams
Testing
Since this PR involves both frontend and backend changes, you'll need to run the backend locally (or deploy this on dev) to test this out.
Screenshots