Prometheus: Tweak query builder select component (#59749)

* Have consistent color for operators

* Add more operators and reorder them to align with dashboard filters
This commit is contained in:
ismail simsek 2022-12-08 20:52:27 +03:00 committed by GitHub
parent 22f828300d
commit 551a2ac9ec
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -6,9 +6,10 @@ import { selectors } from '@grafana/e2e-selectors';
import { AccessoryButton, InputGroup } from '@grafana/experimental';
import { AsyncSelect, Select } from '@grafana/ui';
import { PROMETHEUS_QUERY_BUILDER_MAX_RESULTS } from '../components/MetricSelect';
import { QueryBuilderLabelFilter } from '../shared/types';
import { PROMETHEUS_QUERY_BUILDER_MAX_RESULTS } from './MetricSelect';
export interface Props {
defaultOp: string;
item: Partial<QueryBuilderLabelFilter>;
@ -89,6 +90,7 @@ export function LabelFilterItem({
{/* Operator select i.e. = =~ != !~ */}
<Select
aria-label={selectors.components.QueryBuilder.matchOperatorSelect}
className="query-segment-operator"
value={toOption(item.op ?? defaultOp)}
options={operators}
width="auto"
@ -159,8 +161,10 @@ export function LabelFilterItem({
}
const operators = [
{ label: '=~', value: '=~', isMultiValue: true },
{ label: '=', value: '=', isMultiValue: false },
{ label: '!=', value: '!=', isMultiValue: false },
{ label: '<', value: '<', isMultiValue: false },
{ label: '>', value: '>', isMultiValue: false },
{ label: '=~', value: '=~', isMultiValue: true },
{ label: '!~', value: '!~', isMultiValue: true },
];