@php
    if (core()->getConfigData('general.design.admin_logo.logo_image')) {
        $logo = $smLogo = core()->getConfigData('general.design.admin_logo.logo_image');
    } else {
        $logo  = asset('vendor/webkul/ui/assets/images/logo.png');
        $smLogo = asset('vendor/webkul/admin/assets/images/logo-icon.png');
    }

    $menu_route_name = Illuminate\Support\Facades\Route::currentRouteName();

    $bottomNav = '';
    $leftNavBarMode = core()->getConfigData('admin.onboarding.leftNavBarMode');
@endphp

<div class="navbar-left">
    <div class="d-flex justify-content-between navbar-top-left">
        <div class="brand-logo">
            <a href="{{ route('admin.dashboard.index') }}">
                <img src="{{ $logo }}" data-logo="{{ $logo }}" data-sm-logo="{{ $smLogo }}" alt="{{ config('app.name') }}" />
            </a>
        </div>
        <div class="" onclick="toggleMenuView(`{{ route('admin.configuration.toggleLeftBar') }}`)">
            @csrf()
            <svg width="40px" height="40px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M5 6.5H19V8H5V6.5Z" fill="#1F2328"/>
                <path d="M5 16.5H19V18H5V16.5Z" fill="#1F2328"/>
                <path d="M5 11.5H19V13H5V11.5Z" fill="#1F2328"/>
            </svg>
        </div>
    </div>

    <ul class="menubar">
        @foreach ($menu->items as $menuItem)
            @if($menuItem['key'] == 'branches')
                @continue
            @endif

            @if( $menuItem['key'] == 'prescriptions' && (!core()->getConfigData('checkout_page.order.prescription.upload')))
                @continue
            @endif

            @php
                $hasChildren = ((!isset($menuItem['hide-children']) || !$menuItem['hide-children']) && isset($menuItem['childs']) && count($menuItem['childs']) > 0);
                $featureFlag = isset($menuItem['feature-lvl']) ? core()->getFeatureFlag($menuItem['feature-lvl'], $currentPlanFeatures->code) : null;
            @endphp
            @if ((!isset($menuItem['hide']) || !$menuItem['hide'] ) && (!isset($menuItem['bottom']) || !$menuItem['bottom']))
                <li class=" menu-item special  {{ $menu->getActive($menuItem) }}
                    @if($menu->getActive($menuItem) == "active") dropdownActive @endif
                    @if(isset($menuItem['feature']) && $menuItem['feature']) checkFeature @endif
                    @if($hasChildren) hasChild @endif
                    @if($featureFlag) stopFeature-menu @endif"
                    @if(isset($menuItem['feature']) && $menuItem['feature']) data-feature="{{$menuItem['feature']}}" @endif
                    >
                    <a href="{{ $hasChildren ? '#' : route($menuItem['route']) }}">
                        <div class="my " >
                            <span class="icon {{ $menuItem['icon-class'] }}"  title="{{ trans($menuItem['name']) }}"></span>
                            <span class="span-name" > {{ $menuItem['key'] == 'prescriptions' && (core()->getCurrentChannel()->industry != 'pharmacies-and-medical-equipment') ? __('admin::app.admin.mystore.customer-prescription') : trans($menuItem['name']) }} </span>
                            @if($featureFlag)
                            <div class="featureFlag">
                                <span>{{ __('admin::app.dashboard.'.$featureFlag) }}</span>
                                <div class="tooltip">
                                    {{ __('admin::app.dashboard.feature-locked-plan') }}
                                    <button type="button" onclick="window.location.href='{{ route('admin.settings.billing.plans') }}'" class="upgrade-link">{{ __('admin::app.dashboard.upgrade-your-plan') }}</button>
                                </div>
                            </div>
                            @endif
                            @if($hasChildren)
                                <span class="dropdown-arrow">
                                    <img src="{{ asset('vendor/webkul/admin/assets/images/chevron-right.svg') }}" alt="">
                                </span>
                            @endif
                        </div>
                    </a>

                    @if ($hasChildren)
                        <div class="aside-nav">
                            <ul id="hidden-content" @if (app()->getLocale() == 'ar') style="text-align:right !important;" @endif>
                                @foreach ($menuItem['childs'] as $item)
                                    <li class="sub-item {{ $menu->getActive($item) }}" style="display: none">
                                        <a class="sub-item {{ $menu->getActive($item) }}" style="color:black;"
                                            href="{{ route($item['route']) }}">
                                            {{ trans($item['name']) }}
                                        </a>
                                    </li>
                                @endforeach
                            </ul>
                        </div>
                    @endif
                </li>
            @endif

            @if ((!isset($menuItem['hide']) || !$menuItem['hide'] ) && (isset($menuItem['bottom']) && $menuItem['bottom']))
                @php
                    $bottomNav .= '<li class="menu-item special ' . $menu->getActive($menuItem) .'" >
                        <a href="' . ($hasChildren ? '#' : route($menuItem['route'])) . '">
                            <div class="my">
                                <span class="icon ' . $menuItem['icon-class'] . '"></span>
                                <span class="span-name ">' . trans($menuItem['name']) . '</span>
                            </div>
                        </a>
                    </li>';
                @endphp
            @endif
        @endforeach

        <div class="bottom-nav">
            {!! $bottomNav !!}
        </div>
    </ul>
</div>

@section('page-script')
    <script type="text/javascript" src="@version('vendor/webkul/admin/assets/js/jquery.min.js')"></script>

    <script type="text/javascript">
        // on load check if the left navbar was toggled
        var isLeftNavBarToggled = @json($leftNavBarMode) == 'minimized' ? true : false;
        if(isLeftNavBarToggled === true){
            $('.navbar-left, .content-container .content-wrapper, .menu-item .span-name, .bottom-nav, .navbar-top-new').addClass('toggled');
            // toggle logo image to suit the space
            $('.toggled .brand-logo img').attr("src", $('.brand-logo img').data("sm-logo"));
        }
        // on window resize check if the left navbar was toggled
        $(window).resize(function() {
            if ($(window).width() > 500){
                if(isLeftNavBarToggled === true){
                    $('.navbar-left, .content-container .content-wrapper, .menu-item .span-name, .bottom-nav, .navbar-top-new').addClass('toggled');
                    // toggle logo image to suit the space
                    $('.toggled .brand-logo img').attr("src", $('.brand-logo img').data("sm-logo"));
                }
            }else{
                if(isLeftNavBarToggled === true){
                    $('.navbar-left, .content-container .content-wrapper, .menu-item .span-name, .bottom-nav, .navbar-top-new').removeClass('toggled');
                    // toggle logo image to suit the space
                    $('.toggled .brand-logo img').attr("src", $('.brand-logo img').data("logo"));
                }
            }
        });
        $(document).ready(function() {
            setTimeout(() => {
                $('.menu-item.special').click(function(e) {
                    e.stopPropagation();
                    let element = e.target || e.srcElement;
                    if($(this).hasClass("menu-item")){
                        if($(this).hasClass("active") && !$(this).hasClass("core")){
                            $(this).removeClass("active");
                        }
                        // Hide all li.sub-item elements except the ones inside the clicked menu-item.special
                        $('li.sub-item').not($(this).find('li.sub-item')).hide(300);

                        // Toggle visibility of the clicked li.sub-item(s)
                        $(this).find('li.sub-item').toggle(300);
                        $(this).toggleClass("dropdownActive").siblings().removeClass("dropdownActive");
                    }
                });
                $('.sub-item').click(function(e) {
                    e.stopPropagation();
                });

                $(".menu-item.active .sub-item").show();
            }, 500);


            if ($(".menu-item").children().length > 0 && ($(".menu-item").hasClass("active"))) {
                $(".menu-item.active .sub-item").addClass("intro");
                $(".sub-item.intro").css("display", "block");
                $(".menu-item ul li").css("display", "none");
                $(".menu-item.active ul li").css("display", "block");
                $(".menu-item.active ul li").css("color", "black");
            }

            if (($(".sub-item").hasClass("active"))) {
                $(".sub-item.active.intro").css("color", "#6941c6");
                $(".sub-item.active.intro").css("font-size", "14px");
                $(".sub-item.active").parents('.menu-item').addClass("active").addClass("core").addClass("dropdownActive");
            }
        });
    </script>

    {{-- tooltip js --}}
    {{-- <script src="{{asset('vendor/webkul/admin/assets/TooltipAnimations-master/js/anime.min.js')}}"></script>
    <script src="{{asset('vendor/webkul/admin/assets/TooltipAnimations-master/js/charming.min.js')}}"></script>
    <script src="{{asset('vendor/webkul/admin/assets/TooltipAnimations-master/js/main.js')}}" defer></script> --}}