{% set selftools_categories = h.selftools_categories() %}

<nav class="px-3 py-2 bg-dark">
    <ul class="nav nav-pills nav-fill border border-primary rounded border-light" id="selftools-tab" role="tablist">
        {% for category in selftools_categories %}
            <li class="nav-item" role="presentation">
                <button href="#nav-{{ category.key }}-selftools" class="nav-link rounded-0 fw-bold {% if loop.index == 1 %} active {% endif %}" id="nav-{{ category.key }}-selftools-tab" data-bs-toggle="tab" data-bs-target="#nav-{{ category.key }}-selftools" role="tab" aria-controls="nav-{{ category.key }}-selftools" aria-selected="true">{{ category.label }}</button>
            </li>
        {% endfor %}
    </ul>
</nav>
<div class="tab-content d-block" id="nav-selftools-data">
    {% for category in selftools_categories %}
        <div class="tab-pane fade {% if loop.index == 1 %} show active {% endif %}" id="nav-{{ category.key }}-selftools" role="tabpanel" aria-labelledby="nav-{{ category.key }}-selftools-tab">
            {% set extras = {} %}
            {% snippet "selftools/snippets/selftools_{}.html".format(category.key), category=category, extras=extras %}
        </div>
    {% endfor %}
</div>