Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 2545 | Rev 2547 | 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
 
2539 stevensc 3
export default ({ conversations = [], click, selectedConversation, showConversation, handleShowConversation }) => {
821 stevensc 4
 
5
    const [conversationSearch, setConversationSearch] = useState('');
6
    const filtredConversations = conversations.filter((conversation) => conversation.name.includes(conversationSearch))
2539 stevensc 7
 
841 stevensc 8
    const handleConversation = (element) => {
845 stevensc 9
        handleShowConversation(true);
842 stevensc 10
        click(element)
841 stevensc 11
    }
2539 stevensc 12
 
13
    const getLastMessage = () => {
14
 
15
 
2544 stevensc 16
        let nullTimeOptions = []
17
        let nowTimeOptions = []
18
        let secondsTimeOptions = [].sort((a, b) => a.last_message.split(' ')[0] - b.last_message.split(' ')[0])
19
        let minutesTimeOptions = [].sort((a, b) => a.last_message.split(' ')[0] - b.last_message.split(' ')[0])
20
        let dayTimeOptions = [].sort((a, b) => a.last_message.split(' ')[0] - b.last_message.split(' ')[0])
21
        let weekTimeOptions = [].sort((a, b) => a.last_message.split(' ')[0] - b.last_message.split(' ')[0])
22
        let monthTimeOptions = [].sort((a, b) => a.last_message.split(' ')[0] - b.last_message.split(' ')[0])
23
        let yearTimeOptions = [].sort((a, b) => a.last_message.split(' ')[0] - b.last_message.split(' ')[0])
2539 stevensc 24
 
2546 stevensc 25
        filtredConversations.forEach(option => {
26
            if (parseInt(option.count_unread)) {
2544 stevensc 27
                if (option.last_message === 'Ahora') {
28
                    return nowTimeOptions.push(option)
29
                }
30
            }
2539 stevensc 31
 
2544 stevensc 32
            return nullTimeOptions.push(option)
33
        })
34
 
35
 
2539 stevensc 36
        return [
37
            ...nowTimeOptions,
2542 stevensc 38
            ...secondsTimeOptions,
39
            ...minutesTimeOptions,
40
            ...dayTimeOptions,
41
            ...weekTimeOptions,
42
            ...monthTimeOptions,
43
            ...yearTimeOptions,
2539 stevensc 44
            ...nullTimeOptions
45
        ]
46
    }
47
 
821 stevensc 48
    return (
2539 stevensc 49
        <div className="">
1870 steven 50
            {/*  messages-list */}
51
            {/* <div className={`messages_conversation-search ${!searchActive && 'hide'}`}>
822 stevensc 52
                <input
53
                    type="search"
54
                    className='form-control'
831 stevensc 55
                    placeholder='Buscar conversación'
822 stevensc 56
                    onChange={(e) => setConversationSearch(e.target.value)}
57
                />
1870 steven 58
            </div> */}
837 stevensc 59
            <ul className={`${showConversation && 'msgs-hide'}`}>
1 www 60
                {
825 stevensc 61
                    (conversations)
821 stevensc 62
                        ?
2539 stevensc 63
                        getLastMessage().map((element, i) => {
821 stevensc 64
                            return (
1 www 65
                                <li
66
                                    id={i}
167 steven 67
                                    className={(selectedConversation === element ? "active" : '') + 'd-flex align-items-center'}
68
                                    style={{
69
                                        padding: '.7rem'
70
                                    }}
835 stevensc 71
                                    onClick={() => {
841 stevensc 72
                                        handleConversation(element);
835 stevensc 73
                                    }}
1 www 74
                                >
1871 steven 75
                                    <div className="usr-msg-details d-flex justify-content-start align-items-center">
1 www 76
                                        <div className="usr-ms-img">
77
                                            <img src={element.image} alt={element.name} />
78
                                        </div>
79
                                        <div className="usr-mg-info">
80
                                            <h3>{element.name}</h3>
1873 steven 81
                                            {
82
                                                !!element.count_unread && parseInt(element.count_unread) > 0 && (
1874 steven 83
                                                    <p className="text-gray"> {element.count_unread} mensajes nuevos | <span> {element.last_message} </span></p>
1873 steven 84
                                                )
85
                                            }
1 www 86
                                        </div>
1872 steven 87
                                        {/* {
821 stevensc 88
                                            !!element.count_unread && parseInt(element.count_unread) > 0 && (
1 www 89
                                                <span className="msg-notifc">
90
                                                    {element.count_unread}
91
                                                </span>
92
                                            )
1872 steven 93
                                        } */}
1 www 94
                                    </div>
95
                                </li>
96
                            )
97
                        })
821 stevensc 98
                        :
99
                        <li className="active">
100
                            <div className="usr-msg-details">
101
                                <div className="usr-mg-info">
102
                                    <h3>Sin conversaciones</h3>
103
                                </div>
1 www 104
                            </div>
821 stevensc 105
                        </li>
1 www 106
 
107
                }
108
            </ul>
109
        </div>
110
    )
111
}