Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
/* eslint-disable react/prop-types */
import React from 'react'
import EmptySection from '../../../shared/empty-section/EmptySection'
const ContactsList = ({
conversations = [],
selectedConversation,
onClick,
}) => {
if (!conversations.length) {
return <EmptySection message="Sin conversaciones" />
}
return (
<ul className="messages-list">
{conversations.map((element, i) => (
<li key={i} onClick={() => onClick(element)}>
<ContactsList.Item
isSelected={element.name === selectedConversation.name}
{...element}
/>
</li>
))}
</ul>
)
}
const Item = ({ image, name, profile, isSelected }) => {
return (
<div className={`usr-msg-details ${isSelected && 'is_selected'}`}>
<div className="usr-ms-img">
{image ? (
<a href={profile} target="_blank" rel="noreferrer">
<img src={image} alt={name} />
</a>
) : (
<img
className="chat-image img-circle pull-left"
height="36"
width="36"
src="/images/users-group.png"
alt="image-image"
/>
)}
</div>
<div className="usr-mg-info">
<h3>{name}</h3>
</div>
</div>
)
}
ContactsList.Item = Item
export default ContactsList