{% include 'mixins/partials/notify.html' %}
{% if page_title is not None %}
  <h1 class="title is-4">{{ page_title }}</h1>
{% endif %}
{% if page_subtitle is not None %}
  <h1 class="subtitle">{{ page_subtitle }}</h1>
{% endif %}
<div class="buttons">

  {% if submit_url is not None %}
    <button
      hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
      hx-get="{{ submit_url }}"
      hx-trigger="click"
      hx-target="#modals-here"
      class="button">
      <span class="icon-text">
        <span class="icon">
          <i class="fa-solid fa-plus"></i>
        </span>
        <span>{{ title_singular }}</span>
      </span>
    </button>
  {% endif %}
  {% if delete_all_url is not None %}
    <button
      hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
      hx-delete="{{ delete_all_url }}"
      hx-trigger="click"
      hx-target="#modals-here"
      hx-swap="innerHTML"
      hx-confirm="Are you sure you wish to delete all {{ context_object_name }}?"
      class="button">
      <span class="icon-text">
        <span class="icon">
          <i class="fa-solid fa-xmark"></i>
        </span>
        <span>Delete all {{ context_object_name }} </span>
      </span>
    </button>
  {% endif %}
  {% for button in extra_buttons %}
    <button
      hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
      hx-{{ button.method }}="{{ button.url }}"
      hx-trigger="click"
      hx-target="#modals-here"
      hx-swap="innerHTML"
      {% if button.confirm %}hx-confirm="Are you sure you wish to {{ button.action }}?"{% endif %}
      class="button">
      <span class="icon-text">
        <span class="icon">
          <i class="{{ button.icon }}"></i>
        </span>
        <span>{{ button.label }}</span>
      </span>
    </button>
  {% endfor %}
</div>

{% include detail_template %}
