Release of Learn page in Blockchain community + a few misc fixes

Author: birdofpreyru

src/server/tc-communities/blockchain/metadata.json

@@ -24,6 +24,9 @@
   "menuItems": [{
     "title": "Home",
     "url": "/"
+  }, {
+    "title": "Learn",
+    "url": "/learn"
   }, {
     "title": "Challenges",
     "url": "/challenges"

src/shared/components/LeaderboardAvatar/index.jsx

@@ -4,7 +4,7 @@ import Avatar from 'components/Avatar';
 import config from 'utils/config';
 import React, { Component } from 'react';
 import PT from 'prop-types';
-import { Link } from 'react-router-dom';
+import { Link } from 'utils/router';
 import './style.scss';
 
 /* TODO: Should be functional component! */

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

@@ -29,7 +29,7 @@ export default function Winners(props) {
   return (
     <div styleName="container">
       {
-        winners && winners.filter(w => w.type === 'final').map((w) => {
+        winners && winners.filter(w => !w.type || w.type === 'final').map((w) => {
           let placeStyle;
           if (winners.length === 2 && w.placement === 2) {
             placeStyle = 'place-2-alt';

src/shared/components/tc-communities/communities/blockchain/Learn/LearnTheBasics/index.jsx

@@ -1,13 +1,16 @@
 import Accordion from 'components/tc-communities/Accordion/Accordion';
 import AccordionItem from 'components/tc-communities/Accordion/AccordionItem';
 import JoinCommunity from 'containers/tc-communities/JoinCommunity';
+import PT from 'prop-types';
 import React from 'react';
 import Section from 'components/tc-communities/Section';
 import Text from 'components/tc-communities/Text';
 
+import { Link } from 'react-router-dom';
+
 import style from './style.scss';
 
-export default function LearnTheBasics() {
+export default function LearnTheBasics({ baseUrl }) {
   return (
     <Section
       title="Learn The Basics"
@@ -37,8 +40,9 @@ export default function LearnTheBasics() {
           <Text>
             <p>
               If you are new to Topcoder, you can register through the
-              Blockchain Community by clicking the Join Now button on the
-              homepage. For more information on getting started with Topcoder,
+              Blockchain Community by clicking the Join Now button on
+              &zwnj;<Link to={baseUrl}>the homepage</Link>.
+              For more information on getting started with Topcoder,
               visit
               &zwnj;<a
                 href="https://www.topcoder.com/getting-started/"
@@ -69,7 +73,7 @@ export default function LearnTheBasics() {
             <p>
               Win prize money when you deliver the best solution to a challenge.
               You could also earn more as a copilot or reviewer or even win a
-              large cash prize in our yearly tournament, Topcoder Open.
+              large cash prize in our yearly tournament, the Topcoder Open.
             </p>
             <a
               className={style.joinnow}
@@ -100,3 +104,7 @@ export default function LearnTheBasics() {
     </Section>
   );
 }
+
+LearnTheBasics.propTypes = {
+  baseUrl: PT.string.isRequired,
+};

src/shared/components/tc-communities/communities/blockchain/Learn/index.jsx

@@ -20,6 +20,7 @@ import LearnTheBasics from './LearnTheBasics';
 import style from './style.scss';
 
 export default function Learn({
+  baseUrl,
   consenSysRss,
 }) {
   return (
@@ -34,7 +35,7 @@ export default function Learn({
         }}
         imageSrc="/community-app-assets/themes/blockchain/learn/banner.jpg"
       />
-      <LearnTheBasics />
+      <LearnTheBasics baseUrl={baseUrl} />
       <Section
         title="Learn More About Ethereum and Blockchain"
         theme={{
@@ -177,6 +178,7 @@ export default function Learn({
           container: style.resourcesContainer,
         }}
       >
+        {/*
         <LinksCard
           title="From Topcoder Blog"
           links={[]}
@@ -185,8 +187,12 @@ export default function Learn({
           title="Bits on Blocks"
           links={[]}
         />
+        */}
         <LinksCard
           title="Useful Information"
+          theme={{
+            container: style.linksCardContainer,
+          }}
           links={[{
             openNewTab: true,
             title: 'reddit - Ethereum • r/ethereum',
@@ -233,5 +239,6 @@ Learn.defaultProps = {
 };
 
 Learn.propTypes = {
+  baseUrl: PT.string.isRequired,
   consenSysRss: PT.shape(),
 };

src/shared/components/tc-communities/communities/blockchain/Learn/style.scss

@@ -89,6 +89,10 @@
   }
 }
 
+.linksCardContainer {
+  width: 100%;
+}
+
 .linksList {
   @include body-text;
 

src/shared/containers/tc-communities/blockchain/Learn.jsx

@@ -34,10 +34,12 @@ class LearnPageContainer extends React.Component {
 
   render() {
     const {
+      baseUrl,
       consenSysRss,
     } = this.props;
     return (
       <LearnPage
+        baseUrl={baseUrl}
         consenSysRss={consenSysRss}
       />
     );
@@ -49,6 +51,7 @@ LearnPageContainer.defaultProps = {
 };
 
 LearnPageContainer.propTypes = {
+  baseUrl: PT.string.isRequired,
   consenSysRss: PT.shape({
     data: PT.object,
     loadingUuid: PT.string.isRequired,
@@ -57,8 +60,9 @@ LearnPageContainer.propTypes = {
   loadConsenSysRss: PT.func.isRequired,
 };
 
-function mapStateToProps(state) {
+function mapStateToProps(state, ownProps) {
   return {
+    baseUrl: ownProps.baseUrl,
     consenSysRss: state.rss.ConsenSys,
   };
 }

src/shared/routes/Communities/Blockchain/Routes.jsx

@@ -50,7 +50,7 @@ export default function Routes({ base, member, meta }) {
               path={`${base}/leaderboard`}
             />
             <Route
-              component={Learn}
+              component={() => <Learn baseUrl={base} />}
               exact
               path={`${base}/learn`}
             />