{% load i18n %}
<div class="table-responsive">
    <!-- Payments Content-->
    <table class="table table-dark table-striped w-100 tax-table-hover tax-table-striped" id="filters">
        <thead>
            <tr>
                <th scope="col">{% translate "Name" %}</th>
                <th scope="col">{% translate "Descriptions" %}</th>
                <th scope="col">{% translate "Active" %}</th>
                <th scope="col">{% translate "Actions" %}</th>
            </tr>
        </thead>

        <tbody>
        {% for filter in filter_sets %}
            <tr>
                <td>{{ filter.name }}</td>
                <td>{{ filter.description }}</td>
                <td>
                    <button class="btn btn-{% if filter.is_active %}success{% else %}danger{% endif %} btn-sm">
                        {{ filter.is_active_html }}
                    </button>
                </td>
                <td>
                    <a href="#" class="btn btn-sm btn-primary" data-bs-toggle="modal" data-tooltip-toggle="taxsystem-tooltip" data-bs-target="#modalViewFilterContainer" data-ajax_filter="{% url 'taxsystem:api:get_filter_set_filters' corporation_id=corporation_id filter_set_id=filter.id %}" title="{% translate 'Info' %}">
                        <i class="fa-solid fa-info m-1"></i>
                    </a>
                    <a href="{% url 'taxsystem:switch_filterset' corporation_id=corporation_id filter_set_id=filter.id %}" data-tooltip-toggle="taxsystem-tooltip" class="btn btn-sm btn-warning" title="{% translate 'Deactivate' %}">
                        <i class="fa-solid fa-{% if filter.is_active %}eye-low-vision{% else %}eye{% endif %}"></i>
                    </a>
                    <a href="{% url 'taxsystem:delete_filterset' corporation_id=corporation_id filter_set_id=filter.id %}" data-tooltip-toggle="taxsystem-tooltip" class="btn btn-sm btn-danger" title="{% translate 'Delete' %}">
                        <i class="fa-solid fa-trash"></i>
                    </a>
                </td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
</div>