Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
1748 stevensc 1 
import React, { useEffect, useRef } from 'react';
2 
import MessageBarHead from './MessageBarHead';
3 
import MessageBox from './MessageBox';
4 
import MessageTemplate from './MessageTemplate';
1 www 5 
 
1748 stevensc 6 
function areEqual(prevProps, nextProps) {
7 
    return prevProps.messages === nextProps.messages
8 
}
9 
 
10 
const ChatList = ({
11 
    messages,
12 
    selectedConversation,
13 
    onSend,
14 
    backendVars,
15 
    getMoreMessages,
1741 stevensc 16 
    handleShowConversation,
17 
    loading
18 
}) => {
835 stevensc 19 
 
913 stevensc 20 
    const messagesLine = useRef(null);
765 stevensc 21 
 
853 stevensc 22 
    useEffect(() => {
917 stevensc 23 
        const observer = new IntersectionObserver(([entry]) => {
24 
            if (entry.isIntersecting) {
25 
                getMoreMessages()
26 
            }
27 
        })
28 
 
879 stevensc 29 
        if (lastMessage.current) {
915 stevensc 30 
            observer.observe(lastMessage.current)
876 stevensc 31 
        }
1748 stevensc 32 
    }, []);
876 stevensc 33 
 
747 stevensc 34 
    return (
1748 stevensc 35 
        <div className="main-conversation-box">
36 
            {
37 
                !selectedConversation
38 
                    ?
39 
                    <div className='message-select-conversation'>
40 
                        <div className='msgs-select-container'>
41 
                            <i className='fas fa-inbox icon' />
42 
                            <h3>
43 
                                Selecciona una conversación
44 
                            </h3>
811 stevensc 45 
                        </div>
1748 stevensc 46 
                    </div>
47 
                    :
48 
                    <>
49 
                        <MessageBarHead
50 
                            selectedConversation={selectedConversation}
51 
                            handleShowConversation={handleShowConversation}
52 
                        />
53 
                        <div className="messages-line" ref={messagesLine}>
1734 stevensc 54 
 
1748 stevensc 55 
                            {
56 
                                messages.length
57 
                                    ?
58 
                                    messages.map((element, i) =>
59 
                                        <MessageTemplate
60 
                                            key={i}
61 
                                            message={element}
1 www 62 
                                        />
1748 stevensc 63 
                                    )
64 
                                    :
65 
                                    <div className='message-select-conversation'>
66 
                                        <div className='msgs-select-container'>
67 
                                            <i className='fas fa-inbox icon' />
68 
                                            <h3>No hay mensajes en esta conversación</h3>
69 
                                        </div>
1 www 70 
                                    </div>
1748 stevensc 71 
                            }
72 
                            <hr ref={lastMessage} />
73 
                        </div>
74 
                        <MessageBox
75 
                            onSend={onSend}
76 
                            backendVars={backendVars}
77 
                        />
78 
                    </>
79 
            }
80 
        </div>
1 www 81 
    )
1748 stevensc 82 
}
83 
 
84 
export default React.memo(ChatList, areEqual)