The open and composable observability and data visualization platform. Visualize metrics, logs, and traces from multiple sources like Prometheus, Loki, Elasticsearch, InfluxDB, Postgres and many more.
This PR updates the Prometheus data source's query builder. Specifically, its handling of filter values when using regex selectors (~=, ~!).
Before
In the <Input /> for filter values, custom input would always appear last in the autocomplete options. When using regex operators, the regex input would appear last and was not focused by default. The text next to the regex input didn't align with the outcome of pressing the enter key.
When using regex selectors, custom input appears as the top-most (and focused-by-default) option. Misleading "Hit enter to add" text has been removed to avoid confusion.
As described in #70635, it's difficult for Prometheus data source users to select filter values when using regex selectors in the query builder. This difficulty comes from two areas:
The regex they write appears as the bottom-most option in the <Select />, sometimes out of view.
Next to their custom value, the text "Hit enter to add" incorrectly set an expectation that hitting enter would select the custom value. In reality, this is only true if the custom value was focused in response to user action (up/down keys, mouse-over).
Who is this feature for?
Prometheus data source users, especially those who use regex for filter values in the query builder.
Which issue(s) does this PR fix?
This PR fixes #70635.
Special notes for your reviewer:
Please check that:
[x] It works as expected from a user's perspective.
[x] (Not applicable) If this is a pre-GA feature, it is behind a feature toggle.
What is this feature?
This PR updates the Prometheus data source's query builder. Specifically, its handling of filter values when using regex selectors (
~=,~!).Before
In the
<Input />for filter values, custom input would always appear last in the autocomplete options. When using regex operators, the regex input would appear last and was not focused by default. The text next to the regex input didn't align with the outcome of pressing the enter key.https://github.com/grafana/grafana/assets/5732000/98661405-ef9f-47b6-8f21-151e9cb0c50f
After
When using regex selectors, custom input appears as the top-most (and focused-by-default) option. Misleading "Hit enter to add" text has been removed to avoid confusion.
https://github.com/grafana/grafana/assets/5732000/bd8a9fef-7ace-4583-9292-da9b3e5556de
Why do we need this feature?
As described in #70635, it's difficult for Prometheus data source users to select filter values when using regex selectors in the query builder. This difficulty comes from two areas:
<Select />, sometimes out of view.Who is this feature for?
Prometheus data source users, especially those who use regex for filter values in the query builder.
Which issue(s) does this PR fix?
This PR fixes #70635.
Special notes for your reviewer:
Please check that:
(Not applicable)If this is a pre-GA feature, it is behind a feature toggle.