{% extends "combo/search-cell.html" %}
{% load static %}

{% block search-form %}
  {{ block.super }}
  
  {% if not is_portal_agent and search_keywords %}
  <div id="combo-search-keywords-{{ cell.pk }}" class="combo-search-keywords">

  {% for keyword in search_keywords %}
    <button class="combo-search-keywords--button">{{ keyword }}</button>
  {% endfor %}
  </div>

  <script>
    $(function() {
      const $input = $('#combo-search-input-{{ cell.pk }}');
      const $keywords = $('#combo-search-keywords-{{ cell.pk }}');

      $keywords.on('click', 'button', function(){
        const val = $(this).text();
        $input.val(val);
        $input.trigger('change');
      })
    });
  </script>
  {% endif %}
{% endblock %}
