{% load aa_impersonate evelinks i18n theme_tags %}

{% impersonation_active as impersonating %}

<div
    id="aa-user-info"
    class="w-100 d-flex flex-column justify-content-center align-items-center text-center py-1 border-top border-secondary {% if not user.is_authenticated %}position-absolute bottom-0{% endif %} {% if impersonating %}text-bg-warning{% endif %}"
>
    {% if impersonating %}
        <p class="m-0 small text-truncate fw-bold" data-bs-tooltip="allianceauth" title="{% blocktranslate trimmed with username=user.username %}Impersonating {{ username }}{% endblocktranslate %}">
            <i class="fa-solid fa-user-secret fa-fw"></i>
            {% blocktranslate trimmed with username=user.username %}Impersonating {{ username }}{% endblocktranslate %}
        </p>
    {% endif %}

    <div class="d-flex mb-0 w-100">
        <div class="p-2 position-relative m-2">
            {% if user.is_authenticated %}
                {% with main=request.user.profile.main_character %}
                    <img
                        class="rounded-circle"
                        src="{{ main.character_id|character_portrait_url:64 }}"
                        alt="{{ main.character_name }}"
                    >

                    <img
                        class="rounded-circle position-absolute bottom-0 start-0"
                        src="{{ main.corporation_logo_url_32 }}"
                        alt="{{ main.corporation_name }}"
                    >

                    {% if main.alliance_id %}
                        <img
                            class="rounded-circle position-absolute bottom-0 end-0"
                            src="{{ main.alliance_logo_url_32 }}"
                            alt="{{ main.alliance_name }}"
                        >
                    {% elif main.faction_id %}
                        <img
                            class="rounded-circle position-absolute bottom-0 end-0"
                            src="{{ main.faction_logo_url_32 }}"
                            alt="{{ main.faction_name }}"
                        >
                    {% endif %}
                {% endwith %}
            {% else %}
                {% include "bundles/image-auth-logo.html" with logo_width="64px" %}
            {% endif %}
        </div>

        <div class="align-self-center text-start w-100 allianceauth-sidebar-user-information" style="max-width: 185px;">
            {% if user.is_authenticated %}
                {% with main=request.user.profile.main_character %}
                    <h5 class="m-0 text-truncate" data-bs-tooltip="allianceauth" title="{{ main.character_name }}">
                        {{ main.character_name }}
                    </h5>

                    <p class="m-0 small text-truncate" data-bs-tooltip="allianceauth" title="{{ main.corporation_name }}">
                        {{ main.corporation_name }}
                    </p>

                    {% if main.alliance_id %}
                        <p class="m-0 small text-truncate" data-bs-tooltip="allianceauth" title="{{ main.alliance_name }}">
                            {{ main.alliance_name }}
                        </p>
                    {% elif main.faction_id %}
                        <p class="m-0 small text-truncate" data-bs-tooltip="allianceauth" title="{{ main.alliance_name }}">
                            {{ main.faction_name }}
                        </p>
                    {% endif %}
                {% endwith %}
            {% else %}
                <h5 class="m-0">
                    {{ SITE_NAME }}
                </h5>
            {% endif %}

            <script>
                $(document).ready(() => {
                    const tooltipTriggerList = document.querySelectorAll(
                        '.allianceauth-sidebar-user-information [data-bs-tooltip="allianceauth"]'
                    );
                    [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl));
                });
            </script>
        </div>

        <div class="ms-auto dropup">
            <button type="button" class="h-100 btn {% if impersonating %}text-reset{% endif %}" data-bs-toggle="dropdown" aria-expanded="false">
                <i class="fa-solid fa-gear fa-fw {% if impersonating %}text-reset{% else %}text-light{% endif %}"></i>
            </button>

            <ul class="dropdown-menu" style="min-width: 200px;">
                <li><h6 class="dropdown-header">{% translate "Language" %}</h6></li>

                <li>
                    {% include "public/lang_select.html" %}
                </li>

                {% theme_select %}

                {% if user.is_authenticated and not request.is_mobile_device %}
                    <li><hr class="dropdown-divider"></li>
                    <li><h6 class="dropdown-header">{% translate "Sidebar" %}</h6></li>

                    <li>
                        <form class="dropdown-item" action="{% url 'minimize_sidebar' %}?next={{ request.path|urlencode }}" method="post">
                            {% csrf_token %}

                            <div class="form-check form-switch">
                                <input
                                    class="form-check-input"
                                    type="checkbox"
                                    role="switch"
                                    id="toggle-sidebar"
                                    onchange="this.form.submit()"
                                    {% if request.session.MINIMIZE_SIDEBAR %}checked{% endif %}
                                >
                                <label class="form-check-label" for="toggle-sidebar">
                                    {% translate "Minimize Sidebar" %}
                                </label>
                            </div>
                        </form>
                    </li>
                {% endif %}

                {% if user.is_superuser %}
                    <li><hr class="dropdown-divider"></li>
                    <li><h6 class="dropdown-header">{% translate "Super User" %}</h6></li>

                    <li>
                        <a
                            class="dropdown-item"
                            href="https://allianceauth.readthedocs.io/"
                            title="{% translate 'Alliance Auth Documentation' %}"
                        >
                            <i class="fa-solid fa-book fa-fw"></i>
                            {% translate "Alliance Auth Documentation" %}
                        </a>
                    </li>

                    <li>
                        <a
                            class="dropdown-item"
                            href="https://discord.gg/fjnHAmk"
                            title="{% translate 'Alliance Auth Discord' %}"
                        >
                            <i class="fa-brands fa-discord fa-fw"></i>
                            {% translate "Alliance Auth Discord" %}
                        </a>
                    </li>

                    <li>
                        <a
                            class="dropdown-item"
                            href="https://gitlab.com/allianceauth/allianceauth"
                            title="{% translate 'Alliance Auth Git' %}"
                        >
                            <i class="fa-brands fa-gitlab fa-fw"></i>
                            {% translate "Alliance Auth Git" %}
                        </a>
                    </li>
                {% endif %}

                {% if user.is_staff %}
                    <li>
                        <a
                            class="dropdown-item"
                            href="{% url 'admin:index' %}"
                            title="{% translate 'Admin' %}"
                        >
                            <i class="fa-solid fa-gear fa-fw"></i>
                            {% translate "Admin" %}
                        </a>
                    </li>
                {% endif %}

                <li><hr class="dropdown-divider"></li>

                {% if impersonating %}
                    <li>
                        <form method="post" action="{% url 'impersonate:stop' %}">
                            {% csrf_token %}
                            <input type="hidden" name="next" value="{{ request.get_full_path }}">

                            <button type="submit" class="btn btn-link dropdown-item text-warning">
                                <i class="fa-solid fa-user-secret fa-fw"></i>
                                {% translate "Stop impersonating" %}
                            </button>
                        </form>
                    </li>
                {% endif %}

                {% if user.is_authenticated %}
                    <li>
                        <a
                            class="dropdown-item"
                            href="{% url 'authentication:token_management' %}"
                            title="{% translate 'Token Management' %}"
                        >
                            <i class="fa-solid fa-user-lock fa-fw"></i>
                            {% translate "Token Management" %}
                        </a>
                    </li>

                    <li>
                        <form method="post" action="{% url 'logout' %}">
                            {% csrf_token %}

                            <button type="submit" class="btn btn-link dropdown-item text-danger">
                                <i class="fa-solid fa-right-from-bracket fa-fw"></i>
                                {% translate 'Sign Out' %}
                            </button>
                        </form>
                    </li>
                {% else %}
                    <li>
                        <a
                            class="dropdown-item text-success"
                            href="{% url 'authentication:login' %}"
                            title="{% translate 'Sign In' %}"
                        >
                            <i class="fa-solid fa-right-to-bracket fa-fw"></i>
                            {% translate 'Sign In' %}
                        </a>
                    </li>
                {% endif %}
            </ul>
        </div>
    </div>
</div>