{% extends 'layout/app.html.twig' %}

{% block title %}{{ user.fullName }}{% endblock %}
{% block page_title %}{{ user.fullName }}{% endblock %}

{% block page_actions %}
    <a href="{{ path('app_user_index') }}" class="btn btn-secondary">← Retour à la liste</a>
    {% if is_granted('USER_EDIT', user) %}
        <a href="{{ path('app_user_edit', {id: user.id}) }}" class="btn btn-primary">Modifier</a>
    {% endif %}
{% endblock %}

{% block content %}
    <div class="grid gap-6 lg:grid-cols-3">
        <div class="space-y-6">
            <div class="card p-6">
                <div class="flex items-center gap-4">
                    <span class="flex h-14 w-14 items-center justify-center rounded-full bg-brand-100 text-lg font-bold text-brand-800">{{ user.initials }}</span>
                    <div>
                        <p class="text-lg font-semibold text-slate-900">{{ user.fullName }}</p>
                        <span class="badge {{ user.mainRole.badgeClass }}">{{ user.mainRole.label }}</span>
                    </div>
                </div>
                <dl class="mt-6 space-y-3 text-sm">
                    <div class="flex justify-between gap-4"><dt class="text-slate-500">Email</dt><dd class="text-right font-medium break-all">{{ user.email }}</dd></div>
                    <div class="flex justify-between gap-4"><dt class="text-slate-500">Téléphone</dt><dd class="font-medium">{{ user.phone ?: '—' }}</dd></div>
                    <div class="flex justify-between gap-4"><dt class="text-slate-500">Statut</dt><dd>{{ include('user/_status.html.twig') }}</dd></div>
                    <div class="flex justify-between gap-4"><dt class="text-slate-500">Créé le</dt><dd class="font-medium">{{ user.createdAt|date }}</dd></div>
                    <div class="flex justify-between gap-4"><dt class="text-slate-500">Créé par</dt><dd class="font-medium">{{ user.createdBy ? user.createdBy.fullName : '—' }}</dd></div>
                    <div class="flex justify-between gap-4"><dt class="text-slate-500">Dernière connexion</dt><dd class="font-medium">{{ user.lastLoginAt ? user.lastLoginAt|date : 'Jamais' }}</dd></div>
                </dl>
            </div>

            <div class="card space-y-3 p-6">
                <h2 class="font-semibold text-slate-900">Actions</h2>
                {% if is_granted('USER_RESET_PASSWORD', user) %}
                    <form method="post" action="{{ path('app_user_reset_password', {id: user.id}) }}"
                          data-turbo-confirm="Générer un nouveau mot de passe temporaire pour {{ user.fullName }} ? L'ancien ne fonctionnera plus.">
                        <input type="hidden" name="_token" value="{{ csrf_token('reset-password-' ~ user.id) }}">
                        <button type="submit" class="btn btn-secondary w-full">Envoyer un mot de passe temporaire</button>
                    </form>
                {% endif %}
                {% if is_granted('USER_BLOCK', user) %}
                    {% if user.active %}
                        <form method="post" action="{{ path('app_user_block', {id: user.id}) }}"
                              data-turbo-confirm="Bloquer le compte de {{ user.fullName }} ? Il sera immédiatement déconnecté.">
                            <input type="hidden" name="_token" value="{{ csrf_token('block-user-' ~ user.id) }}">
                            <button type="submit" class="btn btn-danger w-full">Bloquer le compte</button>
                        </form>
                    {% else %}
                        <form method="post" action="{{ path('app_user_unblock', {id: user.id}) }}">
                            <input type="hidden" name="_token" value="{{ csrf_token('unblock-user-' ~ user.id) }}">
                            <button type="submit" class="btn btn-primary w-full">Débloquer le compte</button>
                        </form>
                    {% endif %}
                {% endif %}
            </div>
        </div>

        <div class="card lg:col-span-2">
            <div class="border-b border-slate-100 px-5 py-4">
                <h2 class="font-semibold text-slate-900">Historique d'activité</h2>
            </div>
            {{ include('components/_activity_list.html.twig', {logs: activity}) }}
        </div>
    </div>
{% endblock %}