Refactor: RefreshPicker export things as statics on class (#19443)

This commit is contained in:
Andrej Ocenas
2019-09-27 10:15:05 +02:00
committed by GitHub
parent 8024c39435
commit 234a2c599d
6 changed files with 26 additions and 30 deletions

View File

@@ -8,10 +8,7 @@ import memoizeOne from 'memoize-one';
import { GrafanaTheme } from '../../types';
import { withTheme } from '../../themes';
export const offOption = { label: 'Off', value: '' };
export const liveOption = { label: 'Live', value: 'LIVE' };
export const defaultIntervals = ['5s', '10s', '30s', '1m', '5m', '15m', '30m', '1h', '2h', '1d'];
export const isLive = (refreshInterval: string): boolean => refreshInterval === liveOption.value;
const defaultIntervals = ['5s', '10s', '30s', '1m', '5m', '15m', '30m', '1h', '2h', '1d'];
const getStyles = memoizeOne((theme: GrafanaTheme) => {
return {
@@ -38,10 +35,9 @@ export interface Props {
}
export class RefreshPickerBase extends PureComponent<Props> {
// Make it exported as static properties to be easier to access. The global exports need to be accessed by direct
// import of this source file which won't work if this was installed as package.
static offOption = offOption;
static liveOption = liveOption;
static offOption = { label: 'Off', value: '' };
static liveOption = { label: 'Live', value: 'LIVE' };
static isLive = (refreshInterval: string): boolean => refreshInterval === RefreshPicker.liveOption.value;
constructor(props: Props) {
super(props);
@@ -54,10 +50,10 @@ export class RefreshPickerBase extends PureComponent<Props> {
.map(interval => ({ label: interval, value: interval }));
if (this.props.hasLiveOption) {
options.unshift(liveOption);
options.unshift(RefreshPicker.liveOption);
}
options.unshift(offOption);
options.unshift(RefreshPicker.offOption);
return options;
};
@@ -73,13 +69,13 @@ export class RefreshPickerBase extends PureComponent<Props> {
const { onRefresh, intervals, tooltip, value, refreshButton, buttonSelectClassName, theme } = this.props;
const options = this.intervalsToOptions(intervals);
const currentValue = value || '';
const selectedValue = options.find(item => item.value === currentValue) || offOption;
const selectedValue = options.find(item => item.value === currentValue) || RefreshPicker.offOption;
const styles = getStyles(theme);
const cssClasses = classNames({
'refresh-picker': true,
'refresh-picker--off': selectedValue.label === offOption.label,
'refresh-picker--live': selectedValue === liveOption,
'refresh-picker--off': selectedValue.label === RefreshPicker.offOption.label,
'refresh-picker--live': selectedValue === RefreshPicker.liveOption,
});
return (
@@ -116,5 +112,6 @@ export const RefreshPicker = withTheme<
{
offOption: typeof RefreshPickerBase.offOption;
liveOption: typeof RefreshPickerBase.liveOption;
isLive: typeof RefreshPickerBase.isLive;
}
>(RefreshPickerBase);

View File

@@ -4,7 +4,7 @@ import { tap, switchMap } from 'rxjs/operators';
import _ from 'lodash';
import { stringToMs, SelectableValue } from '@grafana/data';
import { isLive } from '../RefreshPicker/RefreshPicker';
import { RefreshPicker } from '../RefreshPicker/RefreshPicker';
export function getIntervalFromString(strInterval: string): SelectableValue<number> {
return {
@@ -39,7 +39,7 @@ export class SetInterval extends PureComponent<Props> {
switchMap(props => {
// If the query is live, empty value is emited. `of` creates single value,
// which is merged to propsSubject stream
if (isLive(props.interval)) {
if (RefreshPicker.isLive(props.interval)) {
return of({});
}
@@ -61,7 +61,10 @@ export class SetInterval extends PureComponent<Props> {
}
componentDidUpdate(prevProps: Props) {
if ((isLive(prevProps.interval) && isLive(this.props.interval)) || _.isEqual(prevProps, this.props)) {
if (
(RefreshPicker.isLive(prevProps.interval) && RefreshPicker.isLive(this.props.interval)) ||
_.isEqual(prevProps, this.props)
) {
return;
}
// if props changed, a new value is emited from propsSubject