{% load cache %}
{% include 'mixins/partials/notify.html' %}
{% cache 600 objects_signal_accounts request.user.id object_list type %}
  <table
    class="table is-fullwidth is-hoverable"
    hx-target="#{{ context_object_name }}-table"
    id="{{ context_object_name }}-table"
    hx-swap="outerHTML"
    hx-trigger="{{ context_object_name_singular }}Event from:body"
    hx-get="{{ list_url }}">
    <thead>
      <th>number</th>
      <th>actions</th>
    </thead>
    {% for item in object_list %}
      <tr>
        <td>{{ item }}</td>
        <td>
          <div class="buttons">
            <button
              hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
              hx-delete="{# url 'account_delete' type=type pk=item.id #}"
              hx-trigger="click"
              hx-target="#modals-here"
              hx-swap="innerHTML"
              hx-confirm="Are you sure you wish to unlink {{ item }}?"
              class="button">
              <span class="icon-text">
                <span class="icon">
                  <i class="fa-solid fa-xmark"></i>
                </span>
              </span>
            </button>
            {% if type == 'page' %}
              <a href="{% url 'signal_contacts' type=type pk=item %}"><button
                class="button">
                <span class="icon-text">
                  <span class="icon">
                    <i class="fa-solid fa-eye"></i>
                  </span>
                </span>
              </button>
              </a>
              <a href="{% url 'signal_chats' type=type pk=item %}"><button
                class="button">
                <span class="icon-text">
                  <span class="icon">
                    <i class="fa-solid fa-envelope"></i>
                  </span>
                </span>
              </button>
              </a>
            {% else %}
              <button
                hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
                hx-get="{% url 'signal_contacts' type=type pk=item %}"
                hx-trigger="click"
                hx-target="#{{ type }}s-here"
                hx-swap="innerHTML"
                class="button">
                <span class="icon-text">
                  <span class="icon">
                    <i class="fa-solid fa-eye"></i>
                  </span>
                </span>
              </button>
              <button
                hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
                hx-get="{% url 'signal_chats' type=type pk=item %}"
                hx-trigger="click"
                hx-target="#{{ type }}s-here"
                hx-swap="innerHTML"
                class="button">
                <span class="icon-text">
                  <span class="icon">
                    <i class="fa-solid fa-envelope"></i>
                  </span>
                </span>
              </button>
            {% endif %}
          </div>
        </td>
      </tr>
    {% endfor %}

  </table>
  <form
  hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
  hx-post="{% url 'signal_account_add' type=type %}"
  hx-target="#modals-here"
  hx-swap="innerHTML">
  {% csrf_token %}
  <div class="field has-addons">
    <div id="device" class="control is-expanded has-icons-left">
      <input
        hx-post="{% url 'signal_account_add' type=type %}"
        hx-target="#widgets-here"
        hx-swap="innerHTML"
        name="device"
        class="input"
        type="text"
        placeholder="Account name">
      <span class="icon is-small is-left">
        <i class="fa-solid fa-plus"></i>
      </span>
    </div>
    <div class="control">
      <div class="field">
        <button
          id="search"
          class="button is-fullwidth"
          hx-post="{% url 'signal_account_add' type=type %}"
          hx-trigger="click"
          hx-target="#widgets-here"
          hx-swap="innerHTML">
          Add account
        </button>
      </div>
    </div>
  </div>
</form>
{% endcache %}