import { getComponentUrl } from '../../../helpers/urls';
import { getFiles } from '../../../api/components';
import { formatMeasure } from '../../../helpers/measures';
+import Workspace from '../../../components/workspace/main';
const HEIGHT = 360;
return `<div class="text-left">${inner}</div>`;
}
+ handleBubbleClick (uuid) {
+ Workspace.openComponent({ uuid });
+ }
+
renderLoading () {
return <div className="overview-chart-placeholder" style={{ height: HEIGHT }}>
<i className="spinner"/>
x: getMeasure(component, this.props.xMetric),
y: getMeasure(component, this.props.yMetric),
size: this.getSizeMetricsValue(component),
- link: getComponentUrl(component.key),
+ link: component.uuid,
tooltip: this.getTooltip(component)
};
});
height={HEIGHT}
padding={[25, 60, 50, 60]}
formatXTick={formatXTick}
- formatYTick={formatYTick}/>;
+ formatYTick={formatYTick}
+ onBubbleClick={this.handleBubbleClick}/>;
}
render () {
},
handleClick () {
- if (this.props.link) {
- window.location = this.props.link;
+ if (this.props.onClick) {
+ this.props.onClick(this.props.link);
}
},
height: React.PropTypes.number,
padding: React.PropTypes.arrayOf(React.PropTypes.number),
formatXTick: React.PropTypes.func,
- formatYTick: React.PropTypes.func
+ formatYTick: React.PropTypes.func,
+ onBubbleClick: React.PropTypes.func
},
mixins: [ResizeMixin, TooltipsMixin],
let bubbles = _.sortBy(this.props.items, (a, b) => b.size - a.size)
.map((item, index) => {
return <Bubble key={index}
- tooltip={item.tooltip}
link={item.link}
- x={xScale(item.x)} y={yScale(item.y)} r={sizeScale(item.size)}/>;
+ tooltip={item.tooltip}
+ x={xScale(item.x)} y={yScale(item.y)} r={sizeScale(item.size)}
+ onClick={this.props.onBubbleClick}/>;
});
let xTicks = this.getTicks(xScale, this.props.formatXTick);