Merge pull request #482 from unitaryfund/217_submission_tag_list

#217: Submission tag lists (front-end)

Author: WrathfulSpatula

src/components/SubmissionBox.js

@@ -18,9 +18,12 @@ class SubmissionBox extends React.Component {
     this.state = {
       upvotes: props.item.upvotesCount || 0,
       isUpvoted: props.item.isUpvoted,
+      tags: props.item.tags.map((obj, ind) => obj.name),
       description: !this.props.item.description ? '' : ((this.props.item.description.length > 500) ? (this.props.item.description.substring(0, 497) + '...') : this.props.item.description)
     }
 
+    console.log(this.state.tags)
+
     this.handleUpVoteOnClick = this.handleUpVoteOnClick.bind(this)
     this.handleDeleteOnClick = this.handleDeleteOnClick.bind(this)
     this.handleExternalLinkClick = this.handleExternalLinkClick.bind(this)
@@ -89,6 +92,10 @@ class SubmissionBox extends React.Component {
               <div className='submission-description'>
                 {this.state.description ? this.state.description.replace(/\0.*$/g, '').split('. ')[0] + '.' : <i>(No description provided.)</i>}
               </div>
+              {this.state.tags.length > 0 &&
+                <div className='submission-description'>
+                  <b>Tags: </b>{this.state.tags.map((obj, ind) => <span key={obj}>{ind > 0 && <span> • </span>}<Link to={'/Tag/' + obj}><span className='link'>{obj}</span></Link></span>)}
+                </div>}
             </div>
             <div className='col-md-2 col-sm-12 h-100' />
           </div>

src/views/Home.js

@@ -8,13 +8,13 @@ const Home = (props) => {
       <br />
       <Tabs defaultActiveKey='trending' id='top-submissions-tabs'>
         <Tab eventKey='trending' title='Trending' className='metriq-nav-tab'>
-          <SubmissionScroll sortType='trending' isLoggedIn={props.isLoggedIn} tag={props.match ? props.match.params.tag : ''} />
+          <SubmissionScroll sortType='trending' isLoggedIn={props.isLoggedIn} tag={props.match ? props.match.params.tag : ''} key={Math.random()} />
         </Tab>
         <Tab eventKey='popular' title='Popular'>
-          <SubmissionScroll sortType='popular' isLoggedIn={props.isLoggedIn} tag={props.match ? props.match.params.tag : ''} />
+          <SubmissionScroll sortType='popular' isLoggedIn={props.isLoggedIn} tag={props.match ? props.match.params.tag : ''} key={Math.random()} />
         </Tab>
         <Tab eventKey='latest' title='Latest'>
-          <SubmissionScroll sortType='latest' isLoggedIn={props.isLoggedIn} tag={props.match ? props.match.params.tag : ''} />
+          <SubmissionScroll sortType='latest' isLoggedIn={props.isLoggedIn} tag={props.match ? props.match.params.tag : ''} key={Math.random()} />
         </Tab>
       </Tabs>
     </div>