export default function handleSearchRevue() {
  const searchRevue = document.querySelector(
    '.page--single-revue .sidebar .search-field input'
  ) as HTMLInputElement;
  const contentArea = document.querySelector('.page--single-revue .content-area') as HTMLElement;
  const currentRevueId = document
    .querySelector('.page--single-revue')
    ?.getAttribute('data-revue-id') as string;
  const revueToolbarButtons = document.querySelectorAll(
    '.page--single-revue .revue-toolbar button'
  ) as NodeListOf<HTMLButtonElement>;

  if (!searchRevue || !contentArea) return;

  const resetSearchButton = document.querySelector(
    '.page--single-revue .sidebar .search-field .reset-search-button'
  ) as HTMLButtonElement;
  if (!resetSearchButton) return;

  function resetSearch() {
    searchRevue.value = '';
    contentArea.innerHTML = originalContent;
  }

  resetSearchButton.addEventListener('click', () => {
    resetSearch();
  });

  // Sauvegarder le contenu original
  const originalContent = contentArea.innerHTML;

  searchRevue.addEventListener('input', async () => {
    const searchValue = searchRevue.value.trim();

    // Si la recherche est vide, restaurer le contenu original
    if (searchValue === '') {
      contentArea.innerHTML = originalContent;
      return;
    }

    try {
      const response = await fetch(
        `/wp-json/dynamiques-datas/v1/build/revues/${currentRevueId}/articles?search=${encodeURIComponent(
          searchValue
        )}`
      );
      const data = await response.json();

      // Afficher les résultats dans content-area
      contentArea.innerHTML = data.html_template;
    } catch (error) {
      console.error('Erreur lors de la récupération des revues:', error);
      contentArea.innerHTML = `
        <div class="search-error">
          <p>Une erreur est survenue lors de la recherche. Veuillez réessayer.</p>
        </div>
      `;
    }
  });

  revueToolbarButtons.forEach((button) => {
    button.addEventListener('click', (e) => {
      e.preventDefault();
      resetSearch();
    });
  });
}