<aside class="site-sidebar scrollbar-enabled" data-suppress-scroll-x="true">
    <!-- User Details -->
    @auth
        @php
            $user = auth()->user();
            $hasImage = $user->user_image && file_exists(public_path('uploads/users/' . $user->user_image));
            $userImageUrl = $hasImage ? asset('uploads/users/' . $user->user_image) : asset('assets/demo/user-image-cropped.jpg');
            $firstLetter = strtoupper(substr($user->first_name, 0, 1));
        @endphp

        <div class="side-user">
            <figure class="side-user-bg" style="background-image: url('{{ $userImageUrl }}')">
                <img src="{{ $userImageUrl }}" alt="{{ $user->first_name }}" class="d-none">
            </figure>
            <div class="col-sm-12 text-center p-0 clearfix">
                <div class="d-inline-block pos-relative mr-b-10">
                    @if($hasImage)
                        <figure class="avatar-img thumb-sm mr-b-0">
                            <img src="{{ $userImageUrl }}" class="rounded-circle" alt="{{ $user->first_name }}"
                                style="width: 40px; height: 40px; object-fit: cover;">
                        </figure>
                    @else
                        <span class="avatar-text">{{ $firstLetter }}</span>
                    @endif
                </div>
                <!-- /.d-inline-block -->
                <div class="lh-14 mr-t-5 sidebar-collapse-hidden">
                    <h6 class="hide-menu side-user-heading">{{ $user->first_name }} {{ $user->last_name }}</h6>
                    <small class="hide-menu">{{ $user->email }}</small>
                </div>
            </div>
            <!-- /.col-sm-12 -->
        </div>
    @endauth
    <!-- /.side-user -->
    <!-- Sidebar Menu -->
    <nav class="sidebar-nav">
        <ul class="nav in side-menu">
            <li class=" current-page">
                <a href="{{ route('admin.dashboard') }}">
                    <i class="list-icon material-icons">home</i>
                    <span class="hide-menu">Dashboard</span>
                </a>
            </li>

            {{-- Journal Section --}}
            @canany(['view Journal', 'view About Journal', 'view Journal Info'])
                <li class="menu-item-has-children">
                    <a href="javascript:void(0);">
                        <i class="list-icon material-icons">assignment</i>
                        <span class="hide-menu">Journal</span>
                    </a>
                    <ul class="list-unstyled sub-menu">
                        @can('view Journal')
                            <li><a href="{{ route('admin.journals.index') }}">Journal</a></li>
                        @endcan

                        @can('view About Journal')
                            <li><a href="{{ route('admin.about.index') }}">About Journal</a></li>
                        @endcan

                        @can('view Journal Info')
                            <li><a href="{{ route('admin.journal-infos.index') }}">Journal Info</a></li>
                        @endcan
                    </ul>
                </li>
            @endcanany

            {{-- Editorial Section --}}
            @canany(['view Editorial Category', 'view Editorial Board'])
                <li class="menu-item-has-children">
                    <a href="javascript:void(0);">
                        <i class="list-icon material-icons">grid_on</i>
                        <span class="hide-menu">Editorial</span>
                    </a>
                    <ul class="list-unstyled sub-menu">
                        @can('view Editorial Category')
                            <li><a href="{{ route('admin.editorial_categories.index') }}">Editorial Categories</a></li>
                        @endcan

                        @can('view Editorial Board')
                            <li><a href="{{ route('admin.editorial_board.index') }}">Editorial Board</a></li>
                        @endcan
                    </ul>
                </li>
            @endcanany

            {{-- For Reviewer Section --}}
            @can('view Reviewer')
                <li class="menu-item-has-children">
                    <a href="javascript:void(0);">
                        <i class="list-icon material-icons">grid_on</i>
                        <span class="hide-menu">For Reviewer</span>
                    </a>
                    <ul class="list-unstyled sub-menu">
                        <li><a href="{{ route('admin.reviewers.index') }}">Reviewer</a></li>
                    </ul>
                </li>
            @endcan

            {{-- Ethics and Policies Section --}}
            @can('view Policy')
                <li class="menu-item-has-children">
                    <a href="javascript:void(0);">
                        <i class="list-icon material-icons">lightbulb_outline</i>
                        <span class="hide-menu">Ethics and Policies</span>
                    </a>
                    <ul class="list-unstyled sub-menu">
                        <li><a href="{{ route('admin.policies.index') }}">Ethics and Policies</a></li>
                    </ul>
                </li>
            @endcan

            {{-- For Authors Section --}}
            @can('view For Author')
                <li class="menu-item-has-children">
                    <a href="javascript:void(0);">
                        <i class="list-icon material-icons">lightbulb_outline</i>
                        <span class="hide-menu">For Authors</span>
                    </a>
                    <ul class="list-unstyled sub-menu">
                        <li><a href="{{ route('admin.for_authors.index') }}">For Authors</a></li>
                    </ul>
                </li>
            @endcan

            {{-- Roles & Permission Section --}}
            @canany(['view Permission', 'view Role', 'view User'])
                <li class="menu-item-has-children">
                    <a href="javascript:void(0);">
                        <i class="list-icon feather feather-feather"></i>
                        <span class="hide-menu">Roles & Permission</span>
                    </a>
                    <ul class="list-unstyled sub-menu">
                        @can('view Permission')
                            <li><a href="{{ route('admin.permissions.index') }}">Permission</a></li>
                        @endcan

                        @can('view Role')
                            <li><a href="{{ route('admin.roles.index') }}">Roles</a></li>
                        @endcan

                        @can('view User')
                            <li><a href="{{ route('admin.users.index') }}">Users</a></li>
                        @endcan
                    </ul>
                </li>
            @endcanany

            {{-- Settings / Contact --}}
            @can('view Contact')
                <li>
                    <a href="{{ route('admin.contacts.index') }}">
                        <i class="list-icon material-icons">grid_on</i>
                        <span class="hide-menu">Settings</span>
                    </a>
                </li>
            @endcan


        </ul>
        <!-- /.side-menu -->
    </nav>
    <!-- /.sidebar-nav -->
</aside>