{% load static avatar %}
<div class="nav-item dropdown">
    <a href="#" class="nav-link d-flex lh-1 text-reset p-0" data-bs-toggle="dropdown" aria-label="Open user menu">
        {% avatar user size="sm" %}
        <div class="d-none d-xl-block ps-2">
            <div>{{ user.get_full_name|default:user.username }}</div>
            {% if user.email %}
            <div class="mt-1 small text-secondary">{{ user.email }}</div>
            {% endif %}
        </div>
    </a>
    <div class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
        {% for item in menu_items %}
            {% if item.visible %}
                {% if item.divider %}
                <div class="dropdown-divider"></div>
                {% else %}
                <a href="{{ item.url }}" class="dropdown-item{% if item.active %} active{% endif %}">
                    {% if item.icon %}
                    <svg xmlns="http://www.w3.org/2000/svg" class="icon dropdown-item-icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                        <use href="{% static 'tabler/icons/tabler-sprite.svg' %}#tabler-{{ item.icon }}"/>
                    </svg>
                    {% endif %}
                    {{ item.title }}
                </a>
                {% endif %}
            {% endif %}
        {% endfor %}
    </div>
</div>