{% trans_default_domain 'admin' %}

{% macro offers(offers, routeName, routeParameters=null) %}
    <ul class="divide-y divide-gray-200 dark:divide-gray-800 border-b border-gray-200 dark:border-gray-800">

        {% for offer in offers %}

            <li class="py-2 font-medium">
                <div class="group relative flex items-start space-x-4 py-2">
                    <div class="min-w-0 flex-1">
                        <div class="text-sm font-medium text-gray-900 dark:text-gray-50">
                            <a href="{{ path(routeName, routeParameters|default({})|merge({ uuid: offer.uuid.toBase58 })) }}"
                               data-turbo-frame="_top"
                               class="flex items-center space-x-1.5 whitespace-nowrap">
                                <span class="absolute inset-0" aria-hidden="true"></span>

                                <span class="truncate">
                                    {{ offer.name }}
                                </span>

                                <svg viewBox="0 0 2 2" class="h-0.5 w-0.5 fill-current">
                                    <circle cx="1" cy="1" r="1"/>
                                </svg>

                                <span class="font-normal text-gray-500 dark:text-gray-300">
                                    {% if offer.dates is not empty %}
                                        {% set startDate = offer.dates|first.begin %}
                                        {% if startDate %}
                                            <time datetime="{{ startDate|date('c') }}">{{ startDate|format_datetime(pattern="E, dd.MM.yyyy HH:mm") }}</time>
                                        {% else %}
                                            <span class="inline-flex items-center text-orange-600">
                                                {{ ux_icon('ph:warning', {class: 'mr-1 size-4'}) }}
                                                <span>Termin fehlt</span>
                                            </span>
                                        {% endif %}
                                    {% else %}
                                        <span>Dauerangebot</span>
                                    {% endif %}
                                </span>
                            </a>
                        </div>
                    </div>
                    <div class="flex-shrink-0 self-center">
                        <twig:ux:icon name="ph:caret-right" class="h-5 w-5 text-gray-400 group-hover:text-gray-500" aria-hidden="true" />
                    </div>
                </div>
            </li>

        {% endfor %}

    </ul>

    <p class="pl-2 pt-2 text-xs text-gray-500 dark:text-gray-400">Wenn Ihr Angebot hier nicht angezeigt wird, wechseln
        Sie zur
        Angebotsübersicht und rufen die Aktion über die drei Punkte auf.</p>

{% endmacro %}


<div {{ attributes }}>

    <ul role="list"
        class="divide-y divide-gray-200 dark:divide-gray-800 border-b border-t border-gray-200 dark:border-gray-800">
        {% if edition is not null and canCopy %}
            <li>
                <div class="group relative flex items-start space-x-3 py-4">
                    <div class="flex-shrink-0">
                        <span class="inline-flex h-10 w-10 items-center justify-center rounded-lg bg-pink-500">
                            <twig:ux:icon name="ph:copy" class="w-6 h-6 text-white" />
                        </span>
                    </div>
                    <div class="min-w-0 flex-1">
                        <div class="text-sm font-medium text-gray-900 dark:text-gray-50">
                            <a href="#"
                               data-action="live#emit:prevent"
                               data-live-event-param="action"
                               data-live-type-param="copy"
                            >
                                <span class="absolute inset-0" aria-hidden="true"></span>
                                Aus dem Vorjahr übernehmen
                            </a>
                        </div>
                        <p class="text-sm text-gray-500 dark:text-gray-300">Wenn Sie die gleiche Veranstaltung schon
                            einmal angeboten haben, nutzen Sie sie doch als Vorlage! Alle Inhalte können individuell
                            angepasst werden.</p>
                    </div>
                    <div class="flex-shrink-0 self-center">
                        <twig:ux:icon name="ph:caret-right" class="h-5 w-5 text-gray-400 group-hover:text-gray-500" aria-hidden="true" />
                    </div>
                </div>


                {% if action == 'copy' %}
                    <div class="ml-12 pb-4 border-t border-gray-200 dark:border-gray-800">
                        {{ _self.offers(offers, 'admin_offers_copy_to_edition', { edition: edition.alias }) }}
                    </div>
                {% endif %}

            </li>
        {% endif %}
        {% if canCreateVariant %}
            <li>
                <div class="group relative flex items-start space-x-3 py-4">
                    <div class="flex-shrink-0">
                        <span class="inline-flex h-10 w-10 items-center justify-center rounded-lg bg-purple-500">
                            <twig:ux:icon name="ph:file-plus" class="w-6 h-6 text-white" />
                        </span>
                    </div>
                    <div class="min-w-0 flex-1">
                        <div class="text-sm font-medium text-gray-900 dark:text-gray-50">
                            <a href="#"
                               data-action="live#emit:prevent"
                               data-live-event-param="action"
                               data-live-type-param="createVariant">
                                <span class="absolute inset-0" aria-hidden="true"></span>
                                Neue Termingruppe zu gleicher Veranstaltung erstellen
                            </a>
                        </div>
                        <p class="text-sm text-gray-500 dark:text-gray-300">Wenn Sie eine Veranstaltung mehrmals für
                            verschiedene Gruppen anbieten, dann erstellen Sie hier gerne eine neue Termingruppe! Nur das
                            Datum und die Zielgruppe können bearbeitet werden.</p>
                    </div>
                    <div class="flex-shrink-0 self-center">
                        <twig:ux:icon name="ph:caret-right" class="h-5 w-5 text-gray-400 group-hover:text-gray-500" aria-hidden="true" />
                    </div>
                </div>

                {% if action == 'createVariant' %}
                    <div class="ml-12 py-4 border-t border-gray-200 dark:border-gray-800">
                        {{ _self.offers(offers, 'admin_offers_new_variant') }}
                    </div>
                {% endif %}

            </li>
        {% endif %}
        {% if edition is not null %}
            <li>
                <div class="group relative flex items-start space-x-3 py-4">
                    <div class="flex-shrink-0">
                        <span class="inline-flex h-10 w-10 items-center justify-center rounded-lg bg-yellow-500">
                            <twig:ux:icon name="ph:file" class="w-6 h-6 text-white" />
                        </span>
                    </div>
                    <div class="min-w-0 flex-1">
                        <div class="text-sm font-medium text-gray-900 dark:text-gray-50">
                            <a href="{{ path('admin_offers_create_in_edition', { edition: edition.alias}) }}" data-turbo-frame="_top">
                                <span class="absolute inset-0" aria-hidden="true"></span>
                                Ohne Vorlage beginnen (Standard)
                            </a>
                        </div>
                        <p class="text-sm text-gray-500 dark:text-gray-300">Sie können ohne Weiteres ein neues Angebot
                            erstellen.</p>
                    </div>
                    <div class="flex-shrink-0 self-center">
                        <twig:ux:icon name="ph:caret-right" class="h-5 w-5 text-gray-400 group-hover:text-gray-500" aria-hidden="true" />
                    </div>
                </div>
            </li>
        {% endif %}
    </ul>

</div>
