<div class="sidebar">

    <div class="sidebar-search">
        <div class="sidebar-search__input-wrap">
            <i class="fa fa-search sidebar-search__icon"></i>
            <input type="text" class="sidebar-search__input" placeholder="Search menu (Ctrl+K)" autocomplete="off">
            <button type="button" class="sidebar-search__clear" style="display:none">
                <i class="fa fa-times"></i>
            </button>
        </div>
    </div>

    <ul class="topnav">

        <li class="siteNavigation t" data-section-id="section-site-nav">
            <button type="button" class="sectionHeader" aria-expanded="false" aria-controls="section-site-nav-panel">
                <i class="fa fa-sitemap sectionHeader-icon"></i>
                <span class="sectionHeader-label">Site Navigation</span>
                <i class="fa fa-chevron-right sidebar-toggle-icon"></i>
            </button>

            {% if admin_id is not empty and admin_user is not empty %}
                <div class="sidebar-section__panel" id="section-site-nav-panel">
                    <ul>
                        <li>
                            <a href="/admin/"
                                title="Go to {{ config('app.name') }} Admin home"
                            >
                                <i class="fa fa-home"></i>
                                Dashboard
                            </a>
                        </li>
                        <li>
                            <a href="/"
                                title="Go to {{ config('app.name') }}"
                                target="_blank"
                            >
                                <i class="fa fa-globe"></i>
                                Homepage
                            </a>
                        </li>
                        <li>
                            <a href="/admin/logout.php">
                                <i class="fa fa-sign-out"></i>
                                Logout
                            </a>
                        </li>
                    </ul>
                </div>
            {% endif %}
        </li> <!-- .siteNavigation -->

        {% include('admin/favourite_links.twig') %}


        {% if admin_id is not empty %}
            {% for menu_item in admin_menu %}
                <li data-section-id="section-{{ menu_item.id }}">
                    <button type="button" class="sectionHeader" aria-expanded="false" aria-controls="section-{{ menu_item.id }}-panel">
                        <i class="{{ menu_item.displayIcon() }} sectionHeader-icon"></i>
                        <span class="sectionHeader-label">{{ menu_item.title }}</span>
                        <i class="fa fa-chevron-right sidebar-toggle-icon"></i>
                    </button>
                    {% if menu_item.subItems|length > 0 %}
                        <div class="sidebar-section__panel" id="section-{{ menu_item.id }}-panel">
                            <ul class="{% if menu_item.hasActiveChild() %}show{% endif %}">
                                {% for sub_menu_item in menu_item.subItems %}
                                    {% if sub_menu_item.allowed() and sub_menu_item.sub_id %}
                                        <li class="{% if sub_menu_item.isActive() %}active nav-twig{% endif %}">
                                            <a href="{{ sub_menu_item.path }}"
                                            {% if sub_menu_item.new_window %}
                                                target="_blank"
                                                title="opens in a new window"
                                            {% endif %}>
                                                <i class="{{ sub_menu_item.icon ?: 'fa fa-circle-o' }}"></i>
                                                {{ sub_menu_item.title }}
                                                {% if sub_menu_item.path == '/plugins/MembersMessaging/admin/my_messages.php' %}
                                                    ({{ new_message_count }})
                                                {% endif %}
                                            </a>
                                            {{ sub_menu_item.showCMSTreeIfAllowed(admin_user) }}
                                        </li>
                                    {% endif %}
                                {% endfor %}
                            </ul>
                        </div>
                    {% endif %}
                </li>
            {% endfor %}
            {% if admin_user.user.role == 7 %}
                <li data-section-id="section-support">
                    <button type="button" class="sectionHeader" aria-expanded="false" aria-controls="section-support-panel">
                        <i class="fa fa-life-ring sectionHeader-icon"></i>
                        <span class="sectionHeader-label">Support</span>
                        <i class="fa fa-chevron-right sidebar-toggle-icon"></i>
                    </button>
                    <div class="sidebar-section__panel" id="section-support-panel">
                        <ul>
                            <li>
                                <a href="https://projects.mtcmedia.co.uk" target="_blank">Submit a ticket <i class="fa fa-file"></i></a>
                            </li>
                        </ul>
                    </div>
                </li>
            {% endif %}
        {% else %}
            <li data-section-id="section-login">
                <button type="button" class="sectionHeader" aria-expanded="false" aria-controls="section-login-panel">
                    <i class="fa fa-sign-in sectionHeader-icon"></i>
                    <span class="sectionHeader-label">Admin Login</span>
                    <i class="fa fa-chevron-right sidebar-toggle-icon"></i>
                </button>
                <div class="sidebar-section__panel" id="section-login-panel">
                    <ul>
                        <li>
                            <a href="/admin/login.php">Login <i class="fa fa-file"></i></a>
                        </li>
                    </ul>
                </div>
            </li>
        {% endif %}
    </ul>

</div>

{# Ensure sidebar JS loads on Laravel-routed admin pages where admin_js_files
   isn't populated. On legacy pages the file is already loaded by the
   admin_js_files glob, so guard against a second load. #}
<script>
    (function () {
        const src = '/core/admin/js/admin_sidebar_nav.js';
        if (document.querySelector('script[src^="' + src + '"]')) {
            return;
        }
        const s = document.createElement('script');
        s.src = src;
        s.defer = true;
        document.head.appendChild(s);
    })();
</script>
