Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 3770 | Rev 4349 | 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'

const Sidebar = ({ conversations = [], click, selectedConversation, handleShowConversation }) => {

    const handleConversation = (element) => {
        handleShowConversation(true);
        click(element)
    }

    return (
        <div style={{ overflowY: 'scroll' }} > F
            <ul>
                {conversations
                    ? conversations.reverse().map((element, i) => {
                        <li key={i}
                            className='d-flex align-items-center'
                            style={{ padding: '.7rem' }}
                            onClick={() => handleConversation(element)}
                        >
                            <div className={`${selectedConversation?.name === element.name ? 'is_selected' : ''} usr-msg-details d-flex justify-content-start align-items-center`}>
                                <div className="usr-ms-img">
                                    <img src={element.image} alt={element.name} />
                                </div>
                                <div className="usr-mg-info">
                                    <h3>{element.name}</h3>
                                    {parseInt(element.count_unread) > 0 &&
                                        <p className="text-gray">
                                            {element.count_unread} mensajes nuevos | <span> {element.last_message} </span>
                                        </p>
                                    }
                                </div>
                            </div>
                        </li>
                    })
                    :
                    <li className="active">
                        <div className="usr-msg-details">
                            <div className="usr-mg-info">
                                <h3>Sin conversaciones</h3>
                            </div>
                        </div>
                    </li>
                }
            </ul>
        </div >
    )
}

export default Sidebar