{% load wagtailadmin_tags i18n %}

<ol class="w-editing-sessions__list">
    {% for session in sessions|slice:":4" %}
        <li>
            {% fragment as avatar_classname %}w-editing-sessions__avatar{% if session.is_idle %} w-editing-sessions__avatar--idle{% endif %}{% endfragment %}
            {% fragment as avatar %}
                {% avatar user=session.user classname=avatar_classname %}
            {% endfragment %}

            {% if session.revision_id %}
                {% fragment as avatar_decorated %}
                    <div class="w-editing-sessions__decorated-avatar w-ping w-ping--critical">
                        {{ avatar }}
                        {% icon name="warning" %}
                        <span class="w-editing-sessions__decorator-filler"></span>
                    </div>
                {% endfragment %}

                {% if current_session.user == session.user %}
                    {% blocktranslate trimmed asvar saved_new_version_message %}
                        You saved a new version in another window
                    {% endblocktranslate %}
                {% else %}
                    {% blocktranslate trimmed with user_name=session.user|user_display_name|default:_("System") asvar saved_new_version_message %}
                        {{ user_name }} saved a new version
                    {% endblocktranslate %}
                {% endif %}

                {% dropdown theme="popup" classname="w-editing-sessions__session w-editing-sessions__session--saved" toggle_label=avatar_decorated toggle_aria_label=saved_new_version_message %}
                    <div class="w-editing-sessions__popup">
                        <div class="w-editing-sessions__message">
                            {% icon name="warning" %}
                            {{ saved_new_version_message }}
                        </div>
                        <a href="" target="_blank" class="button button-small button-secondary chooser__choose-button">
                            {% icon name="link-external" %}
                            {% trans "View latest version" %}
                        </a>
                    </div>
                {% enddropdown %}
            {% elif session.is_editing %}
                {% if current_session.user == session.user %}
                    {% blocktranslate trimmed asvar has_unsaved_changes_message %}
                        You have unsaved changes in another window
                    {% endblocktranslate %}
                {% else %}
                    {% blocktranslate trimmed with user_name=session.user|user_display_name|default:_("System") asvar has_unsaved_changes_message %}
                        {{ user_name }} has unsaved changes
                    {% endblocktranslate %}
                {% endif %}

                {% dropdown theme="popup" classname="w-editing-sessions__session w-editing-sessions__session--editing" toggle_label=avatar toggle_aria_label=has_unsaved_changes_message %}
                    <div class="w-editing-sessions__popup">
                        <div class="w-editing-sessions__message">
                            {% icon name="warning" %}
                            {{ has_unsaved_changes_message }}
                        </div>
                    </div>
                {% enddropdown %}
            {% else %}
                <button class="w-editing-sessions__session" type="button" data-controller="w-tooltip">
                    {{ avatar }}
                    <div class="w-editing-sessions__popup" data-w-tooltip-target="content" hidden>
                        <span class="w-editing-sessions__name">{{ session.user|user_display_name|default:_("System") }}</span>
                        <span class="w-sr-only">-</span>
                        <span>
                            {% if session.is_idle %}
                                {% trans 'Currently idle' %}
                            {% else %}
                                {% trans 'Currently viewing' %}
                            {% endif %}
                        </span>
                    </div>
                </button>
            {% endif %}
        </li>
    {% endfor %}
    {% if sessions|length > 4 %}
        {% blocktranslate trimmed count num_user=sessions|length|add:"-4" asvar num_other_users_message %}
            One other user is currently viewing
        {% plural %}
            {{ num_user }} other users are currently viewing
        {% endblocktranslate %}

        {% fragment as more_sessions_toggle %}
            +{{ sessions|length|add:"-4" }}
        {% endfragment %}

        <li>
            <span id="w-editing-sessions-more-summary" class="w-sr-only">{{ num_other_users_message }}</span>

            {% dropdown theme="drilldown" classname="w-editing-sessions__session w-editing-sessions__session--more" toggle_classname="w-editing-sessions__avatar" toggle_label=more_sessions_toggle toggle_describedby="w-editing-sessions-more-summary" %}
                <ol class="w-editing-sessions__more-list">
                    {% for session in sessions|slice:"4:" %}
                        <li class="w-editing-sessions__list-item">
                            {% avatar user=session.user size="small" %}
                            <span>{{ session.user|user_display_name|default:_("System") }}</span>
                        </li>
                    {% endfor %}
                </ol>
            {% enddropdown %}
        </li>
    {% endif %}
</ol>

{% if sessions.0.revision_id %}
    <template data-controller="w-teleport" data-w-teleport-target-value="#title-text-w-save-confirmation-dialog" data-w-teleport-mode-value="textContent">
        {% if current_session.user == sessions.0.user %}
            {% blocktranslate trimmed asvar someone_has_saved_message %}
                You saved a new version in another window
            {% endblocktranslate %}
        {% else %}
            {% blocktranslate trimmed with user_name=sessions.0.user|user_display_name|default:_("System") asvar someone_has_saved_message %}
                {{ user_name }} saved a new version
            {% endblocktranslate %}
        {% endif %}
        {{ someone_has_saved_message }}
    </template>

    <template data-controller="w-teleport" data-w-teleport-target-value="#subtitle-w-save-confirmation-dialog" data-w-teleport-mode-value="textContent">
        {% if current_session.user == sessions.0.user %}
            {% blocktranslate trimmed asvar overwrite_message %}
                Proceeding will overwrite the changes you made in that window.
            {% endblocktranslate %}
        {% else %}
            {% blocktranslate trimmed with user_name=sessions.0.user|user_display_name|default:_("System") asvar overwrite_message %}
                Proceeding will overwrite the changes made by {{ user_name }}.
            {% endblocktranslate %}
        {% endif %}
        <span>{{ overwrite_message|capfirst }}</span>
        <span>
            {% blocktranslate trimmed %}
                Alternatively, you can view the latest version in a new tab.
            {% endblocktranslate %}
        </span>
    </template>
{% endif %}