Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 4374 | Rev 4376 | 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';
4374 stevensc 3 
import EmptySection from '../../shared/empty-section/EmptySection';
4 
import Spinner from '../../shared/loading-spinner/Spinner';
1748 stevensc 5 
import MessageBox from './MessageBox';
6 
import MessageTemplate from './MessageTemplate';
1 www 7 
 
3074 stevensc 8 
const Chatmail = ({
4346 stevensc 9 
    selectedConversation = null,
4374 stevensc 10 
    messages = [],
11 
    backendVars = {},
12 
    loading = false,
13 
    setConversation = () => { },
14 
    getMoreMessages = () => { },
15 
    onSend = () => { },
16 
    setMsgs = () => { },
1741 stevensc 17 
}) => {
835 stevensc 18 
 
1750 stevensc 19 
    const lastMessage = useRef(null);
765 stevensc 20 
 
853 stevensc 21 
    useEffect(() => {
917 stevensc 22 
        const observer = new IntersectionObserver(([entry]) => {
23 
            if (entry.isIntersecting) {
24 
                getMoreMessages()
25 
            }
26 
        })
27 
 
879 stevensc 28 
        if (lastMessage.current) {
915 stevensc 29 
            observer.observe(lastMessage.current)
876 stevensc 30 
        }
1752 stevensc 31 
    }, [messages]);
876 stevensc 32 
 
4375 stevensc 33 
    if (!selectedConversation) {
4374 stevensc 34 
        return (
35 
            <EmptySection
36 
                Icon={<i className='fas fa-comments icon' />}
37 
                message='No hay mensajes'
38 
            />
39 
        )
4347 stevensc 40 
    }
41 
 
747 stevensc 42 
    return (
4346 stevensc 43 
        <div className='chat'>
4374 stevensc 44 
            <div className='icon-hide' onClick={() => setConversation(null)}>
4373 stevensc 45 
                <i className="fas fa-angle-left" />
46 
                <span>
4346 stevensc 47 
                    Volver
48 
                </span>
2747 stevensc 49 
            </div>
4346 stevensc 50 
            <a href={selectedConversation.profile}>
51 
                <h2 className='chat-header'>
52 
                    {selectedConversation.name}
53 
                </h2>
54 
            </a>
4374 stevensc 55 
            {loading
56 
                ? <Spinner />
57 
                :
58 
                <div className="messages-line">
59 
                    {messages.length
60 
                        ? messages.map((element, index) => {
61 
                            return (
62 
                                <MessageTemplate
63 
                                    key={index}
64 
                                    message={element}
65 
                                    date={element.date}
66 
                                />
67 
                            )
68 
                        })
69 
                        :
70 
                        <div className='message-select-conversation'>
71 
                            <div className='msgs-select-container'>
72 
                                <i className='fas fa-inbox icon' />
73 
                                <h3>No hay mensajes en esta conversación</h3>
74 
                            </div>
4346 stevensc 75 
                        </div>
4374 stevensc 76 
                    }
77 
                    <hr ref={lastMessage} style={{ visibility: 'hidden' }} />
78 
                </div>}
4346 stevensc 79 
            <MessageBox
80 
                setMsgs={setMsgs}
81 
                onSend={onSend}
82 
                backendVars={backendVars}
83 
                sendLink={selectedConversation.send_link}
84 
            />
85 
        </div >
1 www 86 
    )
3074 stevensc 87 
}
88 
 
89 
export default Chatmail