{% extends '@Communication/communication/layout.html.twig' %}

{% block communication_title %}Publications · Communication{% endblock %}
{% block communication_header %}{% endblock %}

{% set statusLabels = {
    published:'Publiée',scheduled:'Planifiée',draft:'Brouillon',failed:'Échec'
} %}
{% set platformLabels = {generic:'Générique',linkedin:'LinkedIn',twitter:'X / Twitter',instagram:'Instagram',facebook:'Facebook'} %}
{% set platformIcons = {generic:'solar:global-broken',linkedin:'mdi:linkedin',twitter:'ri:twitter-x-fill',instagram:'mdi:instagram',facebook:'mdi:facebook'} %}

{% block communication_content %}
<div data-controller="communication-post-index">
    <header class="capsule-heading">
        <div class="capsule-heading-main">
            <div class="capsule-heading-content">
                <h1 class="capsule-heading-title">Publications</h1>
                <p class="capsule-heading-subtitle">{{ 'now'|date('d/m/Y') }} — Gérez l’ensemble de vos contenus éditoriaux.</p>
            </div>
        </div>
        {% if is_granted('COMMUNICATION_CREATE') %}
            <a class="capsule-button capsule-button--primary" href="{{ path('communication_post_new') }}"><iconify-icon icon="solar:add-circle-linear"></iconify-icon>Nouvelle publication</a>
        {% endif %}
    </header>

    <section class="cpost-kpis data-kpis-5" aria-label="Indicateurs des publications">
        {% set kpis = [
            {label:'Toutes',value:index.counts.all,note:'contenus actifs',tone:'default'},
            {label:'Publiées',value:index.counts.published,note:index.successRate is not null ? index.successRate ~ '% de réussite' : 'aucun envoi terminé',tone:'green'},
            {label:'Planifiées',value:index.counts.scheduled,note:'à publier prochainement',tone:'amber'},
            {label:'Brouillons',value:index.counts.draft,note:'pas encore publiés',tone:'slate'},
            {label:'Échecs',value:index.counts.failed,note:index.counts.failed ? 'nécessitent votre attention' : 'aucun incident',tone:'red'}
        ] %}
        {% for kpi in kpis %}
            {% set capsuleTone = {default:'indigo',green:'green',amber:'yellow',orange:'orange',slate:'gray',red:'red'}[kpi.tone]|default('gray') %}
            <article class="is-{{ kpi.tone }} data-kpi data-kpi--{{ capsuleTone }}"><div><span>{{ kpi.label }}</span><strong>{{ kpi.value }}</strong><small>{{ kpi.note }}</small></div></article>
        {% endfor %}
    </section>

    <section class="cpost-filters">
        <label class="cpost-search"><iconify-icon icon="solar:magnifer-linear"></iconify-icon><input type="search" placeholder="Rechercher une publication…" data-communication-post-index-target="search" data-action="input->communication-post-index#filter"></label>
        <select data-communication-post-index-target="status" data-action="change->communication-post-index#filter">
            <option value="">Tous les statuts</option>
            {% for key, label in statusLabels %}<option value="{{ key }}">{{ label }}</option>{% endfor %}
        </select>
        <select data-communication-post-index-target="platform" data-action="change->communication-post-index#filter">
            <option value="">Toutes les plateformes</option>
            {% for key, label in platformLabels %}<option value="{{ key }}">{{ label }}</option>{% endfor %}
        </select>
        <select data-communication-post-index-target="campaign" data-action="change->communication-post-index#filter">
            <option value="">Toutes les campagnes</option>
            {% for campaign in index.campaigns %}<option value="{{ campaign.idtoken }}">{{ campaign.name }}</option>{% endfor %}
        </select>
        <select data-communication-post-index-target="author" data-action="change->communication-post-index#filter">
            <option value="">Tous les auteurs</option>
            {% for author in index.authors %}<option value="{{ author.id }}">{{ author }}</option>{% endfor %}
        </select>
        <input class="cpost-date" type="date" aria-label="Date de publication" data-communication-post-index-target="date" data-action="change->communication-post-index#filter">
        <button class="cpost-reset" type="button" data-action="communication-post-index#reset"><iconify-icon icon="solar:restart-linear"></iconify-icon>Réinitialiser</button>
    </section>

    <form method="post" action="{{ path('communication_post_bulk') }}" data-communication-post-index-target="bulkForm">
        <input type="hidden" name="_token" value="{{ csrf_token('communication_post_bulk') }}">
        <section class="cpost-bulk" data-communication-post-index-target="bulkBar" hidden>
            <strong><iconify-icon icon="solar:check-square-bold"></iconify-icon><span data-communication-post-index-target="selectedCount">0</span> publication(s) sélectionnée(s)</strong>
            <div>
                {% if is_granted('COMMUNICATION_ARCHIVE') %}<button type="submit" name="action" value="archive"><iconify-icon icon="solar:archive-down-linear"></iconify-icon>Archiver</button>{% endif %}
                {% if is_granted('COMMUNICATION_EDIT') %}<button type="submit" name="action" value="duplicate"><iconify-icon icon="solar:copy-linear"></iconify-icon>Dupliquer</button>{% endif %}
                {% if is_granted('COMMUNICATION_EDIT') %}<button type="button" data-action="communication-post-index#openVariant"><iconify-icon icon="solar:magic-stick-3-linear"></iconify-icon>Créer une variante</button>{% endif %}
            </div>
        </section>

        <section class="cpost-table-wrap communication-panel communication-table">
            <table class="cpost-table">
                <thead>
                    <tr>
                        <th><input type="checkbox" aria-label="Tout sélectionner" data-communication-post-index-target="selectAll" data-action="change->communication-post-index#toggleAll"></th>
                        <th>Titre</th><th>Campagne</th><th>Plateforme</th><th>Date planifiée</th>
                        <th>Statut</th><th>Auteur</th><th>Statistiques</th><th>Actions</th>
                    </tr>
                </thead>
                <tbody>
                {% for row in index.rows %}
                    {% set post = row.post %}
                    <tr class="{{ row.status == 'failed' ? 'is-failed' }}"
                        data-communication-post-index-target="row"
                        data-search="{{ (post.internalTitle ~ ' ' ~ (post.brief ?: '') ~ ' ' ~ (row.author ?: '') ~ ' ' ~ (row.campaign ? row.campaign.name : ''))|lower|e('html_attr') }}"
                        data-status="{{ row.status }}"
                        data-platform="{{ row.platform }}"
                        data-campaign="{{ row.campaign ? row.campaign.idtoken : '' }}"
                        data-author="{{ row.author ? row.author.id : '' }}"
                        data-date="{{ row.scheduledAt ? row.scheduledAt|date('Y-m-d') : '' }}">
                        <td><input type="checkbox" name="posts[]" value="{{ post.idtoken }}"
                                   data-communication-post-index-target="checkbox"
                                   data-variant-url="{{ path('communication_variant_new',{postToken:post.idtoken}) }}"
                                   data-action="change->communication-post-index#selectionChanged"></td>
                        <td>
                            <div class="cpost-title-cell">
                                <i class="is-{{ row.status }}"><iconify-icon icon="{{ row.status == 'draft' ? 'solar:document-text-linear' : 'solar:pen-new-square-bold-duotone' }}"></iconify-icon></i>
                                <span>
                                    <a href="{{ path('communication_post_show',{idtoken:post.idtoken}) }}">{{ post.internalTitle }}</a>
                                    <small>
                                        {% if row.status == 'published' and row.publication.publishedAt|default(null) %}Publiée le {{ row.publication.publishedAt|date('d/m/Y à H:i') }}
                                        {% elseif row.status == 'failed' and row.publication.failedAt|default(null) %}Échec le {{ row.publication.failedAt|date('d/m/Y à H:i') }}
                                        {% else %}Modifiée le {{ post.updatedAt|date('d/m/Y à H:i') }}{% endif %}
                                    </small>
                                </span>
                            </div>
                        </td>
                        <td>{% if row.campaign %}<span class="cpost-campaign"><iconify-icon icon="solar:flag-2-linear"></iconify-icon>{{ row.campaign.name }}</span>{% else %}<em>Aucune campagne</em>{% endif %}</td>
                        <td><span class="cpost-platform is-{{ row.platform }}"><i><iconify-icon icon="{{ platformIcons[row.platform]|default(platformIcons.generic) }}"></iconify-icon></i>{{ platformLabels[row.platform]|default(row.platform|capitalize) }}</span></td>
                        <td>{% if row.scheduledAt %}<time>{{ row.scheduledAt|date('d/m/Y') }}<small>{{ row.scheduledAt|date('H:i') }}</small></time>{% else %}<em>Non planifiée</em>{% endif %}</td>
                        <td><span class="cpost-status is-{{ row.status }}"><i></i>{{ statusLabels[row.status]|default(row.status) }}</span></td>
                        <td>{% if row.author %}<span class="cpost-author"><i><img src="{{ user_avatar_url(row.author) }}" alt=""></i>{{ row.author }}</span>{% else %}<em>Non assigné</em>{% endif %}</td>
                        <td><em class="cpost-no-stats">{{ row.status == 'published' ? 'Données sociales indisponibles' : 'Pas encore publiée' }}</em></td>
                        <td>
                            <span class="d-flex gap-2">
                                <a class="link fs-5" href="{{ path('communication_post_show',{idtoken:post.idtoken}) }}" title="Consulter"><iconify-icon icon="solar:eye-linear"></iconify-icon></a>
                                {% if is_granted('COMMUNICATION_EDIT', post) %}<a class="link fs-5" href="{{ (row.variant ? path('communication_variant_edit',{idtoken:row.variant.idtoken}) : path('communication_variant_new',{postToken:post.idtoken})) }}" title="Modifier"><iconify-icon icon="solar:pen-linear"></iconify-icon></a>{% endif %}
                                {% if is_granted('COMMUNICATION_EDIT', post) %}<a class="link fs-5" href="{{ path('communication_variant_new',{postToken:post.idtoken}) }}" title="Créer une variante"><iconify-icon icon="solar:copy-linear"></iconify-icon></a>{% endif %}
                                {% if is_granted('COMMUNICATION_DELETE', post) %}
                                    <button class="link fs-5" type="button" title="Supprimer"
                                            aria-label="Supprimer {{ post.internalTitle }}"
                                            data-action="communication-post-index#openDelete"
                                            data-delete-title="{{ post.internalTitle|e('html_attr') }}"
                                            data-delete-url="{{ path('communication_post_delete',{idtoken:post.idtoken}) }}"
                                            data-delete-token="{{ csrf_token('communication_post_delete_' ~ post.idtoken) }}">
                                        <iconify-icon icon="solar:trash-bin-trash-linear"></iconify-icon>
                                    </button>
                                {% endif %}
                            </span>
                        </td>
                    </tr>
                {% else %}
                    <tr><td colspan="9"><div class="cpost-empty"><iconify-icon icon="solar:document-text-broken"></iconify-icon><strong>Aucune publication enregistrée</strong><span>Créez votre premier contenu éditorial.</span></div></td></tr>
                {% endfor %}
                </tbody>
            </table>
            <div class="cpost-empty" data-communication-post-index-target="filteredEmpty" hidden><iconify-icon icon="solar:magnifer-broken"></iconify-icon><strong>Aucun résultat</strong><span>Modifiez ou réinitialisez les filtres.</span></div>
        </section>
    </form>

    <div class="modal fade cpost-delete-modal" tabindex="-1" aria-labelledby="cpost-delete-title"
         aria-describedby="cpost-delete-description" data-communication-post-index-target="deleteModal">
        <div class="modal-dialog modal-dialog-centered">
            <form class="modal-content" method="post" data-communication-post-index-target="deleteForm">
                <div class="modal-header">
                    <div class="cpost-delete-modal__heading">
                        <i><iconify-icon icon="solar:trash-bin-trash-bold-duotone"></iconify-icon></i>
                        <div>
                            <h2 class="modal-title fs-5" id="cpost-delete-title">Supprimer la publication ?</h2>
                            <p class="mb-0">Cette action est définitive.</p>
                        </div>
                    </div>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Fermer"></button>
                </div>
                <div class="modal-body">
                    <p id="cpost-delete-description">Vous êtes sur le point de supprimer <strong data-communication-post-index-target="deleteTitle"></strong>.</p>
                    <div class="cpost-delete-modal__warning">
                        <iconify-icon icon="solar:danger-triangle-linear"></iconify-icon>
                        <span>Les variantes, planifications et historiques associés seront également supprimés. Une publication déjà diffusée sur un réseau social ne sera pas retirée de ce réseau.</span>
                    </div>
                    <input type="hidden" name="_token" data-communication-post-index-target="deleteToken">
                </div>
                <div class="modal-footer">
                    <button type="button" class="capsule-button capsule-button--secondary" data-bs-dismiss="modal">Annuler</button>
                    <button type="submit" class="capsule-button capsule-button--danger"><iconify-icon icon="solar:trash-bin-trash-linear"></iconify-icon>Supprimer définitivement</button>
                </div>
            </form>
        </div>
    </div>

    <div class="cpost-toast" data-communication-post-index-target="toast" hidden></div>
</div>
{% endblock %}