import { ref } from 'vue';

export const useModal = () => {
  const modalRef = ref<any>(null);

  const showModal = () => {
    if (!!modalRef.value?.open && typeof modalRef.value.open === 'function') {
      modalRef.value.open();
    } else {
      console.warn('Cannot show modal. Modal ref is invalid.');
    }
  };

  const hideModal = () => {
    if (!!modalRef.value?.close && typeof modalRef.value.close === 'function') {
      modalRef.value.close();
    } else {
      console.warn('Cannot hide modal. Modal ref is invalid.');
    }
  };

  return { modalRef, showModal, hideModal };
};