{#
 # MOLECULE: CONV-ITEM
 # Paramètres :
 # | session        | SereniaChatSession | requis              | La session à afficher              |
 # | isActive       | bool               | false               | Item actif (conversation en cours) |
 # | controllerName | string             | 'seren-ia--sidebar' | Identifiant du controller Stimulus |
 #}

{% set isActive = isActive ?? false %}
{% set title = session.title ?? 'Nouvelle conversation' %}
{% set controllerName = controllerName ?? 'seren-ia--sidebar' %}

<div
    class="conv-item group flex items-center gap-2 px-2.5 py-2 mb-0.5 rounded-lg cursor-pointer transition-all duration-medium
           {{ isActive ? 'bg-cohorts/[0.10]' : 'hover:bg-cohorts/[0.08]' }}"
    data-action="click->{{ controllerName }}#loadSession"
    data-session-uuid="{{ session.uuid }}"
    {# data-uuid DOUBLONNE data-session-uuid, et les deux doivent rester : le contrôleur
       de partage (shared--share-link#findCard) cherche `[data-uuid]` — une convention
       commune aux trois outils, qu'on ne va pas plier à Serenia — tandis que
       loadSession()/showSessionMenu() lisent `data-session-uuid` de longue date.
       Supprimer l'un des deux casse silencieusement l'autre chemin. #}
    data-uuid="{{ session.uuid }}"
    {# Les TROIS attributs de partage, jamais un seul : shared--share-link#writeBack lit
       data-shared AVANT de le réécrire pour distinguer un vrai changement d'une simple
       bascule. Un dataset à moitié initialisé rendrait la PREMIÈRE révocation inopérante
       (lecture `undefined` au lieu de '1' → conclusion « rien n'a changé »). #}
    data-shared="{{ session.isShared ? '1' : '0' }}"
    data-share-download="{{ session.isShareDownloadEnabled ? '1' : '0' }}"
    data-share-url="{{ session.isShared ? url('app_public_serenia_show', {token: session.shareToken}) : '' }}"
    title="{{ title }}"
>
    {# Pastille « Partagé » — ICÔNE SEULE, EN TÊTE DE LIGNE. Le mot « Partagé » rendu
       après le titre mangeait la largeur d'une sidebar de 220 px et tronquait le titre
       à « Explication fi… ». L'icône seule, à gauche, coûte une largeur fixe et minime,
       et ne déplace rien quand elle est masquée (un élément en display:none ne produit
       ni boîte ni gap flex).

       TOUJOURS RENDUE, jamais sous une condition : shared--share-link#writeBack bascule son
       `style.display` SANS RECHARGEMENT, après l'avoir retrouvée PAR DESCENDANCE de la
       conv-item (card.querySelector('[data-share-badge]')). Un rendu conditionnel la
       rendrait introuvable pour toute discussion partagée en cours de page.

       #writeBack réaffiche en écrivant `display = ''` — il RETIRE le style inline et
       laisse la classe reprendre la main : `inline-flex` doit donc rester dans la classe,
       pas dans le style inline.

       Le mot ayant disparu, l'information passe par un `title` (souris) et un texte
       `sr-only` (lecteurs d'écran) — l'icône, elle, est rendue aria-hidden par l'atome. #}
    <span class="shrink-0 inline-flex items-center text-gray-400 [&_svg]:w-3 [&_svg]:h-3"
          data-share-badge
          title="Discussion partagée par lien public"
          style="{{ session.isShared ? '' : 'display:none' }}">
        {% include '_atoms/icon/icon.html.twig' with { name: 'share', size: 'xs', color: 'current' } only %}
        <span class="sr-only">Partagée par lien public</span>
    </span>

    {# Titre #}
    <span class="flex-1 text-[12px] truncate leading-snug transition-colors duration-medium
                 {{ isActive ? 'text-cohorts-dark font-semibold' : 'text-gray-500 group-hover:text-cohorts-dark' }}">
        {{ title }}
    </span>

    {# Bouton 3 points — visible au hover, appel direct au sidebar controller #}
    <button
        type="button"
        class="opacity-0 group-hover:opacity-100 w-[18px] h-[18px] flex items-center justify-center rounded
               cursor-pointer text-cohorts-dark hover:bg-cohorts/[0.12] transition-all duration-fast shrink-0"
        data-action="click->{{ controllerName }}#showSessionMenu"
        data-session-uuid="{{ session.uuid }}"
        data-session-title="{{ title|e('html_attr') }}"
        title="Options"
    >
        {% include '_atoms/icon/icon.html.twig' with { name: 'dots-vertical', size: 'xs', color: 'current' } only %}
    </button>
</div>