Self Service Green Tag

Author: marioskranitsas

src/shared/components/challenge-detail/Header/ChallengeTags.jsx

@@ -31,6 +31,7 @@ import './style.scss';
 
 export default function ChallengeTags(props) {
   const {
+    isSelfService,
     challengeId,
     challengesUrl,
     track,
@@ -112,6 +113,13 @@ export default function ChallengeTags(props) {
           />
         ))
       }
+      {
+        isSelfService && (
+          <DevelopmentTrackTag>
+            <span>Customer Self-Service</span>
+          </DevelopmentTrackTag>
+        )
+      }
       {
         tags.map(tag => (
           tag
@@ -135,9 +143,11 @@ export default function ChallengeTags(props) {
 ChallengeTags.defaultProps = {
   events: [],
   technPlatforms: [],
+  isSelfService: false,
 };
 
 ChallengeTags.propTypes = {
+  isSelfService: PT.bool,
   challengeId: PT.string.isRequired,
   challengesUrl: PT.string.isRequired,
   track: PT.string.isRequired,

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

@@ -264,6 +264,7 @@ export default function ChallengeHeader(props) {
             </h1>
             <div styleName="tag-container">
               <ChallengeTags
+                isSelfService={challenge.legacy.selfService}
                 challengeId={challengeId}
                 track={track}
                 challengeType={_.find(challengeTypesMap, { name: type }) || {}}

src/shared/components/challenge-listing/ChallengeCard/index.jsx

@@ -2,6 +2,7 @@ import _ from 'lodash';
 import React from 'react';
 import PT from 'prop-types';
 import TrackIcon from 'components/TrackIcon';
+import { DevelopmentTrackTag } from 'topcoder-react-ui-kit';
 import { TABS as DETAIL_TABS } from 'actions/page/challenge-details';
 import { Link } from 'topcoder-react-utils';
 import {
@@ -102,6 +103,13 @@ function ChallengeCard({
                 />
                 )
             }
+            {
+              challenge.legacy.selfService && (
+                <DevelopmentTrackTag>
+                  <span>Customer Self-Service</span>
+                </DevelopmentTrackTag>
+              )
+            }
             { !isRecommendedChallenge
               && challenge.tags.length > 0
               && (