final fixes on mm dashboard

Author: ThomasKranitsas

src/shared/components/challenge-detail/Header/TabSelector/index.jsx

@@ -10,7 +10,6 @@ import PT from 'prop-types';
 import { TABS as DETAIL_TABS } from 'actions/page/challenge-details';
 import { config } from 'topcoder-react-utils';
 
-import { isMMChallenge } from 'utils/challenge-detail/helper';
 import style from './style.scss';
 
 function getSelectorStyle(selectedView, currentView) {
@@ -221,7 +220,7 @@ export default function ChallengeViewSelector(props) {
           return '';
         })()}
         {
-          (isMMChallenge(challenge)) && (
+          isMM && (
             <a
               tabIndex="0"
               role="tab"

src/shared/components/challenge-detail/MMDashboard/Graph/index.jsx

@@ -5,10 +5,18 @@ import HighchartsReact from 'highcharts-react-official';
 import PT from 'prop-types';
 import moment from 'moment';
 import { getRatingColor } from 'utils/tc';
+import ReactSVG from 'react-svg';
+import { isomorphy } from 'topcoder-react-utils';
 
 import './styles.scss';
 import _ from 'lodash';
 
+
+let assets;
+if (isomorphy.isClientSide()) {
+  assets = require.context('assets/images', false, /svg/);
+}
+
 export default function Graph({ statisticsData, baseline, awardLine }) {
   const flatData = [];
   const dates = [];
@@ -34,7 +42,7 @@ export default function Graph({ statisticsData, baseline, awardLine }) {
       {
         data: _.map(flatData, data => ({
           x: moment(data.created).valueOf(),
-          y: data.score,
+          y: _.max([0, data.score ? (parseFloat(data.score)) : 0]),
           name: data.handle,
           color: data.ratingColor
             || getRatingColor(data.rating
@@ -104,7 +112,10 @@ export default function Graph({ statisticsData, baseline, awardLine }) {
       formatter() {
         const str = `
           <div style="border-radius:4px;">
-            <img height="30" width="30" src="${this.point.customData.photoUrl}" style="position: absolute; border-radius: 50%;" />
+            ${this.point.customData.photoUrl
+    ? `<img height="30" width="30" src="${this.point.customData.photoUrl}" style="position: absolute; border-radius: 50%;" />`
+    : <ReactSVG path={assets('./ico-user-default.svg')} />}
+            
             <p style="margin-left: 50px">${this.point.customData.handle}</p>
             <br />
             <p style="margin-left: 50px;">${this.point.customData.submissionCount} submissions</p>

src/shared/containers/challenge-detail/index.jsx

@@ -23,6 +23,7 @@ import Winners from 'components/challenge-detail/Winners';
 import MMDashboardGraph from 'components/challenge-detail/MMDashboard/Graph';
 import ChallengeDetailsView from 'components/challenge-detail/Specification';
 import RecommendedThriveArticles from 'components/challenge-detail/ThriveArticles';
+import LoadingIndicator from 'components/LoadingIndicator';
 // eslint-disable-next-line max-len
 // import RecommendedActiveChallenges from 'components/challenge-detail/RecommendedActiveChallenges';
 import Terms from 'containers/Terms';
@@ -215,13 +216,19 @@ class ChallengeDetailPageContainer extends React.Component {
       challenge,
       // loadingRecommendedChallengesUUID,
       history,
+      selectedTab,
+      onSelectorClicked,
     } = this.props;
 
     if (challenge.isLegacyChallenge && !history.location.pathname.includes(challenge.id)) {
       history.location.pathname = `/challenges/${challenge.id}`; // eslint-disable-line no-param-reassign
       history.push(history.location.pathname, history.state);
     }
 
+    if (!checkIsMM(challenge) && selectedTab === DETAIL_TABS.MM_DASHBOARD) {
+      onSelectorClicked(DETAIL_TABS.DETAILS);
+    }
+
     // const recommendedTechnology = getRecommendedTags(challenge);
     // if (
     //   challenge
@@ -581,7 +588,9 @@ class ChallengeDetailPageContainer extends React.Component {
             && (!statisticsData || statisticsData.length === 0)
             && (
               <div styleName="page">
-                Dashboard data is not available!
+                {
+                  !statisticsData ? <LoadingIndicator /> : 'Dashboard data is not available!'
+                }
               </div>
             )
           }
@@ -591,8 +600,8 @@ class ChallengeDetailPageContainer extends React.Component {
             && (
               <MMDashboardGraph
                 statisticsData={statisticsData}
-                baseline={_.get(_.find(_.get(challenge, 'metadta', []), meta => meta.name === 'baseline'), 'value', 0)}
-                awardLine={_.get(_.find(_.get(challenge, 'metadta', []), meta => meta.name === 'awardLine'), 'value', 0)}
+                baseline={_.get(_.find(_.get(challenge, 'metadata', []), meta => meta.name === 'baseline'), 'value', 0)}
+                awardLine={_.get(_.find(_.get(challenge, 'metadata', []), meta => meta.name === 'awardLine'), 'value', 0)}
               />
             )
           }

src/shared/utils/challenge-detail/helper.jsx

@@ -179,14 +179,6 @@ export function getRecommendedTags(challenge) {
   return recommendedTag;
 }
 
-/**
- * Checks if current challenge is Marathon and Challenge type
- * @param {Object} challenge challenge info
- */
-export function isMMChallenge(challenge) {
-  return challenge.track === 'Data Science' && challenge.type === 'Challenge';
-}
-
 /**
  * Get display recommended challenge
  * @param {Object} challenge challenge info