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

{% block layout %}
    <div class="layout" data-controller="sidebar-toggle">
        <div>
            <nav id="leftNav">
                <header>
                    <button class="close" data-action="click->sidebar-toggle#close" aria-label="Close left sidebar">✕</button>
                </header>
                <ul class="user-nav">
                    <li>
                        <a href="{{ path('newsstand') }}">Newsstand</a>
                    </li>
                    <li>
                        <a href="{{ path('latest_articles') }}">Latest articles</a>
                    </li>
                    <li>
                        <a href="{{ path('media-discovery') }}">Multimedia</a>
                    </li>
                    <li>
                        <a href="{{ path('reading_list_index') }}">Reading Lists</a>
                    </li>
                    {% if is_granted('ROLE_ADMIN') %}
                    <li>
                        <a href="{{ path('nzine_list') }}">My NZines</a>
                    </li>
                    {% endif %}
                    <li>
                        <a href="{{ path('app_search_index') }}">{{ 'heading.search'|trans }}</a>
                    </li>
                    <li>
                        <a href="{{ path('editor-create') }}">Write Article</a>
                    </li>
                    <li>
                        <a href="{{ path('home') }}">Overview</a>
                    </li>
                </ul>
                <twig:UserMenu />
                {% block nav %}{% endblock %}
            </nav>
        </div>
        <main>
            <div class="mobile-toggles">
                <button class="toggle" aria-controls="leftNav" aria-expanded="false" data-action="click->sidebar-toggle#toggle">☰</button>
{#                <button class="toggle" aria-controls="rightNav" aria-expanded="false" data-action="click->sidebar-toggle#toggle">Right ☰</button>#}
            </div>
            {% block body %}{% endblock %}

            {# Floating reading list quick add widget #}
            {% if app.user %}
                <twig:ReadingListQuickAddComponent />
            {% endif %}
        </main>
        <div>
            <aside id="rightNav">
                <header>
                    <button class="close" data-action="click->sidebar-toggle#close" aria-label="Close right sidebar">✕</button>
                </header>
                {% block aside %}{% endblock %}
            </aside>
        </div>
    </div>
{% endblock %}