{% extends 'base.html' %}
{% block content %}
<h2 class="mb-3">Search Results</h2>

<div id="active-filters">
  {% include 'search_tags.html' %}
</div>

<div id="search-results">
  {% include 'search_results.html' %}
</div>

<script>
document.addEventListener("DOMContentLoaded", function () {
  document.querySelectorAll(".remove-chip").forEach(btn => {
    btn.addEventListener("click", function (e) {
      e.preventDefault();
      const tag = this.dataset.tag;

      fetch("{{ url_for('core.search') }}", {
        method: "POST",
        headers: { "Content-Type": "application/json" },
        body: JSON.stringify({ remove: tag })
      })
      .then(res => res.json())
      .then(data => {
        document.getElementById("active-filters").innerHTML = data.tags_html;
        document.getElementById("search-results").innerHTML = data.results_html;
      });
    });
  });
});
</script>
{% endblock %}