diff --git a/client/app/scripts/components/node-details-controls.js b/client/app/scripts/components/node-details-controls.js index 07edc5e60..fb46f2527 100644 --- a/client/app/scripts/components/node-details-controls.js +++ b/client/app/scripts/components/node-details-controls.js @@ -14,11 +14,13 @@ const NodeDetailsControls = React.createClass({ return (
- {this.props.controls && this.props.controls.map(control => { - return ( - - ); - })} + + {this.props.controls && this.props.controls.map(control => { + return ( + + ); + })} + {this.props.controls && } {this.props.error &&
diff --git a/client/app/scripts/components/node-details-table.js b/client/app/scripts/components/node-details-table.js index b2a7cf1c1..767c0585f 100644 --- a/client/app/scripts/components/node-details-table.js +++ b/client/app/scripts/components/node-details-table.js @@ -12,7 +12,7 @@ const NodeDetailsTable = React.createClass({ {this.props.rows.map(function(row) { return ( -
+
{row.key}
{ row.value_type === 'numeric' &&
{row.value_major}
} { row.value_type === 'numeric' &&
{row.value_minor}
} diff --git a/client/app/scripts/components/sparkline.js b/client/app/scripts/components/sparkline.js index 306731b66..216e11bb2 100644 --- a/client/app/scripts/components/sparkline.js +++ b/client/app/scripts/components/sparkline.js @@ -1,5 +1,6 @@ // Forked from: https://github.com/KyleAMathews/react-sparkline at commit a9d7c5203d8f240938b9f2288287aaf0478df013 const React = require('react'); +const ReactDOM = require('react-dom'); const d3 = require('d3'); const Sparkline = React.createClass({ @@ -21,7 +22,7 @@ const Sparkline = React.createClass({ renderSparkline: function() { // If the sparkline has already been rendered, remove it. - const el = this.getDOMNode(); + const el = ReactDOM.findDOMNode(this); while (el.firstChild) { el.removeChild(el.firstChild); } @@ -89,9 +90,9 @@ const Sparkline = React.createClass({ title = data.length + ' samples, min: ' + d3.round(d3.min(data), 2) + ', max: ' + d3.round(d3.max(data), 2) + ', mean: ' + d3.round(d3.mean(data), 2); } - d3.select(this.getDOMNode()).attr('title', title); + d3.select(ReactDOM.findDOMNode(this)).attr('title', title); - const svg = d3.select(this.getDOMNode()). + const svg = d3.select(ReactDOM.findDOMNode(this)). append('svg'). attr('width', this.props.width). attr('height', this.props.height). diff --git a/client/app/scripts/components/topology-options.js b/client/app/scripts/components/topology-options.js index a749317a5..301324a37 100644 --- a/client/app/scripts/components/topology-options.js +++ b/client/app/scripts/components/topology-options.js @@ -7,10 +7,15 @@ const TopologyOptions = React.createClass({ renderAction: function(action, option, topologyId) { return ( - + ); }, + /** + * transforms a list of options into one sidebar-item. + * The sidebar text comes from the active option. the actions come from the + * remaining items. + */ renderOption: function(items) { let activeText; let activeValue; @@ -41,7 +46,7 @@ const TopologyOptions = React.createClass({ }, this); return ( -
+
{activeText} {actions}