{#
  Historique des actions (admin only).
  Paramètres :
    - logs      : ActivityLog[]
    - moreHref  : string|null  Lien vers le journal complet, posé à DROITE du titre
    - moreLabel : string       Libellé de ce lien (défaut : « Voir tout le journal »)
#}
{% set moreHref = moreHref ?? null %}
{% set moreLabel = moreLabel ?? 'Voir tout le journal' %}

{% if logs is defined %}
<div class="bg-white rounded-2xl border border-gray-200 shadow-sm overflow-hidden mt-6">
    <div class="px-6 py-4 border-b border-gray-100 flex items-center gap-3">
        <div class="w-10 h-10 rounded-lg bg-gray-100 flex items-center justify-center">
            {% include '_atoms/icon/icon.html.twig' with { name: 'clock', size: 'md', color: 'gray' } only %}
        </div>
        <h3 class="font-semibold text-gray-900">Historique des actions</h3>

        {# Sous la liste, ce lien se lisait comme la suite des entrées ; à droite du
           titre, il appartient à la section et se trouve sans la parcourir. #}
        {% if moreHref %}
            <a href="{{ moreHref }}"
               class="ml-auto inline-flex items-center gap-1.5 text-sm font-medium text-primary hover:text-primary/80 whitespace-nowrap">
                {{ moreLabel }}
                {% include '_atoms/icon/icon.html.twig' with { name: 'arrow-right', size: 'xs' } only %}
            </a>
        {% endif %}
    </div>

    {% if logs is empty %}
        <div class="px-6 py-8 text-center text-sm text-gray-400">
            Aucune activité enregistrée.
        </div>
    {% else %}
    <div class="divide-y divide-gray-100">
        {% for log in logs %}
            {% set ctx = log.context ?? {} %}

            {# Le nom français de l'action et la couleur de son badge viennent de
               ActivityLogLabels : les deux tables vivaient ici, ne couvraient que dix
               actions, et tout le domaine commercial s'affichait en code brut. #}
            {% set badgeVariant = activity_variant(log.action) %}
            {% set actionLabel  = activity_label(log.action) %}

            {# ── Phrase lisible selon l'action ── #}
            {% if log.action == 'viewed' %}
                {% set message %}a consulté{% endset %}

            {% elseif log.action == 'created' %}
                {% set message %}a créé{% if log.entityLabel %} <span class="text-gray-500">« {{ log.entityLabel }} »</span>{% endif %}{% endset %}

            {% elseif log.action == 'updated' %}
                {% set message %}a modifié{% if ctx is not empty and ctx.modifications is not defined and ctx.details is not defined %} — <span class="text-gray-500 text-xs">{% for field, change in ctx %}<span>{{ field }} : <span class="text-gray-700">{{ change }}</span></span>{% if not loop.last %} · {% endif %}{% endfor %}</span>{% elseif log.notes %} — <span class="text-gray-500">{{ log.notes }}</span>{% endif %}{% endset %}

            {% elseif log.action == 'deleted' %}
                {% set message %}a supprimé{% if log.entityLabel %} <span class="text-gray-500">« {{ log.entityLabel }} »</span>{% endif %}{% endset %}

            {% elseif log.action == 'activated' %}
                {% set message %}a activé le contrat
                    {% if ctx.tokens_added is defined %}
                         — <span class="text-gray-500">{{ ctx.tokens_added|number_format(0, ',', '\u00A0') }} tokens crédités</span>
                    {% endif %}
                    {% if ctx.users_renewed is defined and ctx.users_renewed > 0 %}
                        <span class="text-gray-400">, {{ ctx.users_renewed }} utilisateur{{ ctx.users_renewed > 1 ? 's' : '' }} renouvelé{{ ctx.users_renewed > 1 ? 's' : '' }}</span>
                    {% endif %}
                {% endset %}

            {% elseif log.action == 'deactivated' %}
                {% set message %}a désactivé le contrat
                    {% if ctx.company_deactivated is defined and ctx.company_deactivated %}
                        — <span class="text-gray-500">entreprise désactivée
                        {% if ctx.users_deactivated is defined and ctx.users_deactivated > 0 %}
                            , {{ ctx.users_deactivated }} utilisateur{{ ctx.users_deactivated > 1 ? 's' : '' }} désactivé{{ ctx.users_deactivated > 1 ? 's' : '' }}
                        {% endif %}
                        </span>
                    {% endif %}
                {% endset %}

            {% elseif log.action == 'renewed_tokens' %}
                {% set message %}renouvellement automatique
                    {% if ctx.tokens_added is defined %}
                        — <span class="text-gray-500">{{ ctx.tokens_added|number_format(0, ',', '\u00A0') }} tokens crédités</span>
                    {% endif %}
                    {% if ctx.periods_renewed is defined and ctx.periods_renewed > 1 %}
                        <span class="text-gray-400">({{ ctx.periods_renewed }} périodes)</span>
                    {% endif %}
                {% endset %}

            {% elseif log.action == 'reset_password' %}
                {% set message %}a réinitialisé le mot de passe{% if log.notes %} — <span class="text-gray-500">{{ log.notes }}</span>{% endif %}{% endset %}

            {% elseif log.action == 'add_tokens' %}
                {% set message %}a ajouté
                    {% if ctx.tokens_added is defined %}
                        <span class="font-semibold text-gray-800">{{ ctx.tokens_added|number_format(0, ',', '\u00A0') }} tokens</span>
                    {% else %}
                        des tokens
                    {% endif %}
                    {% if log.notes %} — <span class="text-gray-500">{{ log.notes }}</span>{% endif %}
                {% endset %}

            {% elseif log.action == 'set_tokens' %}
                {% set message %}a défini le solde à
                    {% if ctx.tokens_set is defined %}
                        <span class="font-semibold text-gray-800">{{ ctx.tokens_set|number_format(0, ',', '\u00A0') }} tokens</span>
                    {% else %}
                        un nouveau solde
                    {% endif %}
                    {% if log.notes %} — <span class="text-gray-500">{{ log.notes }}</span>{% endif %}
                {% endset %}

            {% else %}
                {% set message %}{% if log.notes %} — <span class="text-gray-500">{{ log.notes }}</span>{% endif %}{% endset %}
            {% endif %}

            <div class="px-6 py-3 text-sm">
              <div class="flex items-center gap-4">
                {# Badge action #}
                <div class="flex-shrink-0">
                    {% include '_atoms/badge/badge.html.twig' with {
                        label: actionLabel,
                        variant: badgeVariant
                    } only %}
                </div>

                {# Phrase lisible #}
                <div class="flex-1 min-w-0 text-gray-700">
                    <span class="font-medium text-gray-900">{{ log.actorLabel }}</span>
                    {{ message|raw }}
                </div>

                {# Date #}
                <span class="flex-shrink-0 text-xs text-gray-400 whitespace-nowrap">
                    {{ log.createdAt|date('d/m/Y H:i') }}
                </span>
              </div>

              {# ── Ce qui a changé, et ce qu'il faut savoir en plus ──
                 Rendu pour toute action qui en porte, sans que chaque branche
                 ci-dessus ait à s'en occuper. Le contexte est déjà écrit en
                 français par CommercialActivityLogger : rien à traduire ici. #}
              {% if ctx.modifications is defined or ctx.details is defined %}
                  <div class="mt-1.5 flex flex-wrap items-center gap-x-4 gap-y-1 text-xs text-gray-500">
                      {% for modif in ctx.modifications ?? [] %}
                          <span class="inline-flex items-center gap-1.5">
                              <span class="text-gray-400">{{ modif.champ }}</span>
                              <span class="line-through text-gray-400">{{ modif.avant }}</span>
                              <span class="text-gray-300">→</span>
                              <span class="font-medium text-gray-700">{{ modif.apres }}</span>
                          </span>
                      {% endfor %}
                      {% for libelle, valeur in ctx.details ?? {} %}
                          <span class="inline-flex items-center gap-1.5">
                              <span class="text-gray-400">{{ libelle }}</span>
                              <span class="font-medium text-gray-700">{{ valeur }}</span>
                          </span>
                      {% endfor %}
                  </div>
              {% endif %}
            </div>
        {% endfor %}
    </div>
    {% endif %}
</div>
{% endif %}