secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Part 2 of functional component upgrade

Browse Source
This commit is contained in:
James Barnsley
2019-04-11 08:05:53 +12:00
parent 014da60b76
commit 413d93a181
14 changed files with 962 additions and 1379 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
src/js/components/RelatedArtists.js
View File

@ -1,45 +1,40 @@
import React from 'react'
import React, { memo } from 'react'
import Thumbnail from './Thumbnail'
import URILink from './URILink'
export default class RelatedArtists extends React.Component{
constructor(props){
super(props)
export default memo((props) => {
if (!props.artists){
return null;
}
render(){
if (!this.props.artists ) return null
return (
<div className="related-artists">
{
props.artists.map((artist, index) => {
return (
<div className="related-artists">
{
this.props.artists.map((artist, index) => {
var images = artist.images;
if (Array.isArray(images)){
images = images[0];
}
var images = artist.images;
if (Array.isArray(images)){
images = images[0];
}
if (artist.uri){
return (
<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>
</URILink>
)
} else {
return (
<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>
</span>
)
}
})
}
</div>
);
}
}
if (artist.uri){
return (
<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>
</URILink>
)
} else {
return (
<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>
</span>
)
}
})
}
</div>
);
});