public/grafana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Prometheus: Enable Combobox metric select by default (#101045)

Browse Source 
* Prometheus: enable prometheusUsesCombobox toggle by default

* bold Combobox
This commit is contained in:
Josh Hunt
2025-03-30 20:24:53 +03:00
committed by GitHub
parent 88e51d549c
commit 7ea0fab606
12 changed files with 37 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md
+2 -2
View File
@@ -75,6 +75,7 @@ Most [generally available](https://grafana.com/docs/release-life-cycle/#general-
| `alertingQueryAndExpressionsStepMode` | Enables step mode for alerting queries and expressions | Yes |
| `useSessionStorageForRedirection` | Use session storage for handling the redirection after login | Yes |
| `pluginsSriChecks` | Enables SRI checks for plugin assets | |
| `prometheusUsesCombobox` | Use new **Combobox** component for Prometheus query editor | Yes |
| `azureMonitorDisableLogLimit` | Disables the log limit restriction for Azure Monitor when true. The limit is enabled by default. | |
| `preinstallAutoUpdate` | Enables automatic updates for pre-installed plugins | Yes |
| `reportingUseRawTimeRange` | Uses the original report or dashboard time range instead of making an absolute transformation | Yes |
@@ -204,7 +205,6 @@ Experimental features might be changed or removed without prior notice.
| `rolePickerDrawer` | Enables the new role picker drawer design |
| `unifiedStorageBigObjectsSupport` | Enables to save big objects in blob storage |
| `timeRangeProvider` | Enables time pickers sync |
| `prometheusUsesCombobox` | Use new combobox component for Prometheus query editor |
| `playlistsReconciler` | Enables experimental reconciler for playlists |
| `exploreMetricsRelatedLogs` | Display Related Logs in Grafana Metrics Drilldown |
| `prometheusSpecialCharsInLabelValues` | Adds support for quotes and special characters in label values for Prometheus queries |
@@ -216,7 +216,7 @@ Experimental features might be changed or removed without prior notice.
| `investigationsBackend` | Enable the investigations backend API |
| `k8SFolderCounts` | Enable folder's api server counts |
| `k8SFolderMove` | Enable folder's api server move |
| `templateVariablesUsesCombobox` | Use new combobox component for template variables |
| `templateVariablesUsesCombobox` | Use new **Combobox** component for template variables |
| `grafanaAdvisor` | Enables Advisor app |
| `elasticsearchImprovedParsing` | Enables less memory intensive Elasticsearch result parsing |
| `newLogsPanel` | Enables the new logs panel in Explore |
e2e/old-arch/various-suite/prometheus-config.spec.ts
+2 -2
View File
@@ -106,6 +106,6 @@ describe('Prometheus config', () => {
// exemplars tested in exemplar.spec
});
export function selectOption(option: string) {
e2e.components.Select.option().contains(option).should('be.visible').click();
function selectOption(option: string) {
cy.get('[role="option"]').filter(`:contains("${option}")`).should('be.visible').click();
}
e2e/old-arch/various-suite/prometheus-editor.spec.ts
+3 -8
View File
@@ -141,8 +141,7 @@ describe('Prometheus query editor', () => {
getResources();
e2e.components.DataSource.Prometheus.queryEditor.builder.metricSelect().should('exist').click();
e2e.components.DataSource.Prometheus.queryEditor.builder.metricSelect().should('exist').click().type('metric1');
selectOption('metric1');
e2e.components.DataSource.Prometheus.queryEditor.builder.hints().contains('hint: add rate');
@@ -153,15 +152,11 @@ describe('Prometheus query editor', () => {
getResources();
e2e.components.DataSource.Prometheus.queryEditor.builder.metricSelect().should('exist').click();
selectOption('Metrics explorer');
e2e.components.DataSource.Prometheus.queryEditor.builder.metricsExplorer().should('exist');
cy.get(`[aria-label="Open metrics explorer"]`).should('exist');
});
});
});
function selectOption(option: string) {
e2e.components.Select.option().contains(option).should('be.visible').click();
cy.get('[role="option"]').filter(`:contains("${option}")`).should('be.visible').click();
}
e2e/old-arch/various-suite/prometheus-variable-editor.spec.ts
+1 -1
View File
@@ -118,5 +118,5 @@ describe('Prometheus variable query editor', () => {
});
function selectOption(option: string) {
e2e.components.Select.option().contains(option).should('be.visible').click();
cy.get('[role="option"]').filter(`:contains("${option}")`).should('be.visible').click();
}
packages/grafana-data/src/types/featureToggles.gen.ts
+3 -2
View File
@@ -836,7 +836,8 @@ export interface FeatureToggles {
*/
timeRangeProvider?: boolean;
/**
* Use new combobox component for Prometheus query editor
* Use new **Combobox** component for Prometheus query editor
* @default true
*/
prometheusUsesCombobox?: boolean;
/**
@@ -951,7 +952,7 @@ export interface FeatureToggles {
*/
ABTestFeatureToggleA?: boolean;
/**
* Use new combobox component for template variables
* Use new **Combobox** component for template variables
*/
templateVariablesUsesCombobox?: boolean;
/**
packages/grafana-prometheus/src/querybuilder/components/MetricCombobox.tsx
+2
View File
@@ -1,6 +1,7 @@
import { useCallback, useState } from 'react';
import { SelectableValue } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors';
import { EditorField, EditorFieldGroup, InputGroup } from '@grafana/plugin-ui';
import { Button, InlineField, InlineFieldRow, Combobox, ComboboxOption } from '@grafana/ui';
@@ -93,6 +94,7 @@ export function MetricCombobox({
value={query.metric}
onChange={onComboboxChange}
createCustomValue
data-testid={selectors.components.DataSource.Prometheus.queryEditor.builder.metricSelect}
/>
<Button
tooltip="Open metrics explorer"
packages/grafana-ui/src/components/Combobox/Combobox.tsx
+4
View File
@@ -57,6 +57,8 @@ export interface ComboboxBaseProps<T extends string | number>
* */
width?: number | 'auto';
['data-testid']?: string;
/**
* Called when the input loses focus.
*/
@@ -120,6 +122,7 @@ export const Combobox = <T extends string | number>(props: ComboboxProps<T>) =>
minWidth,
maxWidth,
'aria-labelledby': ariaLabelledBy,
'data-testid': dataTestId,
autoFocus,
onBlur,
disabled,
@@ -359,6 +362,7 @@ export const Combobox = <T extends string | number>(props: ComboboxProps<T>) =>
onChange: noop, // Empty onCall to avoid TS error https://github.com/downshift-js/downshift/issues/718
'aria-labelledby': ariaLabelledBy, // Label should be handled with the Field component
placeholder,
'data-testid': dataTestId,
})}
/>
<Portal>
packages/grafana-ui/src/components/Input/AutoSizeInput.tsx
+1 -1
View File
@@ -50,6 +50,7 @@ export const AutoSizeInput = React.forwardRef<HTMLInputElement, Props>((props, r
return (
<AutoSizeInputContext.Provider value={true}>
<Input
data-testid="autosize-input" // consumer should override default testid
{...restProps}
placeholder={placeholder}
ref={ref}
@@ -76,7 +77,6 @@ export const AutoSizeInput = React.forwardRef<HTMLInputElement, Props>((props, r
onCommitChange(event);
}
}}
data-testid="autosize-input"
/>
</AutoSizeInputContext.Provider>
);
pkg/services/featuremgmt/registry.go
+4 -3
View File
@@ -1434,9 +1434,10 @@ var (
},
{
Name: "prometheusUsesCombobox",
Description: "Use new combobox component for Prometheus query editor",
Stage: FeatureStageExperimental,
Description: "Use new **Combobox** component for Prometheus query editor",
Stage: FeatureStageGeneralAvailability,
Owner: grafanaOSSBigTent,
Expression: "true", // enabled by default
},
{
Name: "azureMonitorDisableLogLimit",
@@ -1620,7 +1621,7 @@ var (
},
{
Name: "templateVariablesUsesCombobox",
Description: "Use new combobox component for template variables",
Description: "Use new **Combobox** component for template variables",
Stage: FeatureStageExperimental,
Owner: grafanaFrontendPlatformSquad,
FrontendOnly: true,
pkg/services/featuremgmt/toggles_gen.csv
+1 -1
View File
@@ -188,7 +188,7 @@ managedDualWriter,experimental,@grafana/search-and-storage,false,false,false
pluginsSriChecks,GA,@grafana/plugins-platform-backend,false,false,false
unifiedStorageBigObjectsSupport,experimental,@grafana/search-and-storage,false,false,false
timeRangeProvider,experimental,@grafana/grafana-frontend-platform,false,false,false
prometheusUsesCombobox,experimental,@grafana/oss-big-tent,false,false,false
prometheusUsesCombobox,GA,@grafana/oss-big-tent,false,false,false
azureMonitorDisableLogLimit,GA,@grafana/partner-datasources,false,false,false
preinstallAutoUpdate,GA,@grafana/plugins-platform-backend,false,false,false
playlistsReconciler,experimental,@grafana/grafana-app-platform-squad,false,true,false
1 Name Stage Owner requiresDevMode RequiresRestart FrontendOnly
188 pluginsSriChecks GA @grafana/plugins-platform-backend false false false
189 unifiedStorageBigObjectsSupport experimental @grafana/search-and-storage false false false
190 timeRangeProvider experimental @grafana/grafana-frontend-platform false false false
191 prometheusUsesCombobox experimental GA @grafana/oss-big-tent false false false
192 azureMonitorDisableLogLimit GA @grafana/partner-datasources false false false
193 preinstallAutoUpdate GA @grafana/plugins-platform-backend false false false
194 playlistsReconciler experimental @grafana/grafana-app-platform-squad false true false
pkg/services/featuremgmt/toggles_gen.go
+2 -2
View File
@@ -764,7 +764,7 @@ const (
FlagTimeRangeProvider = "timeRangeProvider"
// FlagPrometheusUsesCombobox
// Use new combobox component for Prometheus query editor
// Use new **Combobox** component for Prometheus query editor
FlagPrometheusUsesCombobox = "prometheusUsesCombobox"
// FlagAzureMonitorDisableLogLimit
@@ -868,7 +868,7 @@ const (
FlagABTestFeatureToggleA = "ABTestFeatureToggleA"
// FlagTemplateVariablesUsesCombobox
// Use new combobox component for template variables
// Use new **Combobox** component for template variables
FlagTemplateVariablesUsesCombobox = "templateVariablesUsesCombobox"
// FlagABTestFeatureToggleB
pkg/services/featuremgmt/toggles_gen.json
+12 -8
View File
@@ -3493,16 +3493,17 @@
{
"metadata": {
"name": "prometheusUsesCombobox",
"resourceVersion": "1735845919509",
"resourceVersion": "1740072685161",
"creationTimestamp": "2024-10-23T11:18:33Z",
"annotations": {
"grafana.app/updatedTimestamp": "2025-01-02 19:25:19.509884 +0000 UTC"
"grafana.app/updatedTimestamp": "2025-02-20 17:31:25.161842198 +0000 UTC"
}
},
"spec": {
"description": "Use new combobox component for Prometheus query editor",
"stage": "experimental",
"codeowner": "@grafana/oss-big-tent"
"description": "Use new **Combobox** component for Prometheus query editor",
"stage": "GA",
"codeowner": "@grafana/oss-big-tent",
"expression": "true"
}
},
{
@@ -4076,11 +4077,14 @@
{
"metadata": {
"name": "templateVariablesUsesCombobox",
"resourceVersion": "1738141787383",
"creationTimestamp": "2025-01-29T09:09:47Z"
"resourceVersion": "1740072685161",
"creationTimestamp": "2025-01-29T09:09:47Z",
"annotations": {
"grafana.app/updatedTimestamp": "2025-02-20 17:31:25.161842198 +0000 UTC"
}
},
"spec": {
"description": "Use new combobox component for template variables",
"description": "Use new **Combobox** component for template variables",
"stage": "experimental",
"codeowner": "@grafana/grafana-frontend-platform",
"frontend": true