import { useCallback, useRef } from 'react';
import { useInView } from 'react-intersection-observer';

const useLastMessageInView = () => {
  const messagesEndRef = useRef(null);

  const [setMessagesEndRef, inViewMessagesEnd] = useInView();

  const setRef = useCallback(
    node => {
      messagesEndRef.current = node;

      setMessagesEndRef(node);
    },
    [setMessagesEndRef],
  );

  return { messagesEndRef, setRef, inViewMessagesEnd };
};

export default useLastMessageInView;
