{% extends 'base.html.twig' %}

{% block body %}
    <div id="app">
        {% if is_granted('ROLE_USER') %}
            <nav>
                <ul>
                    <li><strong>MyE&amp;P BETA</strong></li>
                </ul>
                <ul>
                    <li>
                        <a href="#"
                           class="contrast"
                           hx-get="{{ path('app_personal_data') }}"
                           hx-target="#app"
                           hx-swap="innerHTML"
                           hx-indicator="#loading-indicator">
                            Persönliche Daten
                        </a>
                    </li>
                    <li>
                        <a href="#"
                           class="contrast"
                           hx-get="{{ path('app_bookings') }}"
                           hx-target="#app"
                           hx-swap="innerHTML"
                           hx-indicator="#loading-indicator">
                            Buchungen
                        </a>
                    </li>
                    <li>
                        <a href="#"
                           class="contrast"
                           hx-get="{{ path('app_logout') }}"
                           hx-target="#app"
                           hx-swap="innerHTML"
                           hx-indicator="#loading-indicator">
                            Logout
                        </a>
                    </li>
                </ul>
            </nav>
        {% endif %}
        <div id="content">
            {% for label, messages in app.flashes %}
                {% for message in messages %}
                    <article>
                        {{ message }}
                    </article>
                {% endfor %}
            {% endfor %}
            {% block content %}{% endblock %}
            <div id="loading-indicator">
                <progress />
            </div>
        </div>
    </div>
{% endblock %}