export function initModal() {
  const modals = document.querySelectorAll('[data-component="modal"]');
  modals.forEach((modal) => {
    modal.addEventListener('click', (event) => {
      const target = event.target;
      if (!(target instanceof HTMLElement)) {
        return;
      }
      if (target.dataset.action === 'modal-close') {
        modal.setAttribute('hidden', 'hidden');
      }
    });
  });

  document.querySelectorAll('[data-action="modal-open"]').forEach((trigger) => {
    trigger.addEventListener('click', () => {
      const id = trigger.getAttribute('data-target');
      if (!id) {
        return;
      }
      const modal = document.getElementById(id);
      if (modal) {
        modal.removeAttribute('hidden');
      }
    });
  });
}