diff --git a/ui/src/dashboards/components/CellEditorOverlay.js b/ui/src/dashboards/components/CellEditorOverlay.js index d19bbaaef5..41999b23eb 100644 --- a/ui/src/dashboards/components/CellEditorOverlay.js +++ b/ui/src/dashboards/components/CellEditorOverlay.js @@ -4,7 +4,7 @@ import _ from 'lodash' import uuid from 'node-uuid' import ResizeContainer from 'shared/components/ResizeContainer' -import QueryMaker from 'src/data_explorer/components/QueryMaker' +import QueryMaker from 'src/dashboards/components/QueryMaker' import Visualization from 'src/dashboards/components/Visualization' import OverlayControls from 'src/dashboards/components/OverlayControls' import DisplayOptions from 'src/dashboards/components/DisplayOptions' diff --git a/ui/src/dashboards/components/QueryMaker.js b/ui/src/dashboards/components/QueryMaker.js new file mode 100644 index 0000000000..2ead74a064 --- /dev/null +++ b/ui/src/dashboards/components/QueryMaker.js @@ -0,0 +1,181 @@ +import React, {PropTypes} from 'react' + +import QueryBuilder from 'src/data_explorer/components/QueryBuilder' +import QueryMakerTab from 'src/data_explorer/components/QueryMakerTab' +import buildInfluxQLQuery from 'utils/influxql' +import classnames from 'classnames' + +const {arrayOf, bool, func, node, number, shape, string} = PropTypes + +const QueryMaker = React.createClass({ + propTypes: { + source: shape({ + links: shape({ + queries: string.isRequired, + }).isRequired, + }).isRequired, + queries: arrayOf(shape({})).isRequired, + timeRange: shape({ + upper: string, + lower: string, + }).isRequired, + templates: arrayOf( + shape({ + tempVar: string.isRequired, + }) + ), + isInDataExplorer: bool, + actions: shape({ + chooseNamespace: func.isRequired, + chooseMeasurement: func.isRequired, + chooseTag: func.isRequired, + groupByTag: func.isRequired, + addQuery: func.isRequired, + toggleField: func.isRequired, + groupByTime: func.isRequired, + toggleTagAcceptance: func.isRequired, + applyFuncsToField: func.isRequired, + editRawTextAsync: func.isRequired, + }).isRequired, + height: string, + top: string, + setActiveQueryIndex: func.isRequired, + onDeleteQuery: func.isRequired, + activeQueryIndex: number, + children: node, + layout: string, + }, + + handleAddQuery() { + const newIndex = this.props.queries.length + this.props.actions.addQuery() + this.props.setActiveQueryIndex(newIndex) + }, + + handleAddRawQuery() { + const newIndex = this.props.queries.length + this.props.actions.addQuery({rawText: ''}) + this.props.setActiveQueryIndex(newIndex) + }, + + getActiveQuery() { + const {queries, activeQueryIndex} = this.props + const activeQuery = queries[activeQueryIndex] + const defaultQuery = queries[0] + + return activeQuery || defaultQuery + }, + + render() { + const {height, top, layout} = this.props + return ( +