Service selection: Label selection UI

[gtk-grafana]

Third step of breaking #841 into more manageable chunks.

Adds combobox to index (service selection) so users can select multiple indexed labels without requiring navigation to breakdowns.

Note: When aggregated metrics feature is enabled and toggled, the new "combobox" and new filter buttons will not display in the UI as only a single include filter is currently supported for aggregated metrics.

TODO:

• should add a new e2e test for adding multiple include filters on service selection
• Create follow up PR to address merging filters with the same key and operator into a single "pill" in the combobox like the version used in Profiles.
• • Combobox UI: Merge multiple filters with the same key and operator #900
• Create follow up PR to add fields to combobox
• • Combobox UI: Add support for detected_fields #901
• Create follow up to address removing tab counts
• • "Service" selection scene: Cardinality counts #902
• Can we make core changes to remove css hacks like: https://github.com/grafana/explore-logs/pull/881/files#diff-5e1bcf0a2ee986151f6f85310a18fa373b5fb88618852d11e217a577daba48daR108
• • Chore: Audit and remove non-standard css implementations #903

[svennergr]

Screen.Recording.2024-11-15.at.15.44.26.mov

The counter in the tabs doesn't seem to update accordingly.

Left a few nits, but overall it's working great!

[svennergr]

This state doesn't reset correctly.

Screen.Recording.2024-11-15.at.16.26.49.mov

[gtk-grafana]

The counter in the tabs doesn't seem to update accordingly.

So it looks like allowing multiple includes in the UI conflicts with the tab counts.
For example I have an include filter in tab A, the volume query we run to get the number of panels will replace that value with .+ so we display all possible labels for the user to potentially filter on. If we run detected_labels with the same query, we'll get the correct counts for this and all tabs.
Then I switch to tab B, the label the volume query renders for the label in tab A is no longer .+, otherwise users could include a label that is mutually exclusive with the filter in tab A, dead-ending the user and returning no data for every future query. Now in the count for tab A, we'll show the number of include filters we've added, instead of the number of possible labels the user can select, so when on tab B, the label for tab A would be 1, but when on tab A the count would be n (the cardinality of that label before any filters are applied).

Since there's not an un-confusing way to let users know that the counts used in the tabs/dropdowns are only applicable before any filters are applied, we decided to remove the counts for now, which admittedly sucks, but is arguably better then confusing users with incorrect counts. :(

[matyax]

Looks and works perfectly, really nice work! Left a few minor comments around.

Just one thing that happened to me, that might happen to other people. When I clicked the "add to filters" buttons, I was confused for a minute expecting something to happen in the top section. Even with context about this feature, I was used to seeing filters being appended to the top, and the only change was the button becoming primary and enabled.

Teset.mov

For a follow up, can we consider adding the current filters as text, or at least as a tooltip in the button to make it more evident that you're about to show logs for the selected filters?

[matyax]

Can something be included and excluded at the same time? If not, I would recommend changing this to a boolean or enum.
Can also be included: boolean | null. null === no state, included true, excluded false.

[gtk-grafana]

When I clicked the "add to filters" buttons, I was confused for a minute expecting something to happen in the top section. Even with context about this feature, I was used to seeing filters being appended to the top, and the only change was the button becoming primary and enabled.

@matyax yeah that's my bad, I had forgot to push my most recent commit which addressed exactly this, you've got aggregated metrics enabled, and we don't currently support more then a single label filter with agg metrics. We removed all those buttons when agg metrics is enabled.

[matyax]

Oh, right. I'll disable it.

[matyax]

🚀

[svennergr]

👍