{% extends "base.j2" %}

{% block title %}
Главная
{% endblock title %}

{% block main %}
<div class="container">
  <div id="cards-grid" class="row row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-4">

    {% for session in sessions %}
    <div class="col mb-3" data-session="{{ session.name }}">
      <div class="card">
        <div class="card-body">
          <h3 class="card-title">{{ session.name }}</h3>
        </div>
        <div class="card-footer">
            <a href="/parse/{{ session.id }}" class="btn btn-outline-primary mt-2">
              Использовать
            </a>
            
            <button
              hx-delete="/api/sessions/{{ session.id }}"
              hx-swap="delete"
              hx-target='[data-session="{{ session.name }}"]'
              hx-confirm="Вы уверены, что хотите удалить эту сессию?"
              class="btn btn-outline-danger mt-2 mx-2"
            >  
              Удалить
            </button>
        </div>
      </div>
    </div>
    {% endfor %}

  </div>
</div>
{% endblock main %}