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

{% block wfbo_title %}Edit Entry{% endblock %}

{% block wfbo_content %}

    {% set errorFlashes = app.flashes('error') %}
    {% if errorFlashes %}
        <div class="alert alert-danger mb-4" role="alert" data-testid="flash-error">
            {% for flash in errorFlashes %}
                <div>{{ flash }}</div>
            {% endfor %}
        </div>
    {% endif %}

    <div class="mb-4">
        <a href="{{ path('app_wfbo_karera_race_show', {eventId: event.id, raceId: race.id}) }}"
           class="back-link">
            ← Back to Race {{ race.raceNumber }}
        </a>
    </div>

    <div class="card" style="max-width: 560px;">
        <div class="card-body">

            <h2 class="wfbo-card-title mb-3">Edit Entry</h2>

            <form method="POST"
                  action="{{ path('app_wfbo_karera_entry_edit', {eventId: event.id, raceId: race.id, entryId: entry.id}) }}"
                  data-testid="entry-form"
                  data-controller="searchable-select"
                  data-searchable-select-create-value="true"
                  data-turbo="false"
                  novalidate>
                <input type="hidden" name="_token" value="{{ csrf_token('wfbo_karera_entry_edit_' ~ entry.id) }}">

                <div class="mb-3">
                    <label class="form-label--sm">No. <span class="text-danger">*</span></label>
                    <input type="text"
                           name="number"
                           class="form-control"
                           style="max-width: 100px;"
                           value="{{ submitted.number }}"
                           data-testid="input-number">
                </div>

                <div class="mb-3">
                    <label class="form-label--sm">Horse <span class="text-danger">*</span></label>
                    <select name="horse_name"
                            data-searchable
                            data-url="{{ path('app_wfbo_karera_api_horses') }}"
                            data-placeholder="Search horse..."
                            data-initial="{{ submitted.horseName }}"
                            data-testid="input-horse-name">
                    </select>
                </div>

                <div class="mb-3">
                    <label class="form-label--sm">Jockey <span class="text-danger">*</span></label>
                    <select name="jockey_name"
                            data-searchable
                            data-url="{{ path('app_wfbo_karera_api_jockeys') }}"
                            data-placeholder="Search jockey..."
                            data-initial="{{ submitted.jockeyName }}"
                            data-testid="input-jockey-name">
                    </select>
                </div>

                <div class="mb-4">
                    <label class="form-label--sm">Trainer <span class="text-danger">*</span></label>
                    <select name="trainer_name"
                            data-searchable
                            data-url="{{ path('app_wfbo_karera_api_trainers') }}"
                            data-placeholder="Search trainer..."
                            data-initial="{{ submitted.trainerName }}"
                            data-testid="input-trainer-name">
                    </select>
                </div>

                <div class="d-flex align-items-center gap-3">
                    <button type="submit"
                            class="btn btn-admin-save"
                            data-testid="btn-submit">
                        Update Entry
                    </button>
                    <a href="{{ path('app_wfbo_karera_race_show', {eventId: event.id, raceId: race.id}) }}"
                       class="back-link">
                        Cancel
                    </a>
                </div>

            </form>

        </div>
    </div>

{% endblock %}