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

{% block title %}Intégrations — Admin{% endblock %}
{% block page_title %}Intégrations{% endblock %}
{% block page_subtitle %}Clés API et configuration des services externes{% endblock %}

{% block admin_body %}

<nav class="adm-breadcrumb">
    <svg viewBox="0 0 24 24"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
    <a href="{{ path('app_admin') }}">Dashboard</a>
    <span class="adm-bc-sep">›</span>
    <span class="adm-bc-current">Intégrations</span>
</nav>

{{ form_start(form, {'attr': {'id': 'adm-integ-form', 'novalidate': 'novalidate', 'data-original': original|json_encode(constant('JSON_HEX_TAG') b-or constant('JSON_HEX_AMP'))}}) }}

<div class="adm-param-grid" style="grid-template-columns:repeat(2,1fr)">

    {# ── Mailer ── #}
    <div class="adm-card adm-param-card">
        <div class="adm-form-fields">
            <h3 class="adm-param-title">
                <svg viewBox="0 0 24 24" style="width:18px;height:18px;stroke:var(--accent);fill:none;stroke-width:1.8;vertical-align:-3px;margin-right:6px"><rect x="2" y="4" width="20" height="16" rx="2"/><path d="M2 7l10 7 10-7"/></svg>
                Mailer
            </h3>
            <div class="adm-field">
                <label>DSN</label>
                {{ form_widget(form.mailerDsn) }}
                <div data-error="mailerDsn">{{ form_errors(form.mailerDsn) }}</div>
                <span style="font-size:.7rem;color:var(--muted)">Ex : smtp://user:pass@smtp.mailtrap.io:2525</span>
            </div>
            <div class="adm-field">
                <label>Email expéditeur</label>
                {{ form_widget(form.mailerSenderEmail) }}
                <div data-error="mailerSenderEmail">{{ form_errors(form.mailerSenderEmail) }}</div>
            </div>
            <div class="adm-field">
                <label>Nom expéditeur</label>
                {{ form_widget(form.mailerSenderName) }}
                <div data-error="mailerSenderName">{{ form_errors(form.mailerSenderName) }}</div>
            </div>
        </div>
    </div>

    {# ── Google OAuth ── #}
    <div class="adm-card adm-param-card">
        <div class="adm-form-fields">
            <h3 class="adm-param-title">
                <svg width="18" height="18" viewBox="0 0 24 24" style="vertical-align:-3px;margin-right:6px">
                    <path d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z" fill="#4285F4"/>
                    <path d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" fill="#34A853"/>
                    <path d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z" fill="#FBBC05"/>
                    <path d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z" fill="#EA4335"/>
                </svg>
                Google OAuth
            </h3>
            <div style="margin-bottom:14px">
                <label class="adm-toggle-row">
                    <span class="adm-toggle-info">
                        <span class="adm-toggle-label">Connexion Google</span>
                        <span class="adm-toggle-hint">Autoriser la connexion via Google</span>
                    </span>
                    <span class="adm-toggle-wrap">
                        {{ form_widget(form.googleAuthEnabled, {'attr': {'class': 'adm-toggle-input'}}) }}
                        <span class="adm-toggle-slider"></span>
                    </span>
                </label>
            </div>
            <div class="adm-field">
                <label>Client ID</label>
                {{ form_widget(form.googleClientId) }}
                <div data-error="googleClientId">{{ form_errors(form.googleClientId) }}</div>
            </div>
            <div class="adm-field">
                <label>Client Secret</label>
                {{ form_widget(form.googleClientSecret) }}
                <div data-error="googleClientSecret">{{ form_errors(form.googleClientSecret) }}</div>
            </div>
        </div>
    </div>

</div>

<div style="margin-top:12px;display:flex;gap:8px;align-items:center">
    <button type="submit" class="adm-btn adm-btn-p" id="adm-integ-submit">
        <svg class="btn-icon-save" viewBox="0 0 24 24" style="width:14px;height:14px;margin-right:4px"><polyline points="20 6 9 17 4 12"/></svg>
        Enregistrer les intégrations
    </button>
    <div style="display:flex;gap:6px;margin-left:auto">
        {% if is_granted('ROLE_SUPER_ADMIN') %}
        <a href="{{ path('app_admin_integration_export_sql') }}" class="adm-btn adm-btn-g adm-btn-sm">
            <svg viewBox="0 0 24 24" style="margin-right:4px"><path d="M4 7V4a2 2 0 0 1 2-2h8.5L20 7.5V20a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-3"/><polyline points="14 2 14 8 20 8"/><path d="M4 15h9"/><polyline points="10 12 7 15 10 18"/></svg>
            SQL
        </a>
        {% endif %}
        <a href="{{ path('app_admin_integration_export') }}" class="adm-btn adm-btn-g adm-btn-sm">
            <svg viewBox="0 0 24 24" style="margin-right:4px"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>
            CSV
        </a>
    </div>
</div>

{{ form_end(form) }}

{% endblock %}

{% block javascripts %}
{{ parent() }}
<script src="{{ asset('js/admin-integration.js') }}"></script>
{% endblock %}