merge develop into hot-fix-no-result

Author: LieutenantRoger

.circleci/config.yml

@@ -174,7 +174,7 @@ workflows:
           filters:
             branches:
               only: 
-                - develop
+                - develop                
                 - hot-fix-no-result
       # This is alternate dev env for parallel testing
       - "build-test":
@@ -183,14 +183,14 @@ workflows:
             branches:
               only:
                 - develop
-                - feature-contentful
       # This is beta env for production soft releases
       - "build-prod-beta":
           context : org-global
           filters:
             branches:
               only:
                 - develop
+                - feature-contentful
       # Production builds are exectuted only on tagged commits to the
       # master branch.
       - "build-prod":

src/shared/components/Leaderboard/Podium/index.jsx

@@ -42,7 +42,7 @@ export default function Podium(props) {
   } = props;
 
   const renderPodium = (comps) => {
-    let podiumSpots = comps.map(comp => (
+    const podiumSpots = comps.map(comp => (
       <div key={comp.rank} styleName="podium-column">
         <PodiumSpot
           competitor={comp}
@@ -55,16 +55,6 @@ export default function Podium(props) {
       </div>
     ));
 
-    if (comps.length === 3) {
-      podiumSpots = [
-        ...podiumSpots.slice(0, 0),
-        podiumSpots[1],
-        ...podiumSpots.slice(1, 1),
-        podiumSpots[0],
-        ...podiumSpots.slice(2),
-      ];
-    }
-
     return (
       <div styleName="PodiumWrap">
         {podiumSpots}

src/shared/components/Leaderboard/PodiumSpot/index.jsx

@@ -42,6 +42,7 @@ const PODIUM_ITEM_MODIFIER = {
   1: 'first',
   2: 'second',
   3: 'third',
+  4: 'fourth',
 };
 
 /**
@@ -53,11 +54,13 @@ const CUSTOM_STYLES = {
     1: avatarStyles.gold,
     2: avatarStyles.silver,
     3: avatarStyles.bronze,
+    4: avatarStyles.iron,
   },
   TCO20: {
     1: avatarStyles['tco20-1'],
     2: avatarStyles['tco20-2'],
     3: avatarStyles['tco20-3'],
+    4: avatarStyles['tco20-4'],
   },
 };
 
@@ -68,6 +71,7 @@ const DISPLAY_RANKING = {
   1: '1',
   2: '2',
   3: '3',
+  4: '4',
 };
 
 const THEME = {
@@ -158,7 +162,7 @@ export default function PodiumSpot(props) {
           isCopilot ? (
             <div styleName={`${stylesName}.stats`}>
               <span styleName={`${stylesName}.value`}>{competitor.fulfillment}</span>
-              <span>fulfillment</span>
+              <span styleName={`${stylesName}.value-title`}>fulfillment</span>
             </div>
           ) : null
         }

src/shared/components/Leaderboard/PodiumSpot/themes/tco20.scss

@@ -3,16 +3,16 @@ $podium-border-color: #ededf2;
 
 .PodiumSpot {
   border-radius: 6px;
-  padding: 25px;
+  padding: 23px 15px;
   display: flex;
-  width: 324px;
+  width: auto;
 
   .leaderboard-avatar {
     display: inline-block;
-    overflow: hidden;
     position: relative;
     margin-bottom: 12px;
     margin-right: 20px;
+    overflow: visible;
   }
 
   .ranking {
@@ -23,7 +23,7 @@ $podium-border-color: #ededf2;
     display: inline-block;
     position: absolute;
     right: 0;
-    bottom: 10px;
+    bottom: -10px;
     font-size: 15px;
   }
 
@@ -35,15 +35,16 @@ $podium-border-color: #ededf2;
     color: #56565d;
     font-size: 18px;
     display: flex;
-    justify-content: space-around;
+    justify-content: center;
     flex-direction: column;
 
     .stats {
       color: #747480;
-      font-size: 15px;
+      font-size: 16px;
       font-weight: 400;
       line-height: 25px;
       display: flex;
+      margin-bottom: 4px;
 
       .value-title {
         color: #2a2a2a;
@@ -91,12 +92,12 @@ $podium-border-color: #ededf2;
   a.profile-link {
     color: #0d61bf;
     font-family: Barlow, sans-serif;
-    font-size: 20px;
+    font-size: 16px;
     font-weight: 600;
-    line-height: 24px;
+    line-height: 19px;
     text-align: left;
     text-decoration: underline;
-    margin-bottom: 15px;
+    margin-bottom: 13px;
 
     &:hover {
       text-decoration: none;
@@ -135,31 +136,41 @@ $podium-border-color: #ededf2;
   }
 }
 
+.PodiumSpot--fourth {
+  background-color: #8dccd4;
+
+  .ranking {
+    background-color: #2a2a2a;
+    color: #fff;
+  }
+}
+
 .PodiumSpot--first,
 .PodiumSpot--second,
-.PodiumSpot--third {
+.PodiumSpot--third,
+.PodiumSpot--fourth {
   margin-top: 0;
 
   .leaderboard-avatar {
-    height: 64px;
-    width: 64px;
+    height: 79px;
+    width: 79px;
   }
 }
 
-@include md-to-lg {
-  .PodiumSpot--first .leaderboard-avatar,
-  .PodiumSpot--second .leaderboard-avatar,
-  .PodiumSpot--third .leaderboard-avatar {
-    height: 96px;
-    width: 96px;
-  }
-}
-
-@include xl {
-  .PodiumSpot--first .leaderboard-avatar,
-  .PodiumSpot--second .leaderboard-avatar,
-  .PodiumSpot--third .leaderboard-avatar {
-    height: 128px;
-    width: 128px;
-  }
-}
+// @include md-to-lg {
+//   .PodiumSpot--first .leaderboard-avatar,
+//   .PodiumSpot--second .leaderboard-avatar,
+//   .PodiumSpot--third .leaderboard-avatar {
+//     height: 96px;
+//     width: 96px;
+//   }
+// }
+
+// @include xl {
+//   .PodiumSpot--first .leaderboard-avatar,
+//   .PodiumSpot--second .leaderboard-avatar,
+//   .PodiumSpot--third .leaderboard-avatar {
+//     height: 128px;
+//     width: 128px;
+//   }
+// }

src/shared/components/Leaderboard/avatarStyles.scss

@@ -6,12 +6,6 @@
   width: 100%;
 }
 
-.bronze {
-  @include avatar;
-
-  border-color: #d98f64;
-}
-
 .default {
   @include avatar;
 
@@ -30,9 +24,22 @@
   border-color: #d1d0cf;
 }
 
+.bronze {
+  @include avatar;
+
+  border-color: #d98f64;
+}
+
+.iron {
+  @include avatar;
+
+  border-color: #d98f64;
+}
+
 .tco20-1,
 .tco20-2,
-.tco20-3 {
+.tco20-3,
+.tco20-4 {
   border-radius: 50%;
   height: 100%;
   width: 100%;

src/shared/components/ProfilePage/Stats/index.jsx

@@ -151,9 +151,9 @@ Active Challenges
                       className={subTrackRating ? styles.rating : ''}
                       style={{ color: subTrackRating ? getRatingColor(parseInt(subTrackRating.toString().replace(/\D/g, ''), 10)) : undefined }}
                     >
-                      <Link to={`/members/${info.handle}`}>
+                      <a href={`/members/${info.handle}`} target="_blank" rel="noopener noreferrer">
                         {info.handle || '-'}
-                      </Link>
+                      </a>
                     </div>
                   </li>
                 )

src/shared/components/challenge-detail/Submissions/index.jsx

@@ -179,8 +179,8 @@ class SubmissionsComponent extends React.Component {
         }
         case 'Time':
         case 'Submission Date': {
-          valueA = new Date(a.submissions[0].submissionTime);
-          valueB = new Date(b.submissions[0].submissionTime);
+          valueA = new Date(a.submissions && a.submissions[0].submissionTime);
+          valueB = new Date(b.submissions && b.submissions[0].submissionTime);
           break;
         }
         case 'Initial / Final Score': {

src/shared/components/challenge-listing/Filters/ChallengeFilters.jsx

@@ -9,6 +9,7 @@ import SwitchWithLabel from 'components/SwitchWithLabel';
 import { challenge as challengeUtils } from 'topcoder-react-lib';
 import { COMPETITION_TRACKS as TRACKS } from 'utils/tc';
 
+import localStorage from 'localStorage';
 import ChallengeSearchBar from './ChallengeSearchBar';
 import EditTrackPanel from './EditTrackPanel';
 import FiltersIcon from './FiltersSwitch/filters-icon.svg';
@@ -55,7 +56,9 @@ export default function ChallengeFilters({
 
   const switchTrack = (track, on) => {
     const act = on ? Filter.addTrack : Filter.removeTrack;
-    setFilterState(act(filterState, track));
+    const filterObj = act(filterState, track);
+    localStorage.setItem('trackStatus', JSON.stringify(filterObj));
+    setFilterState(filterObj);
   };
 
   return (

src/shared/containers/challenge-listing/FilterPanel.jsx

@@ -10,6 +10,7 @@ import shortId from 'shortid';
 import FilterPanel from 'components/challenge-listing/Filters/ChallengeFilters';
 import PT from 'prop-types';
 import React from 'react';
+import localStorage from 'localStorage';
 import sidebarActions from 'actions/challenge-listing/sidebar';
 import { BUCKETS, isReviewOpportunitiesBucket } from 'utils/challenge-listing/buckets';
 import { bindActionCreators } from 'redux';
@@ -63,6 +64,12 @@ export class Container extends React.Component {
     const query = qs.parse(window.location.search.slice(1));
     if (query.filter && !filterState.track) {
       setFilterState(query.filter);
+    } else {
+      const trackStatus = localStorage.getItem('trackStatus');
+      const filterObj = trackStatus ? JSON.parse(trackStatus) : null;
+      if (filterObj) {
+        setFilterState(filterObj);
+      }
     }
   }
 

src/shared/containers/challenge-listing/Listing/index.jsx

@@ -69,11 +69,12 @@ export class ListingContainer extends React.Component {
       logger.error('Attempt to mount multiple instances of ChallengeListingPageContainer at the same time!');
     } else mounted = true;
 
-    this.loadChallenges();
+    if (BUCKETS.PAST !== activeBucket) this.loadChallenges();
   }
 
   componentDidUpdate(prevProps) {
     const {
+      activeBucket,
       auth,
       dropChallenges,
       getCommunitiesList,
@@ -98,7 +99,8 @@ export class ListingContainer extends React.Component {
       });
     }
 
-    if (!loadingActiveChallengesUUID && !_.isEmpty(meta) && !allActiveChallengesLoaded) {
+    if (!loadingActiveChallengesUUID && !_.isEmpty(meta) && !allActiveChallengesLoaded
+      && BUCKETS.PAST !== activeBucket) {
       getRestActiveChallenges(auth.tokenV3);
     }
   }

src/shared/containers/tco/Leaderboard/index.jsx

@@ -73,7 +73,7 @@ class LeaderboardPageContainer extends React.Component {
       ? (<LoadingIndicator />) : (
         <div>
           <div styleName="Leaderboard">
-            <h2 styleName="section-title">{title}</h2>
+            {title ? (<h2 styleName="section-title">{title}</h2>) : null}
             <Podium
               competitors={ld.slice(0, podiumSpots)}
               isCopilot={isCopilot}

src/shared/containers/tco/Leaderboard/themes/styles.scss

@@ -2,7 +2,7 @@
 
 .Leaderboard {
   padding: 0 15px;
-  margin: 20px auto;
+  margin: 50px auto;
   max-width: $screen-md;
 }