Proyectos de Subversion LeadersLinked - Backend

Rev

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

Rev 16003 Rev 16004
Línea 1... Línea 1...
1 
import React, { useRef, useEffect, useState } from "react";
 1 
import React, { useRef, useEffect } from "react";
2 
import Message from "./Messages";
 2 
import Message from "./Messages";
Línea 3... Línea 3...
3 
 
 3 
 
Línea 4... Línea 4...
4 
import styles from "../chat.module.scss";
 4 
import styles from "../chat.module.scss";
- 
 
 5 
 
5 
 
 6 
const MessagesList = ({
- 
 
 7 
  messages,
- 
 
 8 
  onIntersection,
- 
 
 9 
  isLastPage,
- 
 
 10 
  scrollRef,
6 
const MessagesList = ({ messages, onIntersection, isLastPage, scrollRef }) => {
 11 
  isLoading,
Línea 7... Línea -...
7 
  const [loading, setLoading] = useState(false);
 - 
 
8 
  const loadMoreEl = useRef();
 - 
 
9 
 
 - 
 
10 
  const handleIntersection = (target) => {
 - 
 
11 
    setLoading(true);
 - 
 
12 
    onIntersection(target);
 12 
}) => {
13 
  };
 13 
  const loadMoreEl = useRef();
Línea 14... Línea 14...
14 
 
 14 
 
15 
  useEffect(() => {
 15 
  useEffect(() => {
16 
    const observer = new IntersectionObserver(handleIntersection);
 16 
    const observer = new IntersectionObserver(onIntersection);
Línea 17... Línea 17...
17 
 
 17 
 
18 
    if (loadMoreEl.current) {
 18 
    if (loadMoreEl.current) {
19 
      observer.observe(loadMoreEl.current);
 19 
      observer.observe(loadMoreEl.current);
20 
    }
 20 
    }
Línea 21... Línea -...
21 
 
 - 
 
22 
    return () => {
 - 
 
23 
      observer.disconnect();
 - 
 
24 
    };
 - 
 
25 
  }, []);
 21 
 
26 
 
 22 
    return () => {
27 
  useEffect(() => {
 23 
      observer.disconnect();
28 
    setLoading(false);
 24 
    };
29 
  }, [messages]);
 25 
  }, []);
30 
 
 26 
 
31 
  return (
 27 
  return (
32 
    <div className={styles.messagesContainer} ref={scrollRef}>
 28 
    <div className={styles.messagesContainer} ref={scrollRef}>
33 
      <div className={styles.messageWrapper}>
 29 
      <div className={styles.messageWrapper}>