export const run = () => {
  const html = document.documentElement;
  const body = document.body;
  const menuLinks = document.querySelectorAll('.admin-menu a');
  const collapseBtn = document.querySelector('.admin-menu .collapse-btn');
  const toggleMobileMenu = document.querySelector('.toggle-mob-menu');
  const switchInput = document.querySelector('.switch input');
  const switchLabel = document.querySelector('.switch label');
  const switchLabelText = switchLabel.querySelector('span:last-child');
  const collapsedClass = 'collapsed';
  const lightModeClass = 'light-mode';

  /*TOGGLE HEADER STATE*/
  collapseBtn.addEventListener('click', function() {
    body.classList.toggle(collapsedClass);
    this.getAttribute('aria-expanded') == 'true'
      ? this.setAttribute('aria-expanded', 'false')
      : this.setAttribute('aria-expanded', 'true');
    this.getAttribute('aria-label') == 'collapse menu'
      ? this.setAttribute('aria-label', 'expand menu')
      : this.setAttribute('aria-label', 'collapse menu');
  });

  /*TOGGLE MOBILE MENU*/
  toggleMobileMenu.addEventListener('click', function() {
    body.classList.toggle('mob-menu-opened');
    this.getAttribute('aria-expanded') == 'true'
      ? this.setAttribute('aria-expanded', 'false')
      : this.setAttribute('aria-expanded', 'true');
    this.getAttribute('aria-label') == 'open menu'
      ? this.setAttribute('aria-label', 'close menu')
      : this.setAttribute('aria-label', 'open menu');
  });

  /*SHOW TOOLTIP ON MENU LINK HOVER*/
  for (const link of menuLinks) {
    link.addEventListener('mouseenter', function() {
      if (
        body.classList.contains(collapsedClass) &&
        window.matchMedia('(min-width: 768px)').matches
      ) {
        const tooltip = this.querySelector('span').textContent;
        this.setAttribute('title', tooltip);
      } else {
        this.removeAttribute('title');
      }
    });
  }

  /*TOGGLE LIGHT/DARK MODE*/
  if (localStorage.getItem('dark-mode') === 'false') {
    html.classList.add(lightModeClass);
    switchInput.checked = false;
    switchLabelText.textContent = 'Light';
  }

  switchInput.addEventListener('input', function() {
    html.classList.toggle(lightModeClass);
    if (html.classList.contains(lightModeClass)) {
      switchLabelText.textContent = 'Light';
      localStorage.setItem('dark-mode', 'false');
    } else {
      switchLabelText.textContent = 'Dark';
      localStorage.setItem('dark-mode', 'true');
    }
  });
};