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

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 },
];