Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
1752 stevensc 1
import React, { useEffect, useRef, useState } from 'react';
1748 stevensc 2
import MessageBarHead from './MessageBarHead';
3
import MessageBox from './MessageBox';
4
import MessageTemplate from './MessageTemplate';
1 www 5
 
1752 stevensc 6
export default ({
1748 stevensc 7
    messages,
8
    selectedConversation,
9
    onSend,
10
    backendVars,
11
    getMoreMessages,
1741 stevensc 12
    handleShowConversation,
13
    loading
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
            }
1752 stevensc 23
        }, {
24
            rootMargin: '0px'
917 stevensc 25
        })
26
 
879 stevensc 27
        if (lastMessage.current) {
915 stevensc 28
            observer.observe(lastMessage.current)
876 stevensc 29
        }
1752 stevensc 30
    }, [messages]);
876 stevensc 31
 
747 stevensc 32
    return (
1884 steven 33
        <div className="main-conversation-box border-gray border-radius">
34
            {
35
                !selectedConversation
36
                    ?
37
                    <div className='message-select-conversation'>
38
                        <div className='msgs-select-container'>
1891 steven 39
                            <i className='fas fa-comments icon text-gray' />
1884 steven 40
                            <h3>
41
                                No hay mensajes
42
                            </h3>
811 stevensc 43
                        </div>
1884 steven 44
                    </div>
45
                    :
46
                    <>
47
                        <MessageBarHead
48
                            selectedConversation={selectedConversation}
49
                            handleShowConversation={handleShowConversation}
50
                        />
51
                        <div className="messages-line">
52
                            {
53
                                messages.length
54
                                    ?
55
                                    messages.map((element, i) =>
56
                                        <MessageTemplate
57
                                            key={i}
58
                                            message={element}
59
                                        />
60
                                    )
61
                                    :
62
                                    <div className='message-select-conversation'>
63
                                        <div className='msgs-select-container'>
64
                                            <i className='fas fa-inbox icon' />
65
                                            <h3>No hay mensajes en esta conversación</h3>
1748 stevensc 66
                                        </div>
1884 steven 67
                                    </div>
68
                            }
69
                            <hr ref={lastMessage} />
70
                        </div>
71
                        <MessageBox
72
                            onSend={onSend}
73
                            backendVars={backendVars}
74
                        />
75
                    </>
1748 stevensc 76
            }
1884 steven 77
        </div>
1 www 78
    )
1752 stevensc 79
}