2016-10-16 12:37:37 +13:00
|
|
|
|
|
|
|
|
import React, { PropTypes } from 'react'
|
2016-10-25 21:36:33 +13:00
|
|
|
import Thumbnail from './Thumbnail'
|
2017-10-27 10:51:48 +13:00
|
|
|
import URILink from './URILink'
|
2016-10-16 12:37:37 +13:00
|
|
|
|
2017-03-13 21:19:09 +13:00
|
|
|
export default class RelatedArtists extends React.Component{
|
2016-10-16 12:37:37 +13:00
|
|
|
|
2017-10-10 13:05:28 +13:00
|
|
|
constructor(props){
|
2016-11-21 16:54:17 +13:00
|
|
|
super(props)
|
2016-10-16 12:37:37 +13:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
render(){
|
2017-10-10 13:05:28 +13:00
|
|
|
if (!this.props.artists ) return null
|
2016-11-08 13:36:13 +13:00
|
|
|
|
2016-10-16 12:37:37 +13:00
|
|
|
return (
|
2018-11-09 16:45:57 +13:00
|
|
|
<div className="related-artists">
|
2016-10-16 12:37:37 +13:00
|
|
|
{
|
2017-10-10 13:05:28 +13:00
|
|
|
this.props.artists.map((artist, index) => {
|
2018-10-29 16:24:04 +13:00
|
|
|
|
|
|
|
|
var images = artist.images;
|
|
|
|
|
if (Array.isArray(images)){
|
|
|
|
|
images = images[0];
|
|
|
|
|
}
|
|
|
|
|
|
2017-10-10 13:05:28 +13:00
|
|
|
if (artist.uri){
|
2016-12-05 10:20:01 +13:00
|
|
|
return (
|
2018-11-09 16:45:57 +13:00
|
|
|
<URILink type="artist" uri={artist.uri} key={artist.uri} className="related-artists__item related-artists__item--link">
|
|
|
|
|
<Thumbnail className="related-artists__item__thumbnail" circle={true} size="small" images={images} />
|
|
|
|
|
<span className="related-artists__item__name">{ artist.name }</span>
|
2017-10-27 10:51:48 +13:00
|
|
|
</URILink>
|
2016-12-05 10:20:01 +13:00
|
|
|
)
|
2017-10-10 13:32:04 +13:00
|
|
|
} else {
|
2016-12-05 10:20:01 +13:00
|
|
|
return (
|
2018-11-09 16:45:57 +13:00
|
|
|
<span key={artist.uri} className="related-artists__item">
|
|
|
|
|
<Thumbnail className="related-artists__item__thumbnail" circle={true} size="small" images={images} />
|
|
|
|
|
<span className="related-artists__item__name">{ artist.name }</span>
|
2016-12-05 10:20:01 +13:00
|
|
|
</span>
|
|
|
|
|
)
|
|
|
|
|
}
|
2016-10-16 12:37:37 +13:00
|
|
|
})
|
|
|
|
|
}
|
2016-11-04 15:55:17 +13:00
|
|
|
</div>
|
2016-10-16 12:37:37 +13:00
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|