add random topic items count to state

src/components/RandomTopic.js

@@ -3,23 +3,27 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import VideoItem from "./VideoItem";
 import SectionHeading from "./SectionHeading";
+import {Link} from 'react-router-dom';
 
 class RandomTopic extends React.Component {
 
   render() {
     return (
       <section>
-        <SectionHeading title={ this.props.topicName } />
+        <SectionHeading title={this.props.topicName}/>
         <Grid
           width={450}
           gap={16}>
-          { this.props.videos.map(video => 
-            <VideoItem id={ video.id } title={ video.title } />
+          {this.props.videos.map(video =>
+            <VideoItem id={video.id} title={video.title}/>
           )}
-
+          <Link to="/topics">
+            See All Topics
+          </Link>
+          <Link to="/topics">
+            See All videos of {this.props.topicName} ()
+          </Link>
         </Grid>
-        <a href="/topics">See All videos</a>
-
       </section>
 
     )

src/containers/Home.js

@@ -18,7 +18,6 @@ class Home extends React.Component {
   }
 
   componentWillReceiveProps(nextProps) {
-    console.log('nextProps', nextProps);
     // This is slightly awkward - we need to check that we have all topics,
     // But don't have a random topic yet (or at not already loading a random topic)
     if ((this.props.allTopics || nextProps.allTopics) && !this.props.loadingRandomTopic && !nextProps.loadingRandomTopic && !this.props.randomTopic) {
@@ -31,6 +30,7 @@ class Home extends React.Component {
       <div>
         <RandomTopic
           topicName={ this.props.randomTopic || ''}
+          topicCount={ this.props.randomTopicCount }
           videos = { this.props.randomTopicVideos || [] }
           loading = { this.props.loadingAllTopics || this.props.loadingRandomTopic }
         />
@@ -45,6 +45,7 @@ const mapStateToProps = state => ({
   allTopics: state.topics.allTopics,
   loadingAllTopics: state.topics.loadingAllTopics,
   randomTopic: state.topics.randomTopic,
+  randomTopicCount: static.topics.randomTopicCount,
   loadingRandomTopic: state.topics.loadingRandomTopic,
   randomTopicVideos: state.topics.randomTopicVideos
 });

src/reducers/topics.js

@@ -25,7 +25,8 @@ export default function(state={}, action) {
     case LOADED_RANDOM_TOPIC:
       return Object.assign({}, state, {
         loadingRandomTopic: false,
-        randomTopic: action.payload.topic,
+        randomTopic: action.payload.topic.name,
+        randomTopicCount: action.payload.topic.items,
         randomTopicVideos: action.payload.videos
       });
 

src/utils/get-random-topic.js

@@ -1,6 +1,5 @@
 
 export default function getRandomTopic(allTopics, minVideos=4) {
   const validTopics = allTopics.filter(topic => topic.items >= minVideos);
-  console.log('valid topics', validTopics);
-  return validTopics[Math.floor(Math.random() * validTopics.length)].name;
+  return validTopics[Math.floor(Math.random() * validTopics.length)];
 }