import { useEffect, useContext } from '@wordpress/element';

import { DesignContext } from '@components/DesignPanel/DesignStore';
import { useStore } from 'zustand';

const useInitCurrentDesign = ({
  defaultDesign,
  defaultClass,
  content,
}: any) => {
  const store = useContext(DesignContext);
  const { setCurrentDesign, setCurrentClass, setContent } = useStore(store);

  // set once
  useEffect(() => {
    let design = [] as any;
    if (defaultDesign !== undefined) {
      design = [...defaultDesign];
    }
    setCurrentDesign(design);
    setCurrentClass(defaultClass);
    setContent(content);
  }, []);
};

export default useInitCurrentDesign;