Rev 4349 | Rev 4355 | 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 Sidebar = ({
conversations = [],
selectedConversation = null,
click = function () { },
handleShowConversation = function () { }
}) => {
const handleConversation = (element) => {
handleShowConversation(true);
click(element)
}
if (!conversations.length) {
return <EmptySection message='Sin conversaciones' />
}
return (
<ul className='messages-list'>
{conversations.map((element, i) => {
return (
<li key={i} onClick={() => handleConversation(element)}>
<div className={`usr-msg-details ${selectedConversation?.name === element.name && 'is_selected'}`}>
<div className="usr-ms-img">
<img src={element.image} alt={element.name} />
</div>
<div className="usr-mg-info">
<h3>{element.name}</h3>
{Number(element.count_unread) > 0 &&
<p className="text-gray">
{element.count_unread} mensajes nuevos | <span> {element.last_message} </span>
</p>
}
</div>
</div>
</li>
)
})}
</ul>
)
}
export default Sidebar