Query Search Page (#1122)

* Query search page under SQL Lab tab

* Modifications based on comments

* Hash

* Added spec and endpoint test with modifications
based on second round comments

* Changed permission menu in https://github.com/airbnb/caravel/pull/1095/files
This commit is contained in:
vera-liu
2016-09-23 16:13:18 -07:00
committed by GitHub
parent 98902599ff
commit d5c5c0d6ac
13 changed files with 345 additions and 144 deletions

View File

@@ -0,0 +1,71 @@
import * as Actions from '../actions';
import React from 'react';
import TabbedSqlEditors from './TabbedSqlEditors';
import QueryAutoRefresh from './QueryAutoRefresh';
import QuerySearch from './QuerySearch';
import Alerts from './Alerts';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
hash: window.location.hash,
};
}
componentDidMount() {
window.addEventListener('hashchange', this.onHashChanged.bind(this));
}
componentWillUnmount() {
window.removeEventListener('hashchange', this.onHashChanged.bind(this));
}
onHashChanged() {
this.setState({ hash: window.location.hash });
}
render() {
if (this.state.hash) {
return (
<div className="container-fluid">
<div className="row">
<div className="col-md-12">
<QuerySearch />
</div>
</div>
</div>
);
}
return (
<div className="App SqlLab">
<div className="container-fluid">
<QueryAutoRefresh />
<Alerts alerts={this.props.alerts} />
<div className="row">
<div className="col-md-12">
<TabbedSqlEditors />
</div>
</div>
</div>
</div>
);
}
}
App.propTypes = {
alerts: React.PropTypes.array,
};
function mapStateToProps(state) {
return {
alerts: state.alerts,
};
}
function mapDispatchToProps(dispatch) {
return {
actions: bindActionCreators(Actions, dispatch),
};
}
export default connect(mapStateToProps, mapDispatchToProps)(App);