{% extends 'admin/_layout.html.twig' %}

{% block title %}Synchronisation - Administration - Association E-Cosplay{% endblock %}

{% block admin_content %}
<div class="page-container">
    <h1 class="text-2xl font-bold heading-page mb-8">Synchronisation</h1>

    {% for type, messages in app.flashes %}
        {% for message in messages %}
            <div class="mb-6 p-4 glass font-medium text-sm {{ type == 'success' ? 'border-green-300 text-green-800' : 'border-red-300 text-red-800' }}">
                {{ message }}
            </div>
        {% endfor %}
    {% endfor %}

    <div class="flex flex-col gap-6">

        {# Sync tout #}
        <div class="glass p-6">
            <div class="flex items-center justify-between">
                <div>
                    <h2 class="font-bold uppercase text-sm">Synchronisation complete</h2>
                    <p class="text-xs text-gray-500 mt-1">Reindexe tous les clients, revendeurs et tarifs dans Meilisearch.</p>
                </div>
                <form method="post" action="{{ path('app_admin_sync_all') }}" data-confirm="Lancer la synchronisation complete ?">
                    <button type="submit" class="px-6 py-3 btn-gold font-bold uppercase text-xs tracking-wider hover:shadow-[2px_2px_0px_rgba(0,0,0,1)] active:shadow-none active:translate-x-1 active:translate-y-1">
                        Tout synchroniser
                    </button>
                </form>
            </div>
        </div>

        {# Purge tous les index #}
        <div class="glass p-6" style="border-color: #dc2626;">
            <div class="flex items-center justify-between">
                <div>
                    <h2 class="font-bold uppercase text-sm text-red-700">Purger tous les index</h2>
                    <p class="text-xs text-gray-500 mt-1">Supprime tous les documents de tous les index Meilisearch. Utilisez "Tout synchroniser" ensuite pour reconstruire.</p>
                </div>
                <form method="post" action="{{ path('app_admin_sync_purge_indexes') }}" data-confirm="Purger TOUS les index Meilisearch ? Tous les documents seront supprimes. Vous devrez relancer une synchronisation complete.">
                    <button type="submit" class="px-6 py-3 bg-red-600 text-white font-bold uppercase text-xs tracking-wider hover:bg-red-700 transition-all">
                        Purger tout
                    </button>
                </form>
            </div>
        </div>

        {# Sync clients #}
        <div class="glass p-6">
            <div class="flex items-center justify-between">
                <div class="flex items-center gap-4">
                    <div class="w-12 h-12 bg-indigo-100 border-2 border-indigo-600 flex items-center justify-center">
                        <svg class="w-6 h-6 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0z"/></svg>
                    </div>
                    <div>
                        <h2 class="font-bold uppercase text-sm">Clients</h2>
                        <p class="text-xs text-gray-500">Index Meilisearch : <strong>customer</strong></p>
                        <p class="text-xs text-gray-400 mt-0.5">{{ totalCustomers }} en base / {{ msCustomers }} indexe(s)</p>
                    </div>
                </div>
                <form method="post" action="{{ path('app_admin_sync_customers') }}">
                    <button type="submit" class="px-4 py-2 btn-glass text-indigo-600 font-bold uppercase text-[10px] tracking-wider">
                        Synchroniser
                    </button>
                </form>
            </div>
        </div>

        {# Sync contacts #}
        <div class="glass p-6">
            <div class="flex items-center justify-between">
                <div class="flex items-center gap-4">
                    <div class="w-12 h-12 bg-violet-100 border-2 border-violet-600 flex items-center justify-center">
                        <svg class="w-6 h-6 text-violet-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"/></svg>
                    </div>
                    <div>
                        <h2 class="font-bold uppercase text-sm">Contacts</h2>
                        <p class="text-xs text-gray-500">Index Meilisearch : <strong>customer_contact</strong></p>
                        <p class="text-xs text-gray-400 mt-0.5">{{ totalContacts }} en base / {{ msContacts }} indexe(s)</p>
                    </div>
                </div>
                <form method="post" action="{{ path('app_admin_sync_contacts') }}">
                    <button type="submit" class="px-4 py-2 btn-glass text-violet-600 font-bold uppercase text-[10px] tracking-wider">
                        Synchroniser
                    </button>
                </form>
            </div>
        </div>

        {# Sync Factures #}
        <div class="glass p-6">
            <div class="flex items-center justify-between">
                <div class="flex items-center gap-4">
                    <div class="w-12 h-12 bg-teal-100 border-2 border-teal-600 flex items-center justify-center">
                        <svg class="w-6 h-6 text-teal-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 14l6-6m-5.5.5h.01m4.99 5h.01M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16l3.5-2 3.5 2 3.5-2 3.5 2z"/></svg>
                    </div>
                    <div>
                        <h2 class="font-bold uppercase text-sm">Factures</h2>
                        <p class="text-xs text-gray-500">Index Meilisearch : <strong>customer_facture</strong></p>
                        <p class="text-xs text-gray-400 mt-0.5">{{ totalFactures }} en base / {{ msFactures }} indexe(s)</p>
                    </div>
                </div>
                <form method="post" action="{{ path('app_admin_sync_factures') }}">
                    <button type="submit" class="px-4 py-2 btn-glass text-teal-600 font-bold uppercase text-[10px] tracking-wider">
                        Synchroniser
                    </button>
                </form>
            </div>
        </div>

        {# Sync NDD #}
        <div class="glass p-6">
            <div class="flex items-center justify-between">
                <div class="flex items-center gap-4">
                    <div class="w-12 h-12 bg-slate-100 border-2 border-slate-600 flex items-center justify-center">
                        <svg class="w-6 h-6 text-slate-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9"/></svg>
                    </div>
                    <div>
                        <h2 class="font-bold uppercase text-sm">Noms de domaine</h2>
                        <p class="text-xs text-gray-500">Index Meilisearch : <strong>customer_ndd</strong></p>
                        <p class="text-xs text-gray-400 mt-0.5">{{ totalDomains }} en base / {{ msDomains }} indexe(s)</p>
                    </div>
                </div>
                <form method="post" action="{{ path('app_admin_sync_domains') }}">
                    <button type="submit" class="px-4 py-2 btn-glass text-slate-600 font-bold uppercase text-[10px] tracking-wider">
                        Synchroniser
                    </button>
                </form>
            </div>
        </div>

        {# Sync Websites #}
        <div class="glass p-6">
            <div class="flex items-center justify-between">
                <div class="flex items-center gap-4">
                    <div class="w-12 h-12 bg-blue-100 border-2 border-blue-600 flex items-center justify-center">
                        <svg class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/></svg>
                    </div>
                    <div>
                        <h2 class="font-bold uppercase text-sm">Sites Internet</h2>
                        <p class="text-xs text-gray-500">Index Meilisearch : <strong>customer_website</strong></p>
                        <p class="text-xs text-gray-400 mt-0.5">{{ totalWebsites }} en base / {{ msWebsites }} indexe(s)</p>
                    </div>
                </div>
                <form method="post" action="{{ path('app_admin_sync_websites') }}">
                    <button type="submit" class="px-4 py-2 btn-glass text-blue-600 font-bold uppercase text-[10px] tracking-wider">
                        Synchroniser
                    </button>
                </form>
            </div>
        </div>

        {# Sync Devis #}
        <div class="glass p-6">
            <div class="flex items-center justify-between">
                <div class="flex items-center gap-4">
                    <div class="w-12 h-12 bg-amber-100 border-2 border-amber-600 flex items-center justify-center">
                        <svg class="w-6 h-6 text-amber-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg>
                    </div>
                    <div>
                        <h2 class="font-bold uppercase text-sm">Devis</h2>
                        <p class="text-xs text-gray-500">Index Meilisearch : <strong>customer_devis</strong></p>
                        <p class="text-xs text-gray-400 mt-0.5">{{ totalDevis }} en base / {{ msDevis }} indexe(s)</p>
                    </div>
                </div>
                <form method="post" action="{{ path('app_admin_sync_devis') }}">
                    <button type="submit" class="px-4 py-2 btn-glass text-amber-600 font-bold uppercase text-[10px] tracking-wider">
                        Synchroniser
                    </button>
                </form>
            </div>
        </div>

        {# Sync Avis de paiement #}
        <div class="glass p-6">
            <div class="flex items-center justify-between">
                <div class="flex items-center gap-4">
                    <div class="w-12 h-12 bg-emerald-100 border-2 border-emerald-600 flex items-center justify-center">
                        <svg class="w-6 h-6 text-emerald-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4"/></svg>
                    </div>
                    <div>
                        <h2 class="font-bold uppercase text-sm">Avis de paiement</h2>
                        <p class="text-xs text-gray-500">Index Meilisearch : <strong>customer_advert</strong></p>
                        <p class="text-xs text-gray-400 mt-0.5">{{ totalAdverts }} en base / {{ msAdverts }} indexe(s)</p>
                    </div>
                </div>
                <form method="post" action="{{ path('app_admin_sync_adverts') }}">
                    <button type="submit" class="px-4 py-2 btn-glass text-emerald-600 font-bold uppercase text-[10px] tracking-wider">
                        Synchroniser
                    </button>
                </form>
            </div>
        </div>

        {# Sync revendeurs #}
        <div class="glass p-6">
            <div class="flex items-center justify-between">
                <div class="flex items-center gap-4">
                    <div class="w-12 h-12 bg-orange-100 border-2 border-orange-600 flex items-center justify-center">
                        <svg class="w-6 h-6 text-orange-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"/></svg>
                    </div>
                    <div>
                        <h2 class="font-bold uppercase text-sm">Revendeurs</h2>
                        <p class="text-xs text-gray-500">Index Meilisearch : <strong>reseller</strong></p>
                        <p class="text-xs text-gray-400 mt-0.5">{{ totalRevendeurs }} en base / {{ msResellers }} indexe(s)</p>
                    </div>
                </div>
                <form method="post" action="{{ path('app_admin_sync_revendeurs') }}">
                    <button type="submit" class="px-4 py-2 border-2 border-orange-600 bg-white text-orange-600 font-bold uppercase text-[10px] tracking-widest hover:bg-orange-600 hover:text-white transition-all">
                        Synchroniser
                    </button>
                </form>
            </div>
        </div>

        {# Sync tarifs Meilisearch #}
        <div class="glass p-6">
            <div class="flex items-center justify-between">
                <div class="flex items-center gap-4">
                    <div class="w-12 h-12 bg-green-500/20 flex items-center justify-center">
                        <svg class="w-6 h-6 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
                    </div>
                    <div>
                        <h2 class="font-bold uppercase text-sm">Tarifs - Meilisearch</h2>
                        <p class="text-xs text-gray-500">Index : <strong>price_auto</strong></p>
                        <p class="text-xs text-gray-400 mt-0.5">{{ totalPrices }} tarif(s) en base</p>
                    </div>
                </div>
                <form method="post" action="{{ path('app_admin_sync_prices') }}">
                    <button type="submit" class="px-4 py-2 btn-glass text-green-600 font-bold uppercase text-[10px] tracking-wider">
                        Synchroniser
                    </button>
                </form>
            </div>
        </div>

        <div class="mt-8 mb-4">
            <h2 class="text-xl font-bold uppercase">Stripe</h2>
        </div>

        {# Sync Stripe tarifs #}
        <div class="glass p-6">
            <div class="flex items-center justify-between">
                <div class="flex items-center gap-4">
                    <div class="w-12 h-12 bg-purple-500/20 flex items-center justify-center">
                        <svg class="w-6 h-6 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z"/></svg>
                    </div>
                    <div>
                        <h2 class="font-bold uppercase text-sm">Tarifs - Stripe</h2>
                        <p class="text-xs text-gray-500">Cree les produits et prix dans Stripe</p>
                        <p class="text-xs mt-0.5">
                            <span class="text-green-600 font-bold">{{ stripeSynced }} sync</span>
                            {% if stripeNotSynced > 0 %}
                                <span class="text-red-600 font-bold ml-2">{{ stripeNotSynced }} non sync</span>
                            {% endif %}
                            <span class="text-gray-400 ml-1">/ {{ totalPrices }} total</span>
                        </p>
                    </div>
                </div>
                <form method="post" action="{{ path('app_admin_sync_stripe_prices') }}" data-confirm="Synchroniser tous les tarifs avec Stripe ? Les produits et prix seront crees ou mis a jour.">
                    <button type="submit" class="px-4 py-2 btn-glass text-purple-600 font-bold uppercase text-[10px] tracking-wider">
                        Synchroniser Stripe
                    </button>
                </form>
            </div>
        </div>

        {# Sync Stripe Clients #}
        <div class="glass p-6">
            <div class="flex items-center justify-between">
                <div class="flex items-center gap-4">
                    <div class="w-12 h-12 bg-cyan-500/20 flex items-center justify-center">
                        <svg class="w-6 h-6 text-cyan-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0z"/></svg>
                    </div>
                    <div>
                        <h2 class="font-bold uppercase text-sm">Clients - Stripe</h2>
                        <p class="text-xs text-gray-500">Cree ou met a jour les clients dans Stripe (email, nom, adresse, SIRET, TVA)</p>
                        <p class="text-xs mt-0.5">
                            <span class="text-green-600 font-bold">{{ customersSynced }} sync</span>
                            {% if customersNotSynced > 0 %}
                                <span class="text-red-600 font-bold ml-2">{{ customersNotSynced }} non sync</span>
                            {% endif %}
                            <span class="text-gray-400 ml-1">/ {{ totalCustomers }} total</span>
                        </p>
                    </div>
                </div>
                <form method="post" action="{{ path('app_admin_sync_stripe_customers') }}" data-confirm="Synchroniser tous les clients avec Stripe ?">
                    <button type="submit" class="px-4 py-2 btn-glass text-cyan-600 font-bold uppercase text-[10px] tracking-wider">
                        Synchroniser Stripe
                    </button>
                </form>
            </div>
        </div>

        {# Sync Stripe Webhooks #}
        <div class="glass p-6">
            <div class="flex items-center justify-between flex-wrap gap-4">
                <div class="flex items-center gap-4">
                    <div class="w-12 h-12 bg-blue-500/20 flex items-center justify-center">
                        <svg class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"/></svg>
                    </div>
                    <div>
                        <h2 class="font-bold uppercase text-sm">Webhooks Stripe</h2>
                        <p class="text-xs text-gray-500">Cree les 4 endpoints : main light/instant + connect light/instant</p>
                        <p class="text-xs mt-0.5">
                            <span class="font-bold {{ webhookSecrets|length >= 4 ? 'text-green-600' : (webhookSecrets|length > 0 ? 'text-orange-600' : 'text-red-600') }}">{{ webhookSecrets|length }}/4 configure(s)</span>
                        </p>
                    </div>
                </div>
                <form method="post" action="{{ path('app_admin_sync_stripe_webhooks') }}" data-confirm="Creer les webhooks Stripe ? Les secrets seront sauvegardes dans .env.local">
                    <button type="submit" class="px-4 py-2 btn-glass text-blue-600 font-bold uppercase text-[10px] tracking-wider">
                        Creer les webhooks
                    </button>
                </form>
            </div>
            <div class="mt-3 text-[10px] text-gray-400 space-y-0.5">
                <p>&#8226; /webhooks/stripe/main/light - evenements legers (customer, product, invoice, subscription)</p>
                <p>&#8226; /webhooks/stripe/main/instant - evenements critiques (paiements, checkout, litiges)</p>
                <p>&#8226; /webhooks/stripe/connect/light - evenements Connect (account, transfer, payout)</p>
                <p>&#8226; /webhooks/stripe/connect/instant - evenements Connect critiques (paiements, checkout)</p>
            </div>
        </div>

    </div>
</div>
{% endblock %}
