{% extends 'generic/_base.html' %}
{% load helpers %}
{% load render_table from django_tables2 %}
{% load i18n %}

{% comment %}
Blocks:
  - title:    Page title
  - tabs:     Page tabs
  - content:  Primary page content

Context:
  - model:       The model class of the objects being deleted
  - form:        The bulk delete form class
  - table:       The table class for rendering list of objects being deleted
  - return_url:  The URL to which the user is redirected after submitting the form
{% endcomment %}

{% block title %}
  {% trans "Delete" %} {{ table.rows|length }} {{ model|meta:"verbose_name_plural"|bettertitle }}?
{% endblock %}

{% block tabs %}
  <ul class="nav nav-tabs">
    <li class="nav-item" role="presentation">
      <button class="nav-link active" id="delete-form-tab" data-bs-toggle="tab" data-bs-target="#delete-form" type="button" role="tab" aria-controls="delete-form" aria-selected="true">
        {% trans "Bulk Delete" %}
      </button>
    </li>
    <li class="nav-item" role="presentation">
      <button class="nav-link" id="object-list-tab" data-bs-toggle="tab" data-bs-target="#object-list" type="button" role="tab" aria-controls="object-list" aria-selected="false">
        {% trans "Selected Objects" %}
        {% badge table.rows|length %}
      </button>
    </li>
  </ul>
{% endblock tabs %}

{% block content %}

  {# Confirmation form #}
  <div class="tab-pane show active" id="delete-form" role="tabpanel" aria-labelledby="delete-form-tab">
    <div class="alert alert-danger bg-danger-subtle" role="alert">
      <div class="d-flex">
        <div>
          <i class="mdi mdi-alert-octagon p-2"></i>
        </div>
        <div>
          <h4 class="alert-title">{% trans "Confirm Bulk Deletion" %}</h4>
          {% blocktrans trimmed with count=table.rows|length type_plural=model|meta:"verbose_name_plural" %}
            The following operation will delete <strong>{{ count }}</strong> {{ type_plural }}. Please
            carefully review the selected objects and confirm this action.
          {% endblocktrans %}
        </div>
      </div>
    </div>

    <div class="row mt-3">
      <form action="" method="post">
        {% csrf_token %}
        {% for field in form.hidden_fields %}
          {{ field }}
        {% endfor %}
        <div class="text-end">
          <a href="{{ return_url }}" class="btn btn-outline-secondary">{% trans "Cancel" %}</a>
          <button type="submit" name="_confirm" class="btn btn-danger">{% trans "Delete" %} {{ table.rows|length }} {{ model|meta:"verbose_name_plural" }}</button>
        </div>
      </form>
    </div>
  </div>
  {# /Confirmation form #}

  {# Selected objects list #}
  <div class="tab-pane" id="object-list" role="tabpanel" aria-labelledby="object-list-tab">
    <div class="card">
      <div class="table-responsive">
        {% render_table table 'inc/table.html' %}
      </div>
    </div>
  </div>
  {# /Selected objects list #}

{% endblock content %}