mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
47f8717149
* update eslint, tsconfig + esbuild to handle new jsx transform * remove thing that breaks the new jsx transform * remove react imports * adjust grafana-icons build * is this the correct syntax? * try this * well this was much easier than expected... * change grafana-plugin-configs webpack config * fixes * fix lockfile * fix 2 more violations * use path.resolve instead of require.resolve * remove react import * fix react imports * more fixes * remove React import * remove import React from docs * remove another react import
40 lines
1.5 KiB
TypeScript
40 lines
1.5 KiB
TypeScript
import { PropsWithChildren, useMemo } from 'react';
|
|
|
|
import { SelectableValue, VariableSort } from '@grafana/data';
|
|
|
|
import { VariableSelectField } from '../../dashboard-scene/settings/variables/components/VariableSelectField';
|
|
|
|
interface Props {
|
|
onChange: (option: SelectableValue<VariableSort>) => void;
|
|
sort: VariableSort;
|
|
testId?: string;
|
|
}
|
|
|
|
const SORT_OPTIONS = [
|
|
{ label: 'Disabled', value: VariableSort.disabled },
|
|
{ label: 'Alphabetical (asc)', value: VariableSort.alphabeticalAsc },
|
|
{ label: 'Alphabetical (desc)', value: VariableSort.alphabeticalDesc },
|
|
{ label: 'Numerical (asc)', value: VariableSort.numericalAsc },
|
|
{ label: 'Numerical (desc)', value: VariableSort.numericalDesc },
|
|
{ label: 'Alphabetical (case-insensitive, asc)', value: VariableSort.alphabeticalCaseInsensitiveAsc },
|
|
{ label: 'Alphabetical (case-insensitive, desc)', value: VariableSort.alphabeticalCaseInsensitiveDesc },
|
|
{ label: 'Natural (asc)', value: VariableSort.naturalAsc },
|
|
{ label: 'Natural (desc)', value: VariableSort.naturalDesc },
|
|
];
|
|
|
|
export function QueryVariableSortSelect({ onChange, sort, testId }: PropsWithChildren<Props>) {
|
|
const value = useMemo(() => SORT_OPTIONS.find((o) => o.value === sort) ?? SORT_OPTIONS[0], [sort]);
|
|
|
|
return (
|
|
<VariableSelectField
|
|
name="Sort"
|
|
description="How to sort the values of this variable"
|
|
value={value}
|
|
options={SORT_OPTIONS}
|
|
onChange={onChange}
|
|
testId={testId}
|
|
width={25}
|
|
/>
|
|
);
|
|
}
|