Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 2747 | Rev 2750 | 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 (
2747 stevensc 33
        !selectedConversation
34
            ?
35
            <div className="main-conversation-box border-gray border-radius">
36
                <div className='message-select-conversation'>
37
                    <div className='msgs-select-container'>
38
                        <i className='fas fa-comments icon text-gray' />
39
                        <h3>
40
                            No hay mensajes
41
                        </h3>
1884 steven 42
                    </div>
2747 stevensc 43
                </div>
44
            </div>
45
            :
2748 stevensc 46
            <div className='inmail-conversation-container'>
47
                <div className="inmail-conversation-box border-gray border-radius">
48
                    <div className="py-3 mb-2 chat-header">
49
                        <a href={selectedConversation.profile}>
50
                            <h2>
51
                                {selectedConversation.name}
52
                            </h2>
53
                        </a>
54
                    </div>
55
                    <div className="messages-line">
56
                        {
57
                            messages.length
58
                                ?
59
                                messages.map((element, i) =>
60
                                    <MessageTemplate
61
                                        key={i}
62
                                        message={element}
63
                                    />
64
                                )
65
                                :
66
                                <div className='message-select-conversation'>
67
                                    <div className='msgs-select-container'>
68
                                        <i className='fas fa-inbox icon' />
69
                                        <h3>No hay mensajes en esta conversación</h3>
70
                                    </div>
2747 stevensc 71
                                </div>
2748 stevensc 72
                        }
73
                        <hr ref={lastMessage} />
74
                    </div>
2747 stevensc 75
                </div>
76
                <MessageBox
77
                    onSend={onSend}
78
                    backendVars={backendVars}
79
                    sendLink={selectedConversation.send_link}
80
                />
81
            </div>
82
 
1 www 83
    )
1752 stevensc 84
}