import { useCallback } from 'react';
import { S as SCROLL_BUFFER } from './consts-c9746f2b.js';

function calcScrollBottom(scrollHeight, scrollTop) {
  return scrollHeight - scrollTop;
}
function useHandleOnScrollCallback(_ref) {
  let {
    hasMore,
    onScroll,
    scrollRef,
    setShowScrollDownButton
  } = _ref;
  return useCallback(() => {
    const element = scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current;
    if (element == null) {
      return;
    }
    const {
      scrollTop,
      scrollHeight,
      clientHeight
    } = element;
    // https://sendbird.atlassian.net/browse/SBISSUE-11759
    // the edge case where channel is inside a page that already has scroll
    // scrollintoView will move the whole page, which we dont want
    const scrollBottom = calcScrollBottom(scrollHeight, scrollTop);
    // even if there is more to fetch or not,
    // we still have to show the scroll to bottom button
    if (typeof setShowScrollDownButton === 'function') {
      setShowScrollDownButton(scrollHeight > scrollTop + clientHeight + 1);
    }
    if (!hasMore) {
      return;
    }
    if (scrollTop < SCROLL_BUFFER) {
      onScroll(() => {
        // sets the scroll position to the bottom of the new messages
        element.scrollTop = element.scrollHeight - scrollBottom;
      });
    }
  }, [setShowScrollDownButton, hasMore, onScroll, scrollRef]);
}

export { useHandleOnScrollCallback as u };
//# sourceMappingURL=index-cfd0e4c4.js.map
