{% trans_default_domain 'admin' %}

{# Offer workflow transition → natural-language predicate, read as “hat {offer} …”,
   mirroring the ItemActivity feed. Keyed by transition name; unknown → “bearbeitet”. #}
{% set offer_transition_verbs = {
    finalize:  'als vollständig markiert',
    approve:   'freigegeben',
    unapprove: 'zur erneuten Prüfung zurückgegeben',
    publish:   'auf der Webseite veröffentlicht',
    unpublish: 'von der Webseite genommen',
    cancel:    'abgesagt',
    relaunch:  'wieder veröffentlicht',
    to_draft:  'in den Entwurf zurückgesetzt',
    complete:  'abgeschlossen',
} %}

<aside class="bg-gray-50 lg:w-96 lg:shrink-0 lg:border-l lg:border-gray-200 dark:bg-gray-900/10 dark:border-white/5">
    <header class="flex items-center justify-between border-b border-gray-200 px-4 py-4 sm:px-6 sm:py-6 lg:px-8 dark:border-white/5">
        <h2 class="text-base/7 font-semibold text-gray-900 dark:text-white">{{ 'Änderungslog'|trans }}</h2>
    </header>
    <ul role="list" class="divide-y divide-gray-100 dark:divide-white/5">
        {% for activity in activities %}
            {% set is_transition = activity.isTransition|default(false) %}
            {% set is_offer = activity.offer|default(null) is not null %}
            {% set is_participant = activity.participant|default(null) is not null %}
            {% set is_host = activity.host|default(null) is not null %}
            {% set tname = is_transition ? activity.transition.name : null %}
            {% set status = is_transition ? activity.transition.tos|first : null %}

            {# Leading icon by action type: offer transition → flow-arrow (its status
               icon sits inline next to the label instead), new application → user-plus,
               other attendance change → swap, comment → chat. #}
            {% set icon = is_transition
                ? (is_offer ? 'ph:flow-arrow' : (tname == 'create' ? 'ph:user-plus' : 'ph:swap'))
                : 'ph:chat-circle-dots' %}

            {% set actor %}
                {%- if activity.createdBy %}<a href="{{ path('admin_accounts_show', {uuid: activity.createdBy.uuid.toBase58}) }}" data-turbo-frame="slideover" class="font-medium text-gray-900 dark:text-white hover:underline">{{ activity.createdBy.name }}</a>
                {%- elseif activity.applicationSystem|default %}<span class="font-medium text-gray-900 dark:text-white">{{ ("applicationSystem." ~ activity.applicationSystem)|trans }}</span>
                {%- else %}<span class="font-medium text-gray-900 dark:text-white">{{ 'System'|trans }}</span>{% endif -%}
            {% endset %}

            <li class="px-4 py-4 sm:px-6 lg:px-8">
                <div class="flex items-start gap-x-2.5 text-sm text-gray-500 dark:text-gray-400">
                    <span class="mt-0.5 flex size-6 flex-none items-center justify-center rounded-full bg-gray-100 dark:bg-gray-800">
                        <twig:ux:icon name="{{ icon }}" class="size-3.5 text-gray-500 dark:text-gray-400" aria-hidden="true" />
                    </span>
                    <div class="min-w-0 flex-1">
                        {{ actor }}
                        {% if is_transition and is_offer %}
                            hat <a href="{{ path('admin_offers_show', {uuid: activity.offer.uuid.toBase58}) }}" data-turbo-frame="slideover" class="font-medium text-gray-900 dark:text-white hover:underline">{{ activity.offer.name }}</a> <span class="align-middle">{{ include("@FerienpassAdmin/page/offers/_status_icon.html.twig", { status: status, size: 'size-4' }) }}</span> {{ offer_transition_verbs[tname] ?? 'bearbeitet' }}
                        {% elseif is_transition and is_participant %}
                            hat <a href="{{ path('admin_participants_show', {uuid: activity.participant.uuid.toBase58}) }}" data-turbo-frame="slideover" class="font-medium text-gray-900 dark:text-white hover:underline">{{ activity.participant.name }}</a>
                            für <a href="{{ path('admin_offers_show', {uuid: activity.attendance.offer.uuid.toBase58}) }}" data-turbo-frame="slideover" class="font-medium text-gray-900 dark:text-white hover:underline">{{ activity.attendance.offer.name }}</a>
                            {%- if tname == 'create' %} {{ status == 'waitlisted' ? 'auf die Warteliste geschrieben' : 'angemeldet' }}
                            {%- elseif status %} auf <twig:Admin:Badge attendance="{{ status }}" dot /> gesetzt
                            {%- else %} aktualisiert{% endif %}
                            {%- if activity.decisionReason|default %} <span class="text-gray-400">({{ ("decisionReason." ~ activity.decisionReason)|trans }})</span>{% endif %}
                        {% elseif is_offer %}
                            kommentierte <a href="{{ path('admin_offers_show', {uuid: activity.offer.uuid.toBase58}) }}" data-turbo-frame="slideover" class="font-medium text-gray-900 dark:text-white hover:underline">{{ activity.offer.name }}</a>
                        {% elseif is_participant %}
                            kommentierte <a href="{{ path('admin_participants_show', {uuid: activity.participant.uuid.toBase58}) }}" data-turbo-frame="slideover" class="font-medium text-gray-900 dark:text-white hover:underline">{{ activity.participant.name }}</a>
                        {% elseif is_host %}
                            kommentierte <a href="{{ path('admin_hosts_show', {uuid: activity.host.uuid.toBase58}) }}" data-turbo-frame="slideover" class="font-medium text-gray-900 dark:text-white hover:underline">{{ activity.host.name }}</a>
                        {% endif %}
                        <time datetime="{{ activity.createdAt|date('c') }}" title="{{ activity.createdAt|date('d.m.Y H:i') }}" class="whitespace-nowrap text-gray-400">· {{ activity.createdAt|ago }}</time>
                        {% if activity.comment|default %}
                            <p class="mt-1 text-gray-700 dark:text-gray-300">{{ activity.comment|nl2br }}</p>
                        {% endif %}
                    </div>
                </div>
            </li>
        {% endfor %}
    </ul>
</aside>
