grafana/public/app/features/variables/query/QueryVariableRefreshSelect.tsx
Diana Payton e34b2c13d3
Variables UI text edits (#32523)
* Update formatRegistry.ts

* text edits

* Update adapter.ts

* Update adapter.ts

* text edits

* Update SelectionOptionsEditor.tsx

* Update CustomVariableEditor.tsx

* Update DataSourceVariableEditor.tsx

* Update IntervalVariableEditor.tsx

* Update VariableEditorList.tsx

* Update adapter.ts

* Update actions.ts

* Update NetworkGraphModal.tsx

* Update actions.ts

* Update operators.ts

* text edits
2021-04-01 18:17:39 +02:00

33 lines
1.1 KiB
TypeScript

import React, { PropsWithChildren, useMemo } from 'react';
import { SelectableValue } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors';
import { VariableSelectField } from '../editor/VariableSelectField';
import { VariableRefresh } from '../types';
interface Props {
onChange: (option: SelectableValue<VariableRefresh>) => void;
refresh: VariableRefresh;
}
const REFRESH_OPTIONS = [
{ label: 'Never', value: VariableRefresh.never },
{ label: 'On dashboard load', value: VariableRefresh.onDashboardLoad },
{ label: 'On time range change', value: VariableRefresh.onTimeRangeChanged },
];
export function QueryVariableRefreshSelect({ onChange, refresh }: PropsWithChildren<Props>) {
const value = useMemo(() => REFRESH_OPTIONS.find((o) => o.value === refresh) ?? REFRESH_OPTIONS[0], [refresh]);
return (
<VariableSelectField
name="Refresh"
value={value}
options={REFRESH_OPTIONS}
onChange={onChange}
labelWidth={10}
ariaLabel={selectors.pages.Dashboard.Settings.Variables.Edit.QueryVariable.queryOptionsRefreshSelect}
tooltip="When to update the values of this variable."
/>
);
}