Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
3710 stevensc 1 
/* eslint-disable react/prop-types */
2981 stevensc 2 
import React, { useEffect, useRef } from 'react';
1748 stevensc 3 
import MessageBox from './MessageBox';
4 
import MessageTemplate from './MessageTemplate';
1 www 5 
 
3074 stevensc 6 
const Chatmail = ({
1748 stevensc 7 
    messages,
4346 stevensc 8 
    selectedConversation = null,
1748 stevensc 9 
    onSend,
10 
    backendVars,
11 
    getMoreMessages,
1741 stevensc 12 
    handleShowConversation,
3044 stevensc 13 
    setMsgs
1741 stevensc 14 
}) => {
835 stevensc 15 
 
1750 stevensc 16 
    const lastMessage = useRef(null);
765 stevensc 17 
 
853 stevensc 18 
    useEffect(() => {
917 stevensc 19 
        const observer = new IntersectionObserver(([entry]) => {
20 
            if (entry.isIntersecting) {
21 
                getMoreMessages()
22 
            }
23 
        })
24 
 
879 stevensc 25 
        if (lastMessage.current) {
915 stevensc 26 
            observer.observe(lastMessage.current)
876 stevensc 27 
        }
1752 stevensc 28 
    }, [messages]);
876 stevensc 29 
 
747 stevensc 30 
    return (
4346 stevensc 31 
        <div className='chat'>
32 
            <div className='w-100 icon-hide'>
33 
                <span className='d-flex align-items-center mr-2 cursor-pointer' onClick={() => handleShowConversation(false)}>
34 
                    <i className="fas fa-angle-left mr-2" />
35 
                    Volver
36 
                </span>
2747 stevensc 37 
            </div>
4346 stevensc 38 
            <a href={selectedConversation.profile}>
39 
                <h2 className='chat-header'>
40 
                    {selectedConversation.name}
41 
                </h2>
42 
            </a>
43 
            <div className="messages-line">
44 
                {messages.length
45 
                    ? messages.map((element, index) => {
46 
                        return (
47 
                            <MessageTemplate
48 
                                key={index}
49 
                                message={element}
50 
                                date={element.date}
51 
                            />
52 
                        )
53 
                    })
54 
                    :
55 
                    <div className='message-select-conversation'>
56 
                        <div className='msgs-select-container'>
57 
                            <i className='fas fa-inbox icon' />
58 
                            <h3>No hay mensajes en esta conversación</h3>
59 
                        </div>
2748 stevensc 60 
                    </div>
4346 stevensc 61 
                }
62 
                <hr ref={lastMessage} style={{ visibility: 'hidden' }} />
2747 stevensc 63 
            </div>
4346 stevensc 64 
            <MessageBox
65 
                setMsgs={setMsgs}
66 
                onSend={onSend}
67 
                backendVars={backendVars}
68 
                sendLink={selectedConversation.send_link}
69 
            />
70 
        </div >
1 www 71 
    )
3074 stevensc 72 
}
73 
 
74 
export default Chatmail