import { useEffect, useRef, useCallback } from "react";
import { OverlayScrollbars } from "overlayscrollbars";
import "overlayscrollbars/overlayscrollbars.css";

/**
 * Хук для инициализации OverlayScrollbars на элементе
 * @param {Object} scrollbarOptions - Опции стилизации скроллбара
 * @returns {Function} callback ref для элемента
 */
export const useOverlayScrollbars = (scrollbarOptions = {}) => {
  const instanceRef = useRef(null);
  const elementRef = useRef(null);

  // Callback ref для правильной обработки жизненного цикла
  const setRef = useCallback((element) => {
    // Если элемент был удален, уничтожаем экземпляр
    if (!element && instanceRef.current) {
      try {
        instanceRef.current.destroy();
      } catch (e) {
        // Игнорируем ошибки при уничтожении
      }
      instanceRef.current = null;
      elementRef.current = null;
      return;
    }

    // Если элемент изменился, уничтожаем старый экземпляр
    if (elementRef.current && elementRef.current !== element && instanceRef.current) {
      try {
        instanceRef.current.destroy();
      } catch (e) {
        // Игнорируем ошибки при уничтожении
      }
      instanceRef.current = null;
    }

    // Если элемент существует и еще не инициализирован
    if (element && !instanceRef.current) {
      elementRef.current = element;

      // Дефолтные опции для скроллбара
      const defaultOptions = {
        scrollbars: {
          theme: "os-theme-custom",
          visibility: "auto",
          autoHide: "never",
          autoHideDelay: 0,
          dragScrolling: true,
          clickScrolling: false,
          touchSupport: true,
          snapHandle: false,
        },
        overflow: {
          x: scrollbarOptions.overflowX || "hidden",
          y: scrollbarOptions.overflowY || "scroll",
        },
      };

      // Инициализируем OverlayScrollbars
      try {
        instanceRef.current = OverlayScrollbars(element, defaultOptions);
      } catch (e) {
        console.error("Failed to initialize OverlayScrollbars:", e);
      }
    }
  }, [scrollbarOptions.overflowX, scrollbarOptions.overflowY]);

  // Cleanup при размонтировании компонента
  useEffect(() => {
    return () => {
      if (instanceRef.current) {
        try {
          instanceRef.current.destroy();
        } catch (e) {
          // Игнорируем ошибки при уничтожении
        }
        instanceRef.current = null;
        elementRef.current = null;
      }
    };
  }, []);

  return setRef;
};

