parent
1ac2d037c2
commit
5a90cdb810
|
@ -1,38 +0,0 @@
|
||||||
import React from 'react'
|
|
||||||
import PropTypes from 'prop-types'
|
|
||||||
|
|
||||||
import {THRESHOLD_TYPE_BG, THRESHOLD_TYPE_TEXT} from 'shared/constants/thresholds'
|
|
||||||
|
|
||||||
// TODO: Needs major refactoring to make thresholds a much more general component to be shared between single stat, gauge, and table.
|
|
||||||
const GraphOptionsThresholdColoring = ({
|
|
||||||
onToggleThresholdsListType,
|
|
||||||
thresholdsListType,
|
|
||||||
}) => {
|
|
||||||
return (
|
|
||||||
<div className="form-group col-xs-12 col-md-6">
|
|
||||||
<label>Threshold Coloring</label>
|
|
||||||
<ul className="nav nav-tablist nav-tablist-sm">
|
|
||||||
<li
|
|
||||||
className={`${thresholdsListType === THRESHOLD_TYPE_BG ? 'active' : ''}`}
|
|
||||||
onClick={onToggleThresholdsListType(THRESHOLD_TYPE_BG)}
|
|
||||||
>
|
|
||||||
Background
|
|
||||||
</li>
|
|
||||||
<li
|
|
||||||
className={`${thresholdsListType === THRESHOLD_TYPE_TEXT ? 'active' : ''}`}
|
|
||||||
onClick={onToggleThresholdsListType(THRESHOLD_TYPE_TEXT)}
|
|
||||||
>
|
|
||||||
Text
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
const {func, string} = PropTypes
|
|
||||||
|
|
||||||
GraphOptionsThresholdColoring.propTypes = {
|
|
||||||
thresholdsListType: string,
|
|
||||||
onToggleThresholdsListType: func,
|
|
||||||
}
|
|
||||||
|
|
||||||
export default GraphOptionsThresholdColoring
|
|
|
@ -1,75 +0,0 @@
|
||||||
import React from 'react'
|
|
||||||
import PropTypes from 'prop-types'
|
|
||||||
import Threshold from 'src/dashboards/components/Threshold'
|
|
||||||
import ColorDropdown from 'shared/components/ColorDropdown'
|
|
||||||
|
|
||||||
import {GAUGE_COLORS, THRESHOLD_TYPE_BASE} from 'shared/constants/thresholds'
|
|
||||||
|
|
||||||
// TODO: Needs major refactoring to make thresholds a much more general component to be shared between single stat, gauge, and table.
|
|
||||||
const GraphOptionsThresholds = ({
|
|
||||||
onAddThreshold,
|
|
||||||
disableAddThreshold,
|
|
||||||
sortedColors,
|
|
||||||
formatColor,
|
|
||||||
onChooseColor,
|
|
||||||
onValidateColorValue,
|
|
||||||
onUpdateColorValue,
|
|
||||||
onDeleteThreshold,
|
|
||||||
}) => {
|
|
||||||
return (
|
|
||||||
<div className="gauge-controls graph-options-group">
|
|
||||||
<label className="form-label">Thresholds</label>
|
|
||||||
<button
|
|
||||||
className="btn btn-sm btn-primary gauge-controls--add-threshold"
|
|
||||||
onClick={onAddThreshold}
|
|
||||||
disabled={disableAddThreshold}
|
|
||||||
>
|
|
||||||
<span className="icon plus" /> Add Threshold
|
|
||||||
</button>
|
|
||||||
{sortedColors.map(
|
|
||||||
color =>
|
|
||||||
color.id === THRESHOLD_TYPE_BASE
|
|
||||||
? <div className="gauge-controls--section" key={color.id}>
|
|
||||||
<div className="gauge-controls--label">Base Color</div>
|
|
||||||
<ColorDropdown
|
|
||||||
colors={GAUGE_COLORS}
|
|
||||||
selected={formatColor(color)}
|
|
||||||
onChoose={onChooseColor(color)}
|
|
||||||
stretchToFit={true}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
: <Threshold
|
|
||||||
visualizationType="single-stat"
|
|
||||||
threshold={color}
|
|
||||||
key={color.id}
|
|
||||||
onChooseColor={onChooseColor}
|
|
||||||
onValidateColorValue={onValidateColorValue}
|
|
||||||
onUpdateColorValue={onUpdateColorValue}
|
|
||||||
onDeleteThreshold={onDeleteThreshold}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
const {arrayOf, bool, func, shape, string, number} = PropTypes
|
|
||||||
|
|
||||||
GraphOptionsThresholds.propTypes = {
|
|
||||||
onAddThreshold: func,
|
|
||||||
disableAddThreshold: bool,
|
|
||||||
sortedColors: arrayOf(
|
|
||||||
shape({
|
|
||||||
hex: string,
|
|
||||||
id: string,
|
|
||||||
name: string,
|
|
||||||
type: string,
|
|
||||||
value: number,
|
|
||||||
})
|
|
||||||
),
|
|
||||||
formatColor: func,
|
|
||||||
onChooseColor: func,
|
|
||||||
onValidateColorValue: func,
|
|
||||||
onUpdateColorValue: func,
|
|
||||||
onDeleteThreshold: func,
|
|
||||||
}
|
|
||||||
|
|
||||||
export default GraphOptionsThresholds
|
|
Loading…
Reference in New Issue