import { useEffect } from 'react';

type UseDisableScrollProps = {
  isDisabled: boolean;
  containerId: string;
  diabledPointerEvents?: boolean;
  capture?: boolean;
};

export const useDisableScroll = ({
  isDisabled,
  containerId,
  diabledPointerEvents = true,
  capture = false,
}: UseDisableScrollProps) => {
  useEffect(() => {
    const container = document.getElementById(containerId);
    if (!container) return;

    const blockScroll = (e: Event) => {
      if (capture) e.stopPropagation();
      e.preventDefault();
    };

    if (isDisabled) {
      if (diabledPointerEvents) container.style.pointerEvents = 'none';

      container.addEventListener('wheel', blockScroll, {
        passive: false,
        capture,
      });
      container.addEventListener('touchmove', blockScroll, {
        passive: false,
        capture,
      });

      return () => {
        container.removeEventListener('wheel', blockScroll, { capture });
        container.removeEventListener('touchmove', blockScroll, { capture });
        container.style.pointerEvents = 'auto';
      };
    }
  }, [isDisabled, containerId, capture, diabledPointerEvents]);
};
