/* javascript form handling */
document
  .getElementById("user-settings-form")
  .addEventListener("submit", function (event) {
    event.preventDefault(); // Prevent default form submission

    const form = event.target;
    const formData = new FormData(form);

    // Collect selected regions and keywords
    const selectedRegions = [];
    const selectedKeywords = [];
    formData.forEach((value, key) => {
      if (key === "region") {
        selectedRegions.push(value);
      } else if (key === "keyword") {
        selectedKeywords.push(value);
      }
    });

    // Add new region if provided
    const newRegion = formData.get("new-region").trim();
    if (newRegion) {
      selectedRegions.push(newRegion);
    }

    // Add new keyword if provided
    const newKeyword = formData.get("new-keyword").trim();
    if (newKeyword) {
      selectedKeywords.push(newKeyword);
    }

    // Prepare data to send
    const dataToSend = {
      regions: selectedRegions,
      keywords: selectedKeywords,
      csrf_token: formData.get("csrf_token"),
    };

    // Send data via Fetch API
    fetch(form.action, {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        "X-CSRF-Token": document.querySelector('meta[name="csrf-token"]')
          .content,
      },
      body: JSON.stringify(dataToSend),
    })
      .then((response) => {
        if (response.ok) {
          window.location.reload(); // Reload to reflect changes
        } else {
          alert("Error saving preferences.");
        }
      })
      .catch((error) => {
        console.error("Error:", error);
        alert("Error saving preferences.");
      });
  });