export const ComplexityDistribution = React.createClass({
propTypes: {
- distribution: React.PropTypes.string.isRequired
+ distribution: React.PropTypes.string.isRequired,
+ of: React.PropTypes.string.isRequired
},
renderBarChart () {
let data = this.props.distribution.split(';').map((point, index) => {
- let tokens = point.split('=');
- return { x: index, y: parseInt(tokens[1], 10), value: parseInt(tokens[0], 10) };
+ let tokens = point.split('='),
+ y = parseInt(tokens[1], 10),
+ value = parseInt(tokens[0], 10);
+ return {
+ x: index,
+ y: y,
+ value: value,
+ tooltip: window.tp(`overview.complexity_tooltip.${this.props.of}`, y, value)
+ };
});
let xTicks = data.map(point => point.value);
<div className="overview-detailed-measures-list">
<DetailedMeasure {...this.props} {...this.state} metric="complexity" type="INT"/>
<DetailedMeasure {...this.props} {...this.state} metric="function_complexity" type="FLOAT">
- <ComplexityDistribution distribution={this.state.measures['function_complexity_distribution']}/>
+ <ComplexityDistribution
+ distribution={this.state.measures['function_complexity_distribution']}
+ of="function"/>
</DetailedMeasure>
<DetailedMeasure {...this.props} {...this.state} metric="file_complexity" type="FLOAT">
- <ComplexityDistribution distribution={this.state.measures['file_complexity_distribution']}/>
+ <ComplexityDistribution
+ distribution={this.state.measures['file_complexity_distribution']}
+ of="file"/>
</DetailedMeasure>
<DetailedMeasure {...this.props} {...this.state} metric="class_complexity" type="FLOAT"/>
{this.renderOtherComplexityMeasures()}
beforeEach(function () {
let renderer = TestUtils.createRenderer();
- renderer.render(<ComplexityDistribution distribution={DISTRIBUTION}/>);
+ renderer.render(<ComplexityDistribution distribution={DISTRIBUTION} of="function"/>);
let output = renderer.getRenderOutput();
let child = React.Children.only(output.props.children);
props = child.props;
it('should pass right data', function () {
expect(props.data).to.deep.equal([
- { x: 0, y: 11950, value: 1 },
- { x: 1, y: 86, value: 2 },
- { x: 2, y: 77, value: 4 },
- { x: 3, y: 43, value: 6 },
- { x: 4, y: 17, value: 8 },
- { x: 5, y: 12, value: 10 },
- { x: 6, y: 3, value: 12 }
+ { x: 0, y: 11950, value: 1, tooltip: 'overview.complexity_tooltip.function.11950.1' },
+ { x: 1, y: 86, value: 2, tooltip: 'overview.complexity_tooltip.function.86.2' },
+ { x: 2, y: 77, value: 4, tooltip: 'overview.complexity_tooltip.function.77.4' },
+ { x: 3, y: 43, value: 6, tooltip: 'overview.complexity_tooltip.function.43.6' },
+ { x: 4, y: 17, value: 8, tooltip: 'overview.complexity_tooltip.function.17.8' },
+ { x: 5, y: 12, value: 10, tooltip: 'overview.complexity_tooltip.function.12.10' },
+ { x: 6, y: 3, value: 12, tooltip: 'overview.complexity_tooltip.function.3.12' }
]);
});