{% extends 'admin/layout/base.html.twig' %}

{% block title %}{{ 'menu' | trans }}{% endblock %}

{% block body %}

    <ul class="nav nav-tabs">
        <li class="nav-item active">
            <span class="nav-link active">
                <i class="fas fa-bars text-danger"></i> {{ 'menu'|trans }}
            </span>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="{{ path('admin_menu_new') }}">
                <i class="fas fa-plus-square text-danger"></i> {{ 'action.add_menu_item' | trans }}
            </a>
        </li>
    </ul>

    <div class="card mb-3" id="menu" data-token="{{ csrf_token('csrf_token') }}">

        <div class="card-body">
            <div class="table-responsive">
                <table class="table" style="background-color: #FFFFFF">
                    <thead class="thead">
                    <tr>
                        <th>{{ 'table.link_text' | trans }}</th>
                        <th class="hidden-sm">{{ 'table.url' | trans }}</th>
                        <th>{{ 'table.move' | trans }}</th>
                        <th>{{ 'table.action' | trans }}</th>
                    </tr>
                    </thead>
                    <tbody>

                    {% for item in menu %}
                        <tr>
                            <td>{{ item.title }}</td>
                            <td class="small hidden-sm">{{ item.url }}</td>
                            <td>
                                {% if loop.first %}
                                    <button class="btn btn-sm btn-light js-move js-down-one"
                                            id="{{ item.id }}"
                                            type="button">
                                        <i class="fas fa-arrow-down"></i> Down one
                                    </button>
                                {% else %}
                                    <button class="btn btn-sm btn-light js-move js-up-one"
                                            id="{{ item.id }}"
                                            type="button">
                                        <i class="fas fa-arrow-up"></i> Up one
                                    </button>
                                {% endif %}
                            </td>
                            <td>
                                {{ include('admin/menu/_action_form.html.twig', {item: item}, with_context = false) }}
                            </td>
                        </tr>

                    {% endfor %}

                    </tbody>
                </table>
            </div>

        </div>
    </div>

{% endblock %}

{% block javascripts %}

    {{ encore_entry_script_tags('js/menu-sorting') }}

{% endblock %}