frontend/src/components/RandomTopic.js

40 lines
No EOL
957 B
JavaScript

import Grid from 'react-css-grid'
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}/>
<Grid
width={450}
gap={16}>
{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} ({this.props.topicCount})
</Link>
</Grid>
</section>
)
}
}
RandomTopic.propTypes = {
topicName: PropTypes.string,
videos: PropTypes.array,
loading: PropTypes.bool,
topicCount: PropTypes.number
};
export default (RandomTopic);