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

{% block wfbo_title %}Live Racing Event Audit{% endblock %}

{% set actionLabels = {
    'live-racing-event-published':  'Event Published',
    'live-racing-race-created':     'Race Created',
    'live-racing-race-closed':      'Race Closed',
    'live-racing-horse-created':    'Horse Added',
    'live-racing-horses-scratched': 'Horse(s) Scratched',
    'live-racing-result-saved':     'Result Saved',
    'live-racing-bet-placed':       'Bet Placed',
} %}

{% set actionIcons = {
    'live-racing-event-published':  '📢',
    'live-racing-race-created':     '🏁',
    'live-racing-race-closed':      '🔒',
    'live-racing-horse-created':    '🐎',
    'live-racing-horses-scratched': '✂️',
    'live-racing-result-saved':     '✅',
    'live-racing-bet-placed':       '🎫',
} %}

{% block wfbo_content %}

    <div class="mb-4">
        <a href="{{ path('app_wfbo_event_show', {id: eventId}) }}"
           class="back-link">
            ← Back to Event Details
        </a>
    </div>

    <div class="d-flex align-items-center justify-content-between mb-4">
        <h2 class="wfbo-card-title mb-0">Audit Log — Event #{{ eventId }}</h2>
        <div class="d-flex align-items-center gap-3">
            <form method="GET" class="d-flex align-items-center gap-2">
                <label class="form-hint mb-0" for="race-filter">Race:</label>
                <select name="race_id" id="race-filter" class="form-select" style="max-width: 140px;" onchange="this.form.submit()">
                    <option value="">All Races</option>
                    {% for race in races %}
                        <option value="{{ race.id }}" {{ raceId == race.id ? 'selected' : '' }}>Race {{ race.raceNumber }}</option>
                    {% endfor %}
                </select>
            </form>
            <p class="pagination-info mb-0">{{ total }} record(s)</p>
        </div>
    </div>

    <div class="table-card--tabbed" data-testid="live-racing-audit-table-card">
        <div class="table-scroll">
            <table class="data-table" style="--bs-table-color: #000000; --bs-table-bg: #ffffff;" data-testid="live-racing-audit-table">
                <thead>
                    <tr class="thead-row--light">
                        <th class="th-gray">Date / Time</th>
                        <th class="th-gray">Action</th>
                        <th class="th-gray">Details</th>
                        <th class="th-gray">Performed By</th>
                    </tr>
                </thead>
                <tbody>
                    {% for log in auditLogs %}
                    <tr class="table-row" data-testid="live-racing-audit-row-{{ log.id }}">
                        <td class="td-cell td-cell--nowrap">
                            <p class="date-primary td-cell--dark">{{ log.createdAt|date('M d, Y') }}</p>
                            <p class="date-secondary">{{ log.createdAt|date('h:i A') }}</p>
                        </td>

                        <td class="td-cell td-cell--dark font-mono-sm">
                            {{ actionIcons[log.action]|default('•') }}
                            {{ actionLabels[log.action]|default(log.action) }}
                        </td>

                        <td class="td-cell td-cell--dark" style="max-width: 420px;">
                            {% if log.metadata %}
                                {% if log.metadata.race_number is defined %}
                                    <div class="font-mono-sm"><strong>Race:</strong> {{ log.metadata.race_number }}</div>
                                {% endif %}
                                {% if log.metadata.horse_number is defined %}
                                    <div class="font-mono-sm"><strong>Horse:</strong> #{{ log.metadata.horse_number }}
                                        {% if log.metadata.horse_name is defined %} — {{ log.metadata.horse_name }}{% endif %}
                                    </div>
                                {% endif %}
                                {% if log.metadata.horse_ids is defined and log.metadata.horse_ids|length > 0 %}
                                    <div class="font-mono-sm"><strong>Scratched Horses:</strong>
                                        {{ log.metadata.horse_ids|join(', ') }}
                                    </div>
                                {% endif %}
                                {% if log.metadata.stats is defined %}
                                    <div class="font-mono-sm"><strong>Settled:</strong>
                                        {{ log.metadata.stats.won }} won,
                                        {{ log.metadata.stats.lost }} lost,
                                        {{ log.metadata.stats.void }} void
                                    </div>
                                {% endif %}
                                {% if log.metadata.bet_type is defined %}
                                    <div class="font-mono-sm"><strong>Bet Type:</strong> {{ log.metadata.bet_type }}</div>
                                {% endif %}
                                {% if log.metadata.race_number is defined and log.metadata.race_number is not null %}
                                    <div class="font-mono-sm"><strong>Race:</strong> {{ log.metadata.race_number }}</div>
                                {% endif %}
                                {% if log.metadata.combos is defined %}
                                    <div class="font-mono-sm"><strong>Combos:</strong> {{ log.metadata.combos }}</div>
                                {% endif %}
                                {% if log.metadata.total_wager is defined %}
                                    <div class="font-mono-sm"><strong>Wager:</strong> ₱{{ log.metadata.total_wager|number_format(2) }}</div>
                                {% endif %}
                                {% if log.metadata.multiplier is defined %}
                                    <div class="font-mono-sm"><strong>Multiplier:</strong> {{ log.metadata.multiplier }}×</div>
                                {% endif %}
                                {% if log.action == 'live-racing-event-published' %}
                                    <span class="badge-role badge-role--active">Published</span>
                                {% endif %}
                            {% else %}
                                <span class="text-muted">&mdash;</span>
                            {% endif %}
                        </td>

                        <td class="td-cell td-cell--dark td-cell--nowrap font-mono-sm">
                            {% if log.targetUser and log.action == 'live-racing-bet-placed' %}
                                {{ log.targetUser.firstName }} {{ log.targetUser.lastName }}
                                <span class="text-muted">(User #{{ log.targetUser.id }})</span>
                            {% elseif log.actor %}
                                {{ log.actor.firstName }} {{ log.actor.lastName }}
                            {% else %}
                                <span class="text-muted">&mdash;</span>
                            {% endif %}
                        </td>
                    </tr>
                    {% else %}
                    <tr>
                        <td colspan="4" class="td-empty td-empty--lg">
                            No audit records found for this event.
                        </td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>

    {# ── Pagination ── #}
    {% set totalPages = (total / limit)|round(0, 'ceil') %}
    {% if totalPages > 1 %}
    <div class="d-flex align-items-center justify-content-between mt-4" data-testid="pagination">
        <p class="pagination-info">
            Page {{ page }} of {{ totalPages }} &nbsp;&middot;&nbsp; {{ total }} total
        </p>
        <div class="d-flex gap-2">
            {% if page > 1 %}
                <a href="{{ path('app_wfbo_live_racing_audit', {eventId: eventId, page: page - 1, race_id: raceId}) }}"
                   class="btn btn-page-prev">
                    &larr; Previous
                </a>
            {% endif %}
            {% if page < totalPages %}
                <a href="{{ path('app_wfbo_live_racing_audit', {eventId: eventId, page: page + 1, race_id: raceId}) }}"
                   class="btn btn-page-next">
                    Next &rarr;
                </a>
            {% endif %}
        </div>
    </div>
    {% endif %}

{% endblock %}