diff --git a/ui/src/data_explorer/components/Table.js b/ui/src/data_explorer/components/Table.js index 3888b3cc2..64d408911 100644 --- a/ui/src/data_explorer/components/Table.js +++ b/ui/src/data_explorer/components/Table.js @@ -1,7 +1,6 @@ import React, {PropTypes} from 'react' import {Table, Column, Cell} from 'fixed-data-table' import Dimensions from 'react-dimensions' -import fetchTimeSeries from 'shared/apis/timeSeries' import _ from 'lodash' import moment from 'moment' @@ -45,10 +44,12 @@ const ChronoTable = React.createClass({ query: shape({ host: arrayOf(string.isRequired).isRequired, text: string.isRequired, + id: string.isRequired, }).isRequired, containerWidth: number.isRequired, height: number, onEditRawStatus: func, + fetchTimeSeries: func.isRequired, }, getInitialState() { @@ -82,44 +83,25 @@ const ChronoTable = React.createClass({ return } - const {onEditRawStatus} = this.props - - onEditRawStatus(query.id, {loading: true}) this.setState({isLoading: true}) // second param is db, we want to leave this blank try { - const {data} = await fetchTimeSeries(query.host, undefined, query.text) + const results = await this.props.fetchTimeSeries(query.host, undefined, query) this.setState({isLoading: false}) - onEditRawStatus(query.id, {loading: false}) - const results = _.get(data, ['results', '0'], false) if (!results) { - return + return this.setState({cellData: emptyCells}) } - // 200 from server and no results = warn - if (_.isEmpty(results)) { - this.setState({cellData: emptyCells}) - return onEditRawStatus(query.id, {warn: 'Your query is syntactically correct but returned no results'}) - } - - // 200 from chrono server but influx returns an error = warn - const warn = _.get(results, 'error', false) - if (warn) { - this.setState({cellData: emptyCells}) - return onEditRawStatus(query.id, {warn}) - } - - // 200 from server and results contains data = success const cellData = _.get(results, ['series', '0'], {}) - onEditRawStatus(query.id, {success: 'Success!'}) this.setState({cellData}) } catch (error) { - // 400 from chrono server = fail - const message = _.get(error, ['data', 'message'], error) - this.setState({isLoading: false}) - console.error(message) - onEditRawStatus(query.id, {error: message}) + this.setState({ + isLoading: false, + cellData: emptyCells, + }) + console.error(error) + throw error } }, diff --git a/ui/src/data_explorer/components/Visualization.js b/ui/src/data_explorer/components/Visualization.js index 353b4e9aa..1d115a265 100644 --- a/ui/src/data_explorer/components/Visualization.js +++ b/ui/src/data_explorer/components/Visualization.js @@ -35,7 +35,7 @@ const Visualization = React.createClass({ activeQueryIndex: number, height: string, heightPixels: number, - onEditRawStatus: func.isRequired, + fetchTimeSeries: func.isRequired, }, contextTypes: { @@ -76,7 +76,7 @@ const Visualization = React.createClass({ }, render() { - const {queryConfigs, timeRange, height, heightPixels, onEditRawStatus, activeQueryIndex} = this.props + const {queryConfigs, timeRange, height, heightPixels, fetchTimeSeries, activeQueryIndex} = this.props const {source} = this.context const proxyLink = source.links.proxy const {view} = this.state @@ -93,29 +93,29 @@ const Visualization = React.createClass({
- {this.renderVisualization(view, queries, heightPixels, onEditRawStatus, activeQueryIndex)} + {this.renderVisualization(view, queries, heightPixels, fetchTimeSeries, activeQueryIndex)}
) }, - renderVisualization(view, queries, heightPixels, onEditRawStatus, activeQueryIndex) { + renderVisualization(view, queries, heightPixels, fetchTimeSeries, activeQueryIndex) { const activeQuery = queries[activeQueryIndex] const defaultQuery = queries[0] if (view === TABLE) { - return this.renderTable(activeQuery || defaultQuery, heightPixels, onEditRawStatus) + return this.renderTable(activeQuery || defaultQuery, heightPixels, fetchTimeSeries) } return this.renderGraph(queries) }, - renderTable(query, heightPixels, onEditRawStatus) { + renderTable(query, heightPixels, fetchTimeSeries) { if (!query) { return
Enter your query below
} - return + return
}, renderGraph(queries) { diff --git a/ui/src/data_explorer/containers/DataExplorer.js b/ui/src/data_explorer/containers/DataExplorer.js index 2b694f269..a5cd15a2e 100644 --- a/ui/src/data_explorer/containers/DataExplorer.js +++ b/ui/src/data_explorer/containers/DataExplorer.js @@ -10,6 +10,7 @@ import Header from '../containers/Header' import ResizeContainer, {ResizeBottom} from 'src/shared/components/ResizeContainer' import {setAutoRefresh} from 'shared/actions/app' +import {fetchTimeSeriesAsync} from 'shared/actions/timeSeries' import * as viewActions from 'src/data_explorer/actions/view' const { @@ -40,6 +41,7 @@ const DataExplorer = React.createClass({ dataExplorer: shape({ queryIDs: arrayOf(string).isRequired, }).isRequired, + fetchTimeSeries: func.isRequired, }, childContextTypes: { @@ -72,7 +74,7 @@ const DataExplorer = React.createClass({ }, render() { - const {autoRefresh, handleChooseAutoRefresh, timeRange, setTimeRange, queryConfigs, queryConfigActions} = this.props + const {autoRefresh, handleChooseAutoRefresh, timeRange, setTimeRange, queryConfigs, queryConfigActions, fetchTimeSeries} = this.props const {activeQueryIndex} = this.state return ( @@ -88,7 +90,7 @@ const DataExplorer = React.createClass({ timeRange={timeRange} queryConfigs={queryConfigs} activeQueryIndex={activeQueryIndex} - onEditRawStatus={queryConfigActions.editRawQueryStatus} + fetchTimeSeries={fetchTimeSeries} /> async (dispatch) => { + dispatch(editQueryStatus(query.id, {loading: true})) -export const fetchTimeSeriesAsync = (source, database, query) => async (dispatch) => { try { - const {data} = await fetchTimeSeries(source, database, query) + const {data} = await proxy({source, db, query: query.text}) + const results = _.get(data, ['results', '0'], false) + const warn = _.get(results, 'error', false) + + // 200 from server and no results = warn + if (_.isEmpty(results)) { + dispatch(editQueryStatus(query.id, {warn: 'Your query is syntactically correct but returned no results'})) + return results + } + + // 200 from chrono server but influx returns an error = warning + if (warn) { + dispatch(editQueryStatus(query.id, {warn})) + return warn + } + + // 200 from server and results contains data = success + dispatch(editQueryStatus(query.id, {success: 'Success!'})) + return results } catch (error) { + const message = _.get(error, ['data', 'message'], error) + + // 400 from chrono server = fail + dispatch(editQueryStatus(query.id, {error: message})) console.error(error) throw error }