Generic sorting and filtering widgets about dashboard

[kimholmes]

@jessm12 Sorry I had not seen your comment sooner! Yeah, I was told on our review yesterday that you can only filter the PLRs by label. So it wouldn't make any sense to have "label" in the dropdown.
@ncskier informed me that the following are the possible labels:
"app": "tekton-webhook-handler",
"gitServer": "github.com",
"gitOrg": "tektoncd",
"gitRepo": "pipeline",
"gitBranch": "master",

So, maybe we could work the dropdown that way??
To answer your first question, YES, the intention would be to do a lookup on all PLRs with similar matches to what the user has typed. So, yes, that could be a computational load.
However, the dropdown would only show (say for example) the first 4 matches that are most similar to what the user just typed. So, it wouldn't use all the real estate in the dropdown.
To see a similar example, go to W3 and use that filter. You'll see it divides the results into categories. I can select from the options in the dropdown or just hit enter and load everything.
That's the pattern I was copying.

Yes, I agree with you. I love the idea of using the key:value pairs. We need your technical expertise on how to surface that in the UI. I just don't know how they work, but I guess it's similar to the labels Brandon sent above.

[kimholmes]

@skaegi That will baked into the visual design. We'll be using components from the IBM Design Language (carbon).

[kimholmes]

Working on this user flow. Would love feedback:

Default state:

Hover state:

Click state:

Typing state. User can press enter or select from the dropdown:

Filter added:

[jessm12]

Thanks for these designs @kimholmes! 😄The current implementation that I have is filtering only on label (labelKey:labelValue) and there is no dropdown functionality. I think the dropdown could be a great enhancement to add to the filtering down the line.

One question I do have is would the intention be to populate these filters in the dropdown by doing a lookup on all Pipeline Runs to find all of the labels that are on them for example? A thought I would have there is that if you have hundreds of them this could be a lot of additional computation and there could be a large amount of matches that may overwhelm the space within the dropdown and that may well slow things down depending on your network/cluster.

Also, generally I think the filters would be in the form of key:value pairs so branch:master or name:tekton though there could be scope where we could accept some singular values if we are searching across multiple fields perhaps but it should probably be something as standardised as possible. I think this could definitely use further discussion over the design and technical considerations 😅

[AlanGreene]

Basic label-based filtering implemented. No current plan to add the more advanced filter dropdown from the designs above although we can revisit in future if we change how we're using the Kubernetes APIs to give us more flexibility in this area.