{#
 # FRAGMENT PROMPTLY — Ligne de dossier (style Google Drive)
 # Variables attendues : folder (PromptlyFolder), isLast (bool, optionnel)
 # NE doit PAS étendre base.html.twig
 #}

<div class="group relative flex items-center gap-4 px-5 py-3 hover:bg-amber-50/30
            {{ not isLast ? 'border-b border-gray-100' : '' }} transition-colors duration-100
            cursor-grab active:cursor-grabbing"
     draggable="true"
     data-drop-folder-id="{{ folder.id }}"
     data-folder-id="{{ folder.id }}"
     data-folder-name="{{ folder.name|e('html_attr') }}"
     data-action="dragstart->promptly--mes-prompts#folderDragStart dragend->promptly--mes-prompts#folderDragEnd">

    {# Icône dossier #}
    <div class="shrink-0 w-8 h-8 rounded-lg flex items-center justify-center bg-amber-100/70">
        <span class="inline-flex items-center justify-center text-amber-500">
            {% include '_atoms/icon/icon.html.twig' with { name: 'folder', size: 'sm', color: 'current' } only %}
        </span>
    </div>

    {# Nom — cliquable #}
    <a href="{{ path('app_promptly_my_prompts', { folder: folder.id }) }}"
       draggable="false"
       class="flex-1 min-w-0 text-[14px] font-medium text-gray-800 hover:text-primary truncate transition-colors duration-150">
        {{ folder.name }}
    </a>

    {# Nombre de prompts dans ce dossier #}
    {% set pc = promptCount is defined ? promptCount : 0 %}
    <div class="w-32 shrink-0 hidden xl:block"
         data-folder-count-wrapper="{{ folder.id }}"
         data-count="{{ pc }}">
        {% if pc > 0 %}
            <span class="inline-flex items-center gap-1.5 text-[12px] font-medium text-amber-600">
                <span class="w-1.5 h-1.5 rounded-full bg-amber-400 shrink-0"></span>
                {{ pc }} prompt{{ pc > 1 ? 's' : '' }}
            </span>
        {% else %}
            <span class="text-[12px] text-gray-300">Vide</span>
        {% endif %}
    </div>

    {# Favoris — vide pour les dossiers #}
    <div class="w-20 shrink-0 hidden xl:block">
        <span class="text-[12px] text-gray-300">—</span>
    </div>

    {# Utilisations — vide pour les dossiers #}
    <div class="w-20 shrink-0 hidden xl:block">
        <span class="text-[12px] text-gray-300">—</span>
    </div>

    {# Date #}
    <span class="w-28 text-right text-[12px] text-gray-400 shrink-0 hidden lg:block">
        {{ folder.createdAt|date('d/m/y') }}
    </span>

    {# ⋮ Actions #}
    <div class="w-10 shrink-0 flex items-center justify-end">
        {% set folderDeleteAttr = {
            'data-action': 'click->promptly--mes-prompts#openDelete',
            'data-folder-id': folder.id,
            'data-folder-name': folder.name
        } %}
        {% if folder.parent is not null %}
            {% set folderDeleteAttr = folderDeleteAttr|merge({'data-folder-parent-id': folder.parent.id}) %}
        {% endif %}
        {% include '_molecules/action-menu/action-menu.html.twig' with {
            withTrigger: true,
            position: 'right-0 top-full mt-1',
            items: [
                {label: 'Renommer', icon: 'edit', attr: {'data-action': 'click->promptly--mes-prompts#openRename', 'data-folder-id': folder.id, 'data-folder-name': folder.name}}
            ],
            dangerItems: [
                {label: 'Supprimer', icon: 'trash', attr: folderDeleteAttr}
            ],
            accentHex: tool_color_details['promptly'].primary
        } only %}
    </div>
</div>