import { Controller } from '@hotwired/stimulus';

export default class extends Controller {
   static targets = ['button', 'section'];

   declare buttonTargets: HTMLElement[];
   declare sectionTargets: HTMLElement[];

   toggleMenu(e): void {
      const section_id = e.params.id;

      const section = this.sectionTargets.filter(item => (item.getAttribute('data-id_section') == section_id))[0];
      if (section) {
         section.classList.toggle('opened');
      }

      const button = this.buttonTargets.filter(item => (item.getAttribute('data-section-sectiontree-id-param') == section_id))[0];
      if (button) {
         button.classList.toggle('active');
         button.setAttribute('aria-expanded', button.classList.contains('active') ? 'true' : 'false');

         const sectionMenu = document.getElementById(button.getAttribute('aria-controls'));
         if (sectionMenu) {
            sectionMenu.setAttribute('aria-hidden', button.classList.contains('active') ? 'false' : 'true');
         }
      }
   }

   openSectionsModal(e): void {
      const sectionsModalToggler = document.querySelector('[data-header-sectionsmodal-target="button"]') as HTMLElement;
      if (sectionsModalToggler) {
         e.preventDefault();
         sectionsModalToggler.click();
      }
   }
}
