diff --git a/src/shared/components/ProfilePage/Stats/ChartTooltip/index.jsx b/src/shared/components/ProfilePage/Stats/ChartTooltip/index.jsx index de48b50123..a4f45714c7 100644 --- a/src/shared/components/ProfilePage/Stats/ChartTooltip/index.jsx +++ b/src/shared/components/ProfilePage/Stats/ChartTooltip/index.jsx @@ -5,10 +5,11 @@ import React from 'react'; import PT from 'prop-types'; import './styles.scss'; +import _ from 'lodash'; const ChartTooltip = ({ show, left, top, challengeName, - challengeData, rating, ratingColor, href, + challengeData, rating, ratingColor, href, onClick, }) => ( { + e.preventDefault(); + onClick(); + }} >
{rating} @@ -44,6 +49,7 @@ ChartTooltip.defaultProps = { rating: 0, ratingColor: '', href: null, + onClick: _.noop, }; ChartTooltip.propTypes = { @@ -55,6 +61,7 @@ ChartTooltip.propTypes = { rating: PT.number, ratingColor: PT.string, href: PT.string, + onClick: PT.func, }; export default ChartTooltip; diff --git a/src/shared/components/ProfilePage/Stats/HistoryGraph/index.jsx b/src/shared/components/ProfilePage/Stats/HistoryGraph/index.jsx index ce97e80829..aa8affeae0 100644 --- a/src/shared/components/ProfilePage/Stats/HistoryGraph/index.jsx +++ b/src/shared/components/ProfilePage/Stats/HistoryGraph/index.jsx @@ -15,6 +15,7 @@ export default class HistoryGraph extends React.Component { this.state = {}; this.mobileWidth = 0; this.graphRef = React.createRef(); + this.onHandleDataPointClicked = this.onHandleDataPointClicked.bind(this); } componentDidMount() { @@ -58,6 +59,23 @@ export default class HistoryGraph extends React.Component { return 300; } + onHandleDataPointClicked() { + const { challengeId, href } = this.state; + fetch(`${config.API.V5}/challenges?legacyId=${challengeId}`) + .then(result => result.json()) + .then((dataResponse) => { + if (dataResponse.length > 0) { + const challenge = dataResponse[0]; + window.location.href = `${config.URL.CHALLENGES_URL}/${challenge.id}`; + } else { + window.location.href = href; + } + }).catch(() => { + window.location.href = href; + }); + } + + draw() { const $scope = this; const { history: wrapper, track, subTrack } = this.props; @@ -247,6 +265,7 @@ export default class HistoryGraph extends React.Component { show: true, left: e.pageX, top: e.pageY, + challengeId: d.challengeId, challengeName: d.challengeName, challengeData: moment(d.ratingDate).format('MMM DD, YYYY'), rating: d.newRating, @@ -259,7 +278,18 @@ export default class HistoryGraph extends React.Component { render() { return (
- + { + const { track } = this.props; + const { href } = this.state; + if (track === 'DATA_SCIENCE') { + this.onHandleDataPointClicked(); + } else { + window.location.href = href; + } + }} + />
); }