diff --git a/.betterer.results b/.betterer.results index 1586689c545..6f20db80f84 100644 --- a/.betterer.results +++ b/.betterer.results @@ -233,9 +233,6 @@ exports[`no enzyme tests`] = { "public/app/features/explore/RichHistory/RichHistoryStarredTab.test.tsx:3933225580": [ [0, 17, 13, "RegExp match", "2409514259"] ], - "public/app/features/explore/RunButton.test.tsx:4267530266": [ - [0, 19, 13, "RegExp match", "2409514259"] - ], "public/app/features/explore/SecondaryActions.test.tsx:1177396128": [ [0, 19, 13, "RegExp match", "2409514259"] ], diff --git a/public/app/features/explore/ExploreToolbar.tsx b/public/app/features/explore/ExploreToolbar.tsx index aace8efe1aa..afa39a549ad 100644 --- a/public/app/features/explore/ExploreToolbar.tsx +++ b/public/app/features/explore/ExploreToolbar.tsx @@ -3,18 +3,25 @@ import { connect, ConnectedProps } from 'react-redux'; import { DataSourceInstanceSettings, RawTimeRange } from '@grafana/data'; import { config, DataSourcePicker } from '@grafana/runtime'; -import { PageToolbar, SetInterval, ToolbarButton, ToolbarButtonRow } from '@grafana/ui'; +import { + defaultIntervals, + PageToolbar, + RefreshPicker, + SetInterval, + ToolbarButton, + ToolbarButtonRow, +} from '@grafana/ui'; import { createAndCopyShortLink } from 'app/core/utils/shortLinks'; import { ExploreId } from 'app/types/explore'; import { StoreState } from 'app/types/store'; import { DashNavButton } from '../dashboard/components/DashNav/DashNavButton'; +import { getTimeSrv } from '../dashboard/services/TimeSrv'; import { updateFiscalYearStartMonthForSession, updateTimeZoneForSession } from '../profile/state/reducers'; import { getFiscalYearStartMonth, getTimeZone } from '../profile/state/selectors'; import { ExploreTimeControls } from './ExploreTimeControls'; import { LiveTailButton } from './LiveTailButton'; -import { RunButton } from './RunButton'; import { changeDatasource } from './state/datasource'; import { splitClose, splitOpen } from './state/main'; import { cancelQueries, runQueries } from './state/query'; @@ -58,6 +65,35 @@ class UnConnectedExploreToolbar extends PureComponent { syncTimes(exploreId); }; + renderRefreshPicker = (showSmallTimePicker: boolean) => { + const { loading, refreshInterval, isLive } = this.props; + + let refreshPickerText: string | undefined = loading ? 'Cancel' : 'Run query'; + let refreshPickerTooltip = undefined; + let refreshPickerWidth = '108px'; + if (showSmallTimePicker) { + refreshPickerTooltip = refreshPickerText; + refreshPickerText = undefined; + refreshPickerWidth = '35px'; + } + + return ( + this.onRunQuery(loading)} + noIntervalPicker={isLive} + primary={true} + width={refreshPickerWidth} + /> + ); + }; + render() { const { datasourceMissing, @@ -144,15 +180,7 @@ class UnConnectedExploreToolbar extends PureComponent { /> )} - + {this.renderRefreshPicker(showSmallTimePicker)} {refreshInterval && } diff --git a/public/app/features/explore/RunButton.test.tsx b/public/app/features/explore/RunButton.test.tsx deleted file mode 100644 index 1edfe706ee3..00000000000 --- a/public/app/features/explore/RunButton.test.tsx +++ /dev/null @@ -1,49 +0,0 @@ -import { shallow } from 'enzyme'; -import React from 'react'; - -import { RefreshPicker } from '@grafana/ui'; -import { getTimeSrv, TimeSrv } from 'app/features/dashboard/services/TimeSrv'; - -import { RunButton, Props } from './RunButton'; - -const setup = (propOverrides?: object) => { - const props: Props = { - isSmall: false, - loading: false, - isLive: false, - onRun: jest.fn(), - refreshInterval: '5m', - onChangeRefreshInterval: jest.fn(), - showDropdown: false, - }; - - Object.assign(props, propOverrides); - - const wrapper = shallow(); - return wrapper; -}; - -const validIntervals = ['1d']; -jest.mock('app/features/dashboard/services/TimeSrv', () => ({ - getTimeSrv: jest.fn().mockReturnValue({ - getValidIntervals(intervals: string[]): string[] { - return validIntervals; - }, - }), -})); -const getTimeSrvMock = getTimeSrv as any as jest.Mock; - -beforeEach(() => { - getTimeSrvMock.mockClear(); -}); - -describe('RunButton', () => { - describe('if showdropdown is set', () => { - it('should render a RefreshPicker with only valid intervals', () => { - const wrapper = setup({ showDropdown: true }); - - expect(wrapper.find(RefreshPicker)).toHaveLength(1); - expect(wrapper.find(RefreshPicker).props().intervals).toEqual(validIntervals); - }); - }); -}); diff --git a/public/app/features/explore/RunButton.tsx b/public/app/features/explore/RunButton.tsx deleted file mode 100644 index 96a48506027..00000000000 --- a/public/app/features/explore/RunButton.tsx +++ /dev/null @@ -1,48 +0,0 @@ -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 = loading ? 'Cancel' : 'Run query'; - let tooltip = ''; - let width = '108px'; - - if (isLive) { - return null; - } - - if (isSmall) { - tooltip = text; - text = undefined; - width = '35px'; - } - - return ( - onRun(loading)} - noIntervalPicker={!showDropdown} - primary={true} - width={width} - /> - ); -}