skrd/musiclist-client
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

EntityList lee una lista que tiene items

Browse Source 
esto es para agregar mas metadata, como por ejemplo, poner headers y
esas cosas
This commit is contained in:
Daniel Cortes
2020-06-16 22:25:07 -04:00
parent d1ddc5d1ff
commit f08c108eee
5 changed files with 57 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
src/components/EntityList.jsx
View File

@@ -4,42 +4,43 @@ import "./EntityList.scss"
const EntityPlaceholder = (props) => {
return (
<li className={'entity-item ' + (props.cover ? '' : 'pulsating')}>
<div class="entity-container">
<Link to={props.link}>
{props.cover && <div className='cover pulsating'/>}
<div className='body'>
<span class='title'>&nbsp;</span>
<span className='subtitle'>&nbsp;</span>
</div>
</Link>
</div>
</li>
<li className={'entity-item ' + (props.cover ? '' : 'pulsating')}>
<div class="entity-container">
<Link to={props.link}>
{props.cover && <div className='cover pulsating'/>}
<div className='body'>
<span class='title'>&nbsp;</span>
<span className='subtitle'>&nbsp;</span>
</div>
</Link>
</div>
</li>
)
}
const EntityItem = (props) => {
const item = props.item;
return (
<li className={'entity-item ' + (props.selected ? 'selected' : '')} id={props.id}>
<div class="entity-container">
<Link to={props.link}>
{props.cover &&
<div className='cover'>
{props.cover}
</div>
}
<div className='body'>
<span class='title'>{props.title}</span>
<span className='subtitle'>{props.subtitle}</span>
</div>
</Link>
{ props.widget &&
<div class="widget">
<button class='button'>Agregar a mi lista</button>
<li className={'entity-item ' + (item.selected ? 'selected' : '')} id={item.id}>
<div class="entity-container">
<Link to={item.link}>
{item.cover &&
<div className='cover'>
{item.cover}
</div>
}
</div>
</li>
<div className='body'>
<span class='title'>{item.title}</span>
<span className='subtitle'>{item.subtitle}</span>
</div>
</Link>
{ item.widget &&
<div class="widget">
<button class='button'>Agregar a mi lista</button>
</div>
}
</div>
</li>
)
}
@@ -52,10 +53,8 @@ export const EntityList = (props) => {
entities.push(<EntityPlaceholder key={i} cover={props.cover}/>)
}
}else{
entities = props.items.map(item => <EntityItem id={item.id} cover={item.cover} link={item.link}
title={item.title} subtitle={item.subtitle}
selected={item.selected} widget={item.widget}/>);
}
entities = props.list.items.map(item => <EntityItem item={item}/>);
}
const className = props.grid ? "grid" : "column";
return (