Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 842 | Rev 845 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
821 stevensc 1
import React, { useState } from 'react'
1 www 2
 
843 stevensc 3
export default ({ conversations = [], click, selectedConversation, searchActive, showConversation, setShowConversations }) => {
821 stevensc 4
 
5
    const [conversationSearch, setConversationSearch] = useState('');
6
    const filtredConversations = conversations.filter((conversation) => conversation.name.includes(conversationSearch))
841 stevensc 7
 
8
    const handleConversation = (element) => {
843 stevensc 9
        setShowConversations(true);
842 stevensc 10
        click(element)
841 stevensc 11
    }
821 stevensc 12
    return (
1 www 13
        <div className="messages-list">
822 stevensc 14
            <div className={`messages_conversation-search ${!searchActive && 'hide'}`}>
15
                <input
16
                    type="search"
17
                    className='form-control'
831 stevensc 18
                    placeholder='Buscar conversación'
822 stevensc 19
                    onChange={(e) => setConversationSearch(e.target.value)}
20
                />
21
            </div>
837 stevensc 22
            <ul className={`${showConversation && 'msgs-hide'}`}>
1 www 23
                {
825 stevensc 24
                    (conversations)
821 stevensc 25
                        ?
825 stevensc 26
                        filtredConversations.map((element, i) => {
821 stevensc 27
                            return (
1 www 28
                                <li
29
                                    id={i}
167 steven 30
                                    className={(selectedConversation === element ? "active" : '') + 'd-flex align-items-center'}
31
                                    style={{
32
                                        padding: '.7rem'
33
                                    }}
835 stevensc 34
                                    onClick={() => {
841 stevensc 35
                                        handleConversation(element);
835 stevensc 36
                                    }}
1 www 37
                                >
38
                                    <div className="usr-msg-details">
39
                                        <div className="usr-ms-img">
40
                                            <img src={element.image} alt={element.name} />
41
                                        </div>
42
                                        <div className="usr-mg-info">
43
                                            <h3>{element.name}</h3>
44
                                        </div>
45
                                        <span className="posted_time"> {element.last_message} </span>
46
                                        {
821 stevensc 47
                                            !!element.count_unread && parseInt(element.count_unread) > 0 && (
1 www 48
                                                <span className="msg-notifc">
49
                                                    {element.count_unread}
50
                                                </span>
51
                                            )
52
                                        }
53
                                    </div>
54
                                </li>
55
                            )
56
                        })
821 stevensc 57
                        :
58
                        <li className="active">
59
                            <div className="usr-msg-details">
60
                                <div className="usr-mg-info">
61
                                    <h3>Sin conversaciones</h3>
62
                                </div>
1 www 63
                            </div>
821 stevensc 64
                        </li>
1 www 65
 
66
                }
67
            </ul>
68
        </div>
69
    )
70
}