@php
    $activeBlog = request()->is('admin/blog*');
    $activeProduct = request()->is('admin/product*');
    $activeFaq = request()->is('admin/faqs*');
@endphp

<div class="p-2 text-sm text-white">

    <ul class="space-y-1">

        {{-- DASHBOARD --}}
        <li>
            <a href="{{ url('/admin/dashboard') }}"
               class="nav-link flex items-center gap-3 p-2 rounded hover:bg-gray-800">
                <i class="fa fa-home w-5"></i>
                <span class="menu-text">Dashboard</span>
            </a>
        </li>

        {{-- BLOGS --}}
        <li>

            <button type="button"
                class="w-full flex items-center justify-between p-2 rounded hover:bg-gray-800 toggle-menu">

                <div class="flex items-center gap-3">
                    <i class="fa fa-pen w-5"></i>
                    <span class="menu-text">Blogs</span>
                </div>

                <i class="fa fa-angle-down text-xs menu-text"></i>
            </button>

            <ul class="ml-6 mt-1 space-y-1 submenu {{ $activeBlog ? '' : 'hidden' }}">

                <li>
                    <a href="{{ url('admin/blogs') }}"
                       class="nav-link flex items-center gap-3 p-2 rounded hover:bg-gray-800">
                        <i class="fa fa-list w-5"></i>
                        <span class="menu-text">All Blogs</span>
                    </a>
                </li>

                <li>
                    <a href="{{ url('admin/blogs/create') }}"
                       class="nav-link flex items-center gap-3 p-2 rounded hover:bg-gray-800">
                        <i class="fa fa-plus w-5"></i>
                        <span class="menu-text">Add Blog</span>
                    </a>
                </li>

                <li>
                    <a href="{{ url('admin/blog/categories') }}"
                       class="nav-link flex items-center gap-3 p-2 rounded hover:bg-gray-800">
                        <i class="fa fa-folder w-5"></i>
                        <span class="menu-text">Categories</span>
                    </a>
                </li>

            </ul>
        </li>

        {{-- PRODUCTS --}}
        <li>

            <button type="button"
                class="w-full flex items-center justify-between p-2 rounded hover:bg-gray-800 toggle-menu">

                <div class="flex items-center gap-3">
                    <i class="fa fa-cogs w-5"></i>
                    <span class="menu-text">Products</span>
                </div>

                <i class="fa fa-angle-down text-xs menu-text"></i>
            </button>

            <ul class="ml-6 mt-1 space-y-1 submenu {{ $activeProduct ? '' : 'hidden' }}">

                <li>
                    <a href="{{ url('admin/products') }}"
                       class="nav-link flex items-center gap-3 p-2 rounded hover:bg-gray-800">
                        <i class="fa fa-box w-5"></i>
                        <span class="menu-text">All Products</span>
                    </a>
                </li>

                <li>
                    <a href="{{ url('admin/products/create') }}"
                       class="nav-link flex items-center gap-3 p-2 rounded hover:bg-gray-800">
                        <i class="fa fa-plus w-5"></i>
                        <span class="menu-text">Add Product</span>
                    </a>
                </li>

                <li>
                    <a href="{{ url('admin/product-categories') }}"
                       class="nav-link flex items-center gap-3 p-2 rounded hover:bg-gray-800">
                        <i class="fa fa-folder w-5"></i>
                        <span class="menu-text">Categories</span>
                    </a>
                </li>

            </ul>
        </li>

        {{-- FAQ --}}
        <li>
            <a href="{{ url('admin/faqs') }}"
               class="nav-link flex items-center gap-3 p-2 rounded hover:bg-gray-800
               {{ $activeFaq ? 'bg-gray-800' : '' }}">
                <i class="fa fa-question-circle w-5"></i>
                <span class="menu-text">FAQs</span>
            </a>
        </li>

        {{-- SIMPLE LINKS --}}
        <li>
            <a href="{{ url('admin/abouts') }}" class="nav-link flex items-center gap-3 p-2 hover:bg-gray-800 rounded">
                <i class="fa fa-info-circle w-5"></i>
                <span class="menu-text">About Us</span>
            </a>
        </li>

        <li>
            <a href="{{ url('admin/banners') }}" class="nav-link flex items-center gap-3 p-2 hover:bg-gray-800 rounded">
                <i class="fa fa-image w-5"></i>
                <span class="menu-text">Banners</span>
            </a>
        </li>

        <li>
            <a href="{{ url('admin/logos') }}" class="nav-link flex items-center gap-3 p-2 hover:bg-gray-800 rounded">
                <i class="fa fa-image w-5"></i>
                <span class="menu-text">Clients Logo</span>
            </a>
        </li>

        <li>
            <a href="{{ url('admin/contacts') }}" class="nav-link flex items-center gap-3 p-2 hover:bg-gray-800 rounded">
                <i class="fa fa-phone w-5"></i>
                <span class="menu-text">Contacts</span>
            </a>
        </li>

        <li>
            <a href="{{ url('admin/reviews') }}" class="nav-link flex items-center gap-3 p-2 hover:bg-gray-800 rounded">
                <i class="fa fa-star w-5"></i>
                <span class="menu-text">Reviews</span>
            </a>
        </li>

        {{-- ROLE BASED --}}
        @if (auth()->user() && auth()->user()->role == 'admin')
        <li>
            <a href="{{ url('admin/users') }}" class="nav-link flex items-center gap-3 p-2 hover:bg-gray-800 rounded">
                <i class="fa fa-users w-5"></i>
                <span class="menu-text">Users Management</span>
            </a>
        </li>
        @endif

    </ul>
</div>