{% extends 'base.html.twig' %}
{% block title "#{parent()} - #{provider.name}" %}

{% block body %}
    <section class="messages" v-show="messages.count > 0">
        <h2 class="section__title flex">
            <fa :icon="['fal', 'bullhorn']" fixed-width class="mr-2"></fa>
            Komunikaty <span class="ml-2 badge badge-pill badge-dark">{{ '{{ messages.count }}' }}</span>
            <button class="btn btn-action btn-sm flex-space-left" @click="messages.visible = !messages.visible">
                <fa :icon="['fal', messages.visible ? 'chevron-up' : 'chevron-down']" fixed-width />
            </button>
        </h2>
        <fold :visible="messages.visible">
            <messages @update="handleMessagesUpdate"></messages>
        </fold>
    </section>
    <stop-picker></stop-picker>
{% endblock %}

{% block javascripts %}
    <script>
        window.data = {
            provider: {{ provider.identifier|json_encode|raw }}
        }
    </script>
{% endblock %}