1
0
mirror of https://github.com/yldio/copilot.git synced 2024-12-05 01:20:08 +02:00
copilot/spikes/graphs-topology/d3/client/graph/graph-node-metrics.js
2017-02-07 18:26:38 +00:00

48 lines
1.0 KiB
JavaScript

const React = require('react');
const Styled = require('styled-components');
const GraphNodeButton = require('./graph-node-button');
const {
default: styled
} = Styled;
const StyledText = styled.text`
fill: white;
font-family: LibreFranklin;
font-size: 12px;
`;
class GraphNodeMetrics extends React.Component {
render() {
const {
metrics,
metricsPosition
} = this.props;
const metricSpacing = 18;
const metricsText = metrics.map((metric, index) => (
<StyledText x={0} y={12 + metricSpacing*index}>{`${metric.name}: ${metric.stat}`}</StyledText>
));
return (
<g transform={`translate(${metricsPosition.x}, ${metricsPosition.y})`}>
{metricsText}
</g>
);
}
}
GraphNodeMetrics.propTypes = {
metrics: React.PropTypes.arrayOf(React.PropTypes.shape({
name: React.PropTypes.string,
stat: React.PropTypes.string
})),
metricsPosition: React.PropTypes.shape({
x: React.PropTypes.number,
y: React.PropTypes.number
})
};
module.exports = GraphNodeMetrics;