WIP Introduce SourceSelector component
parent
f1fc9640d8
commit
f5b034c98c
|
@ -224,6 +224,7 @@ class CellEditorOverlay extends Component {
|
|||
render() {
|
||||
const {
|
||||
source,
|
||||
sources,
|
||||
onCancel,
|
||||
templates,
|
||||
timeRange,
|
||||
|
@ -280,6 +281,8 @@ class CellEditorOverlay extends Component {
|
|||
{isDisplayOptionsTabActive
|
||||
? <DisplayOptions
|
||||
axes={axes}
|
||||
source={source}
|
||||
sources={sources}
|
||||
onSetBase={this.handleSetBase}
|
||||
onSetLabel={this.handleSetLabel}
|
||||
onSetScale={this.handleSetScale}
|
||||
|
@ -343,6 +346,7 @@ CellEditorOverlay.propTypes = {
|
|||
status: shape({}),
|
||||
}).isRequired,
|
||||
dashboardID: string.isRequired,
|
||||
sources: arrayOf(shape()),
|
||||
}
|
||||
|
||||
CEOBottom.propTypes = {
|
||||
|
|
|
@ -2,6 +2,7 @@ import React, {Component, PropTypes} from 'react'
|
|||
|
||||
import GraphTypeSelector from 'src/dashboards/components/GraphTypeSelector'
|
||||
import AxesOptions from 'src/dashboards/components/AxesOptions'
|
||||
import SourceSelector from 'src/dashboards/components/SourceSelector'
|
||||
|
||||
import {buildDefaultYLabel} from 'shared/presenters'
|
||||
|
||||
|
@ -31,6 +32,8 @@ class DisplayOptions extends Component {
|
|||
: axes
|
||||
}
|
||||
|
||||
formatSources = this.props.sources.map(s => ({...s, text: s.name}))
|
||||
|
||||
render() {
|
||||
const {
|
||||
onSetBase,
|
||||
|
@ -46,15 +49,18 @@ class DisplayOptions extends Component {
|
|||
|
||||
return (
|
||||
<div className="display-options">
|
||||
<AxesOptions
|
||||
axes={axes}
|
||||
onSetBase={onSetBase}
|
||||
onSetLabel={onSetLabel}
|
||||
onSetScale={onSetScale}
|
||||
onSetPrefixSuffix={onSetPrefixSuffix}
|
||||
onSetYAxisBoundMin={onSetYAxisBoundMin}
|
||||
onSetYAxisBoundMax={onSetYAxisBoundMax}
|
||||
/>
|
||||
<div className="foo" style={{display: 'flex', flexDirection: 'row'}}>
|
||||
<AxesOptions
|
||||
axes={axes}
|
||||
onSetBase={onSetBase}
|
||||
onSetLabel={onSetLabel}
|
||||
onSetScale={onSetScale}
|
||||
onSetPrefixSuffix={onSetPrefixSuffix}
|
||||
onSetYAxisBoundMin={onSetYAxisBoundMin}
|
||||
onSetYAxisBoundMax={onSetYAxisBoundMax}
|
||||
/>
|
||||
<SourceSelector sources={this.formatSources} />
|
||||
</div>
|
||||
<GraphTypeSelector
|
||||
selectedGraphType={selectedGraphType}
|
||||
onSelectGraphType={onSelectGraphType}
|
||||
|
@ -66,6 +72,7 @@ class DisplayOptions extends Component {
|
|||
const {arrayOf, func, shape, string} = PropTypes
|
||||
|
||||
DisplayOptions.propTypes = {
|
||||
sources: arrayOf(shape()).isRequired,
|
||||
selectedGraphType: string.isRequired,
|
||||
onSelectGraphType: func.isRequired,
|
||||
onSetPrefixSuffix: func.isRequired,
|
||||
|
|
|
@ -0,0 +1,23 @@
|
|||
import React, {PropTypes} from 'react'
|
||||
|
||||
import Dropdown from 'src/shared/components/Dropdown'
|
||||
|
||||
const SourceSelector = ({sources = []}) =>
|
||||
<div className="display-options--cell">
|
||||
<h5 className="display-options--header">Source Selector</h5>
|
||||
<div className="form-group col-sm-12">
|
||||
<Dropdown
|
||||
onChoose={() => {}}
|
||||
items={sources}
|
||||
selected={sources[0].text}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
const {arrayOf, shape} = PropTypes
|
||||
|
||||
SourceSelector.propTypes = {
|
||||
sources: arrayOf(shape()).isRequired,
|
||||
}
|
||||
|
||||
export default SourceSelector
|
|
@ -190,6 +190,7 @@ class DashboardPage extends Component {
|
|||
|
||||
const {
|
||||
source,
|
||||
sources,
|
||||
timeRange,
|
||||
timeRange: {lower, upper},
|
||||
showTemplateControlBar,
|
||||
|
@ -277,6 +278,7 @@ class DashboardPage extends Component {
|
|||
{selectedCell
|
||||
? <CellEditorOverlay
|
||||
source={source}
|
||||
sources={sources}
|
||||
cell={selectedCell}
|
||||
timeRange={timeRange}
|
||||
autoRefresh={autoRefresh}
|
||||
|
@ -324,6 +326,7 @@ class DashboardPage extends Component {
|
|||
{dashboard
|
||||
? <Dashboard
|
||||
source={source}
|
||||
sources={sources}
|
||||
dashboard={dashboard}
|
||||
timeRange={timeRange}
|
||||
autoRefresh={autoRefresh}
|
||||
|
@ -406,6 +409,7 @@ DashboardPage.propTypes = {
|
|||
status: shape(),
|
||||
}).isRequired,
|
||||
errorThrown: func,
|
||||
sources: arrayOf(shape()),
|
||||
}
|
||||
|
||||
const mapStateToProps = state => {
|
||||
|
@ -415,6 +419,7 @@ const mapStateToProps = state => {
|
|||
persisted: {autoRefresh, showTemplateControlBar},
|
||||
},
|
||||
dashboardUI: {dashboards, timeRange, cellQueryStatus},
|
||||
sources,
|
||||
} = state
|
||||
|
||||
return {
|
||||
|
@ -424,6 +429,7 @@ const mapStateToProps = state => {
|
|||
showTemplateControlBar,
|
||||
inPresentationMode,
|
||||
cellQueryStatus,
|
||||
sources,
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -17,8 +17,6 @@
|
|||
padding: 30px;
|
||||
flex: 1 0 0;
|
||||
margin-right: 8px;
|
||||
|
||||
&:last-child { margin-right: 0; }
|
||||
}
|
||||
.display-options--cellx2 {
|
||||
flex: 2 0 0;
|
||||
|
|
Loading…
Reference in New Issue