grafana/public/app/features/explore/RunButton.tsx
Torkel Ödegaard 2a21f067b7
ButtonSelect & RefreshPicker: Rewrite of components to use new emotion based ToolbarButton & Menu (#30510)
* ButtonSelect: Trying to rewrite the button select to use ToggleButtonGroup & Menu

* minor update

* Progress

* Updated

* Moving all the explore scenarios into the refresh picker component

* Minor fixes

* Fixed responsive part of run button

* More minor fixes

* typescript fix

* Update packages/grafana-ui/src/components/Icon/Icon.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

* Update packages/grafana-ui/src/components/Menu/Menu.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

* Review feedback fixes and more

* Fixes small ts issue

* Updated return to dashboard button and tests, moved ButtonSelect out of LegacyForms

* fixed ts issue

* Fixed test

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>
2021-01-23 08:17:50 +01:00

42 lines
1.0 KiB
TypeScript

import React from 'react';
import { RefreshPicker, defaultIntervals } from '@grafana/ui';
import { getTimeSrv } from 'app/features/dashboard/services/TimeSrv';
export type Props = {
isSmall?: boolean;
loading: boolean;
isLive: boolean;
onRun: (loading: boolean) => void;
refreshInterval?: string;
onChangeRefreshInterval: (interval: string) => void;
showDropdown: boolean;
};
export function RunButton(props: Props) {
const { isSmall, loading, onRun, onChangeRefreshInterval, refreshInterval, showDropdown, isLive } = props;
const intervals = getTimeSrv().getValidIntervals(defaultIntervals);
let text: string | undefined;
if (isLive) {
return null;
}
if (!isSmall) {
text = loading ? 'Cancel' : 'Run query';
}
return (
<RefreshPicker
onIntervalChanged={onChangeRefreshInterval}
value={refreshInterval}
isLoading={loading}
text={text}
intervals={intervals}
isLive={isLive}
onRefresh={() => onRun(loading)}
noIntervalPicker={!showDropdown}
primary={true}
/>
);
}