import {FC, PropsWithChildren, useEffect, useRef} from "react";
import IndianaDragScoll from "react-indiana-drag-scroll";
import styles from './ScrollContainer.module.css'

export const ScrollContainer: FC<PropsWithChildren> = ({children}) => {
  const container = useRef<HTMLDivElement>(null);

  useEffect(() => {
    if (container.current) {
      container.current.oncontextmenu = e => e.preventDefault()
    }
  }, []);

  return <IndianaDragScoll
    className={styles.container}
    buttons={[2]}
    innerRef={container}
    hideScrollbars={false}
    activationDistance={5}
  >
    <div className={styles.inner}>
      {children}
    </div>
  </IndianaDragScoll>
}