{% load i18n %}

<div class="list-group list-group-flush">
    {% for group in user_groups %}
        <a class="list-group-item list-group-item-action d-flex align-items-center gap-2 px-0"
           href="{% url 'accounts.group-detail' groupname=group.name %}">
            {{ group.name }}
        </a>
    {% empty %}
        <div class="list-group-item px-0 py-0">
            {% trans "No groups" %}
        </div>
    {% endfor %}
</div>
<div hx-target="#user-groups-wrapper" hx-push-url="false">
    {% url 'accounts.user-groups' user.username as user_groups_url %}
    {% include "_pagination.html" with url=user_groups_url target="#user-groups-wrapper" %}
</div>