mirror of
https://github.com/apache/superset.git
synced 2024-09-12 08:39:45 -04:00
[explorev2] making QueryAndSaveBtns disabled while running queries (#1841)
As I altered QueryAndSaveBtns to add the `disabled` prop I also moved it to using react-boostrap
This commit is contained in:
parent
bf67d64708
commit
d929bbfe30
@ -1,36 +1,46 @@
|
||||
import React, { PropTypes } from 'react';
|
||||
import { Button, ButtonGroup } from 'react-bootstrap';
|
||||
import classnames from 'classnames';
|
||||
|
||||
const propTypes = {
|
||||
canAdd: PropTypes.string.isRequired,
|
||||
onQuery: PropTypes.func.isRequired,
|
||||
onSave: PropTypes.func,
|
||||
disabled: PropTypes.bool,
|
||||
};
|
||||
|
||||
const defaultProps = {
|
||||
onSave: () => {},
|
||||
disabled: false,
|
||||
};
|
||||
|
||||
export default function QueryAndSaveBtns({ canAdd, onQuery, onSave }) {
|
||||
const saveClasses = classnames('btn btn-default btn-sm', {
|
||||
export default function QueryAndSaveBtns({ canAdd, onQuery, onSave, disabled }) {
|
||||
const saveClasses = classnames({
|
||||
'disabled disabledButton': canAdd !== 'True',
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="btn-group query-and-save">
|
||||
<button id="query_button" type="button" className="btn btn-primary btn-sm" onClick={onQuery}>
|
||||
<i className="fa fa-bolt"></i> Query
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
<ButtonGroup className="query-and-save">
|
||||
<Button
|
||||
id="query_button"
|
||||
onClick={onQuery}
|
||||
bsSize="small"
|
||||
disabled={disabled}
|
||||
bsStyle="primary"
|
||||
>
|
||||
<i className="fa fa-bolt" /> Query
|
||||
</Button>
|
||||
<Button
|
||||
className={saveClasses}
|
||||
bsSize="small"
|
||||
data-target="#save_modal"
|
||||
data-toggle="modal"
|
||||
disabled={disabled}
|
||||
onClick={onSave}
|
||||
>
|
||||
<i className="fa fa-plus-circle"></i> Save as
|
||||
</button>
|
||||
</div>
|
||||
</Button>
|
||||
</ButtonGroup>
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -14,6 +14,7 @@ const propTypes = {
|
||||
form_data: React.PropTypes.object.isRequired,
|
||||
actions: React.PropTypes.object.isRequired,
|
||||
datasource_type: React.PropTypes.string.isRequired,
|
||||
chartStatus: React.PropTypes.string.isRequired,
|
||||
};
|
||||
|
||||
|
||||
@ -94,6 +95,7 @@ class ExploreViewContainer extends React.Component {
|
||||
canAdd="True"
|
||||
onQuery={this.onQuery.bind(this, this.props.form_data)}
|
||||
onSave={this.toggleModal.bind(this)}
|
||||
disabled={this.props.chartStatus === 'loading'}
|
||||
/>
|
||||
<br /><br />
|
||||
<ControlPanelsContainer
|
||||
@ -121,6 +123,7 @@ function mapStateToProps(state) {
|
||||
return {
|
||||
datasource_type: state.datasource_type,
|
||||
form_data: state.viz.form_data,
|
||||
chartStatus: state.chartStatus,
|
||||
};
|
||||
}
|
||||
|
||||
|
@ -1,5 +1,6 @@
|
||||
import React from 'react';
|
||||
import { beforeEach, describe, it } from 'mocha';
|
||||
import { Button } from 'react-bootstrap';
|
||||
import { expect } from 'chai';
|
||||
import { shallow } from 'enzyme';
|
||||
import sinon from 'sinon';
|
||||
@ -26,12 +27,12 @@ describe('QueryAndSaveButtons', () => {
|
||||
});
|
||||
|
||||
it('renders 2 buttons', () => {
|
||||
expect(wrapper.find('button')).to.have.lengthOf(2);
|
||||
expect(wrapper.find(Button)).to.have.lengthOf(2);
|
||||
});
|
||||
|
||||
it('renders buttons with correct text', () => {
|
||||
expect(wrapper.find('button').contains(' Query')).to.eql(true);
|
||||
expect(wrapper.find('button').contains(' Save as')).to.eql(true);
|
||||
expect(wrapper.find(Button).contains(' Query')).to.eql(true);
|
||||
expect(wrapper.find(Button).contains(' Save as')).to.eql(true);
|
||||
});
|
||||
|
||||
it('calls onQuery when query button is clicked', () => {
|
||||
|
Loading…
Reference in New Issue
Block a user