import Quill from 'quill';
import 'quill/dist/quill.core.css';
import { useEffect, useRef, useState } from 'react';

interface UseCustomQuillProps {
  modules: Record<string, unknown>
  formats: string[]
  placeholder: string
}

export const useCustomQuill = ({
  modules,
  formats,
  placeholder,
}: UseCustomQuillProps) => {
  const quillRef = useRef<HTMLDivElement | null>(null);
  const [quill, setQuill] = useState<Quill | null>(null);

  useEffect(() => {
    if (quillRef.current) {
      const quillInstance = new Quill(quillRef.current, {
        modules,
        formats,
        placeholder,
      });
      setQuill(quillInstance);
    }
  }, []);

  return { quillRef, quill, Quill };
};