import { useRef } from "react";
import { View, LayoutChangeEvent } from "react-native";

const InfiniteScrollTrigger = ({
  marginTop = 0,
  onTriggered,
}: {
  marginTop?: number;
  onTriggered: () => void;
}) => {
  const commentsEndRef = useRef(null);

  const handleLayout = (event: LayoutChangeEvent) => {
    const { layout } = event.nativeEvent;
    if (layout.height > 0) {
      onTriggered();
    }
  };
  return (
    <>
      <View style={{ height: marginTop }} />
      <View ref={commentsEndRef} onLayout={handleLayout} />
    </>
  );
};

export default InfiniteScrollTrigger;
