Update DataExplorer to extend Component

pull/10616/head
Andrew Watkins 2017-08-09 16:25:07 -07:00
parent 27c9e0a4e4
commit 1a8d2dd625
1 changed files with 58 additions and 55 deletions

View File

@ -1,4 +1,4 @@
import React, {PropTypes} from 'react'
import React, {PropTypes, Component} from 'react'
import {connect} from 'react-redux'
import {bindActionCreators} from 'redux'
@ -18,64 +18,29 @@ import {setAutoRefresh} from 'shared/actions/app'
import * as dataExplorerActionCreators from 'src/data_explorer/actions/view'
import {writeLineProtocolAsync} from 'src/data_explorer/actions/view/write'
const {arrayOf, func, number, shape, string} = PropTypes
class DataExplorer extends Component {
constructor(props) {
super(props)
const DataExplorer = React.createClass({
propTypes: {
source: shape({
links: shape({
proxy: string.isRequired,
self: string.isRequired,
queries: string.isRequired,
}).isRequired,
}).isRequired,
queryConfigs: arrayOf(shape({})).isRequired,
queryConfigActions: shape({
editQueryStatus: func.isRequired,
}).isRequired,
autoRefresh: number.isRequired,
handleChooseAutoRefresh: func.isRequired,
timeRange: shape({
upper: string,
lower: string,
}).isRequired,
setTimeRange: func.isRequired,
dataExplorer: shape({
queryIDs: arrayOf(string).isRequired,
}).isRequired,
writeLineProtocol: func.isRequired,
errorThrownAction: func.isRequired,
},
childContextTypes: {
source: shape({
links: shape({
proxy: string.isRequired,
self: string.isRequired,
}).isRequired,
}).isRequired,
},
getChildContext() {
return {source: this.props.source}
},
getInitialState() {
return {
this.state = {
activeQueryIndex: 0,
showWriteForm: false,
}
},
}
getChildContext() {
return {source: this.props.source}
}
handleSetActiveQueryIndex(index) {
this.setState({activeQueryIndex: index})
},
}
handleDeleteQuery(index) {
const {queryConfigs} = this.props
const {queryConfigs, queryConfigActions} = this.props
const query = queryConfigs[index]
this.props.queryConfigActions.deleteQuery(query.id)
},
queryConfigActions.deleteQuery(query.id)
}
render() {
const {
@ -89,6 +54,7 @@ const DataExplorer = React.createClass({
source,
writeLineProtocol,
} = this.props
const {activeQueryIndex, showWriteForm} = this.state
const selectedDatabase = _.get(
queryConfigs,
@ -129,8 +95,8 @@ const DataExplorer = React.createClass({
autoRefresh={autoRefresh}
timeRange={timeRange}
isInDataExplorer={true}
setActiveQueryIndex={this.handleSetActiveQueryIndex}
onDeleteQuery={this.handleDeleteQuery}
setActiveQueryIndex={::this.handleSetActiveQueryIndex}
onDeleteQuery={::this.handleDeleteQuery}
activeQueryIndex={activeQueryIndex}
/>
<Visualization
@ -145,10 +111,47 @@ const DataExplorer = React.createClass({
</ResizeContainer>
</div>
)
},
})
}
}
function mapStateToProps(state) {
const {arrayOf, func, number, shape, string} = PropTypes
DataExplorer.propTypes = {
source: shape({
links: shape({
proxy: string.isRequired,
self: string.isRequired,
queries: string.isRequired,
}).isRequired,
}).isRequired,
queryConfigs: arrayOf(shape({})).isRequired,
queryConfigActions: shape({
editQueryStatus: func.isRequired,
}).isRequired,
autoRefresh: number.isRequired,
handleChooseAutoRefresh: func.isRequired,
timeRange: shape({
upper: string,
lower: string,
}).isRequired,
setTimeRange: func.isRequired,
dataExplorer: shape({
queryIDs: arrayOf(string).isRequired,
}).isRequired,
writeLineProtocol: func.isRequired,
errorThrownAction: func.isRequired,
}
DataExplorer.childContextTypes = {
source: shape({
links: shape({
proxy: string.isRequired,
self: string.isRequired,
}).isRequired,
}).isRequired,
}
const mapStateToProps = state => {
const {
app: {persisted: {autoRefresh}},
dataExplorer,
@ -165,7 +168,7 @@ function mapStateToProps(state) {
}
}
function mapDispatchToProps(dispatch) {
const mapDispatchToProps = dispatch => {
return {
handleChooseAutoRefresh: bindActionCreators(setAutoRefresh, dispatch),
errorThrownAction: bindActionCreators(errorThrown, dispatch),