<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://xmlns.jcp.org/jsf/html"
                xmlns:f="http://xmlns.jcp.org/jsf/core"
                xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
                xmlns:p="http://primefaces.org/ui"
                xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">

    <!--
        Composant réutilisable: Ligne de Log d'Audit (WOU/DRY Pattern)
        
        Auteur: Lions User Manager
        Version: 1.0.0
        Description: Affiche une ligne de log d'audit avec informations détaillées
        
        Paramètres:
        - auditLog: AuditLogDTO (requis) - Le log d'audit à afficher
        - showDetails: Boolean (défaut: false) - Afficher les détails complets
        - showActions: Boolean (défaut: false) - Afficher les actions possibles
        - compact: Boolean (défaut: false) - Mode compact
        - styleClass: String (optionnel) - Classes CSS supplémentaires
        
        Exemples d'utilisation:
        
        1. Ligne simple:
        <ui:include src="/templates/components/audit/audit-log-row.xhtml">
            <ui:param name="auditLog" value="#{log}" />
        </ui:include>
        
        2. Ligne avec détails:
        <ui:include src="/templates/components/audit/audit-log-row.xhtml">
            <ui:param name="auditLog" value="#{log}" />
            <ui:param name="showDetails" value="true" />
        </ui:include>
    -->
    
    <c:set var="showDetails" value="#{empty showDetails ? false : showDetails}" />
    <c:set var="showActions" value="#{empty showActions ? false : showActions}" />
    <c:set var="compact" value="#{empty compact ? false : compact}" />
    
    <!-- Déterminer la severity selon le succès -->
    <c:set var="severity" value="#{auditLog.succes ? 'success' : 'danger'}" />
    <c:set var="icon" value="#{auditLog.succes ? 'pi-check-circle' : 'pi-times-circle'}" />
    
    <div class="audit-log-row flex align-items-center gap-3 p-3 border-round surface-border border-1 #{styleClass}"
         style="#{compact ? 'padding: 0.5rem;' : ''}">
        
        <!-- Icône de statut -->
        <div class="flex align-items-center justify-content-center"
             style="width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--#{severity}-100);">
            <i class="pi #{icon} text-#{severity}-600"></i>
        </div>
        
        <!-- Informations principales -->
        <div class="flex-1">
            <div class="flex align-items-center gap-2 mb-1">
                <strong class="text-900">#{auditLog.typeAction}</strong>
                <p:tag 
                    value="#{auditLog.succes ? 'Succès' : 'Échec'}" 
                    severity="#{severity}"
                    styleClass="text-xs" />
            </div>
            
            <div class="text-color-secondary text-sm">
                <c:if test="#{not empty auditLog.acteurUsername}">
                    <span><i class="pi pi-user mr-1"></i>#{auditLog.acteurUsername}</span>
                </c:if>
                <c:if test="#{not empty auditLog.ressourceType}">
                    <span class="ml-3"><i class="pi pi-database mr-1"></i>#{auditLog.ressourceType}</span>
                </c:if>
                <c:if test="#{not empty auditLog.dateAction}">
                    <span class="ml-3"><i class="pi pi-calendar mr-1"></i>#{auditLog.dateAction}</span>
                </c:if>
            </div>
            
            <!-- Détails (si affichés) -->
            <c:if test="#{showDetails}">
                <div class="mt-2 text-color-secondary text-xs">
                    <c:if test="#{not empty auditLog.ressourceId}">
                        <div><strong>Ressource ID:</strong> #{auditLog.ressourceId}</div>
                    </c:if>
                    <c:if test="#{not empty auditLog.details}">
                        <div><strong>Détails:</strong> #{auditLog.details}</div>
                    </c:if>
                    <c:if test="#{not empty auditLog.adresseIp}">
                        <div><strong>IP:</strong> #{auditLog.adresseIp}</div>
                    </c:if>
                    <c:if test="#{not empty auditLog.userAgent}">
                        <div><strong>User Agent:</strong> #{auditLog.userAgent}</div>
                    </c:if>
                    <c:if test="#{not empty auditLog.messageErreur}">
                        <div class="text-red-600"><strong>Erreur:</strong> #{auditLog.messageErreur}</div>
                    </c:if>
                </div>
            </c:if>
        </div>
        
        <!-- Actions (si affichées) -->
        <c:if test="#{showActions}">
            <div class="flex gap-1">
                <p:commandButton 
                    icon="pi pi-eye"
                    styleClass="p-button-text p-button-sm"
                    title="Voir les détails"
                    onclick="PF('auditLogDetailsDialog').show()" />
            </div>
        </c:if>
    </div>
    
</ui:composition>

