Fix button "Run query" width (#32655) (#39081)

* Fix button "Run query" width (#32655)

* Minor refactoring for simpler fix

* Removed new prop

Co-authored-by: Torkel Ödegaard <torkel@grafana.com>
This commit is contained in:
Alexander Kubyshkin 2021-11-16 14:22:33 +02:00 committed by GitHub
parent 0da6ac2efa
commit e4cc41dd5b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 4 deletions

View File

@ -54,7 +54,7 @@ export class RefreshPicker extends PureComponent<Props> {
}
render() {
const { onRefresh, intervals, tooltip, value, text, isLoading, noIntervalPicker } = this.props;
const { onRefresh, intervals, tooltip, value, text, isLoading, noIntervalPicker, width } = this.props;
const currentValue = value || '';
const variant = this.getVariant();
@ -73,6 +73,7 @@ export class RefreshPicker extends PureComponent<Props> {
onClick={onRefresh}
variant={variant}
icon={isLoading ? 'fa fa-spinner' : 'sync'}
style={width ? { width } : undefined}
data-testid={selectors.components.RefreshPicker.runButtonV2}
>
{text}

View File

@ -15,14 +15,16 @@ export type Props = {
export function RunButton(props: Props) {
const { isSmall, loading, onRun, onChangeRefreshInterval, refreshInterval, showDropdown, isLive } = props;
const intervals = getTimeSrv().getValidIntervals(defaultIntervals);
let text: string | undefined;
let text: string | undefined = loading ? 'Cancel' : 'Run query';
let width = '108px';
if (isLive) {
return null;
}
if (!isSmall) {
text = loading ? 'Cancel' : 'Run query';
if (isSmall) {
text = undefined;
width = '35px';
}
return (
@ -36,6 +38,7 @@ export function RunButton(props: Props) {
onRefresh={() => onRun(loading)}
noIntervalPicker={!showDropdown}
primary={true}
width={width}
/>
);
}