Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 858 | Rev 866 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 858 Rev 865
Línea 1... Línea 1...
1 
import React, { useEffect, useState } from 'react'
 1 
import React, { useEffect, useRef, useState } from 'react'
Línea 2... Línea 2...
2 
 
 2 
 
Línea 3... Línea 3...
3 
export default ({ messages, selectedConversation, onSend, backendVars, getMoreMessages, handleShowConversation }) => {
 3 
export default ({ messages, selectedConversation, onSend, backendVars, getMoreMessages, handleShowConversation }) => {
- 
 
 4 
 
Línea 4... Línea 5...
4 
 
 5 
    const [text, setText] = useState('')
5 
    const [text, setText] = useState('')
 6 
    const lineEl = useRef(null);
6 
 
 - 
 
7 
    const handleScroll = (event) => {
 - 
 
8 
        const node = event.target;
 7 
 
9 
        console.log(node)
 8 
    const handleScroll = (event) => {
10 
        console.log(node.clientHeight)
 - 
 
11 
        /* if (node.scrollHeight >= (node.clientHeight * .62)) {
 - 
 
12 
            getMoreMessages()
 - 
 
13 
        } */
 - 
 
14 
    }
 - 
 
15 
    const paneDidMount = (node) => {
 9 
        const node = event.target;
16 
        if (node) {
 10 
        if (node.scrollTop >= (node.scrollHeight * .82)) {
Línea 17... Línea 11...
17 
            node.addEventListener("scroll", handleScroll.bind(this));
 11 
            getMoreMessages()
- 
 
 12 
        }
18 
        }
 13 
    }
- 
 
 14 
 
19 
    }
 15 
    useEffect(() => {
Línea 20... Línea 16...
20 
 
 16 
        if (lineEl !== null){
21 
    useEffect(() => {
 17 
            lineEl.current.scrollTop = lineEl.scrollHeight
22 
        paneDidMount.current?.scrollIntoView({ behavior: "smooth" });
 18 
        }
23 
      }, [messages]);
 19 
    }, [messages]);
Línea 60... Línea 56...
60 
                                    </ul>
 56 
                                    </ul>
61 
                                </div>
 57 
                                </div>
62 
                            </div>
 58 
                            </div>
63 
                            <div
 59 
                            <div
64 
                                className="messages-line"
 60 
                                className="messages-line"
65 
                                ref={paneDidMount}
 61 
                                ref={lineEl}
- 
 
 62 
                                onScroll={handleScroll}
66 
                            >
 63 
                            >
67 
                                {
 64 
                                {
68 
                                    (messages)
 65 
                                    (messages)
69 
                                    &&
 66 
                                    &&
70 
                                    (
 67 
                                    (