Introduce new filter/search bar for Flows and Executions

[anna-geller]

Feature description

With the growing number of filters, this filter/search bar is cluttered:

It would be great to implement a similar approach to GitLab's filter -- Walkthrough: https://share.descript.com/view/N8dV18u74Um

Related issues

Issues that will be enabled/improved by this:

• [UI] Add a dropdown to filter Flows by specific criteria (disabled/enabled, parent/child, with/without any trigger) #3029
• Flows page
• Logs
• main Dashboard
• Blueprints Adjust the search bar on the Blueprints page to use the new search/filter UX  #5729

[VamshiReddy02]

Hey @MilosPaunovic, can I work on this issue? because there is currently no associated pull request for this issue.

[MilosPaunovic]

@VamshiReddy02 Absolutely, go for it! 🚀

[MilosPaunovic]

@VamshiReddy02 Any progress on this?

[anna-geller]

@VamshiReddy02 here is a design how this can look like -- if you can't manage, don't worry we understand, it's a complex feature

Internal figma link

[anna-geller]

History of past searches + Saved searches

@Skraye can you assess whether enabling a history of past searches needs storing this somewhere, or would we only cache it on the front-end side?

[Skraye]

As current state, we could only store it on the frontend side

[anna-geller]

• Relative date is a dedicated filter separate from Absolute one
• Absolute date is a separate filter with a date range picker
• Trigger execution ID field is not needed anymore for now due to correlationId
• only when you type Enter, we filter the data
• View elements separate from filters:
  • which columns should show in the table
  • whether to show chart
  • refresh toggle
  • the column selector will be on the right
• Save button for Saved searches
• Sorting is already handled by the columns in each table
• For now, we only focus on filters for which we have backend implementation e.g. no multi-select of namespaces until it's done on the backend side
• For search, user can just type:
  

---

long term we could add recent/all for dropdown values e.g. for namespace field

[sachinks07]

Can I give a try on this.

[MilosPaunovic]

Hey @sachinks07,

We've decided to handle this internaly, but I can loop you in for feedback once there's something to be checked.

Maybe you can look at the issues with good first issue labels and pick something from there?

[sachinks07]

Sure. Thank you

[MilosPaunovic]

First related PR is merged #5844.