@once
    @push('stylesheets')
        <link rel="stylesheet" href="{{ asset('css/ms-sidebar.css') }}"/>
    @endpush
@endonce


<div blade="{{ $viewName ?? 'unknown' }}" id="ms-sidebar">
    <div class="header">
        <p class="title">M/S LIST</p>
        <div class="scroll-arrow">
            <button id="scroll-up"><img src={{asset('images/scroll-up.svg')}}  alt="scroll-up"/></button>
            <button id="scroll-down"><img src={{asset('images/scroll-down.svg')}}  alt="scroll-down"/></button>
        </div>
    </div>
    <ul class="ms-list">
        @foreach ($microservices as $index => $microservice)
            @php
                $moduleCount = $microservice->modules->count();
                $formattedModuleCount = str_pad($moduleCount, 2, '0', STR_PAD_LEFT);
                $isActiveMs = ($activeMicroservice->id == $microservice->id);
            @endphp

            @if($routeName === 'management-permissions.permissions')
                @if($microservice->modules()->first())
                    <li class="ms-list-li microservice-link {{ $isActiveMs ? 'active' : '' }}"
                        data-microservice-id="{{ $microservice->id }}">
                        <a class="microservice-link-a"
                           href="{{ route($routeName, ['microservice' => $microservice, 'module' => $microservice->modules()->first()]) }}">
                            {{ strtoupper($microservice->name) }}:<span>({{ $formattedModuleCount }})</span>
                        </a>
                        <ul class="module-list {{ $isActiveMs ? 'active' : '' }}">
                            @foreach ($microservice->modules as $module)

                                <li class="module-link ">
                                    <a class="module-link-a {{ ($activeModule->id == $module->id) ? 'active' : '' }}"
                                       href="{{ route($routeName, ['microservice' => $microservice, 'module' => $module]) }}">
                                        {{$module->name}}
                                    </a>

                                </li>
                            @endforeach
                        </ul>


                    </li>
                @endif
            @elseif($routeName === 'management-permissions.edit-role-permissions')
                <li class="ms-list-li microservice-link {{ $isActiveMs ? 'active' : '' }}"
                    data-microservice-id="{{ $microservice->id }}">

                    <a class="microservice-link-a" href="{{ route($routeName, ['microservice' => $microservice, 'role' => $role]) }}">

                        @if($microservice->roleHasPermission($role->name ?? ""))
                            <div class="active-status"></div>
                        @endif

                        {{ strtoupper($microservice->name) }}:
                        <span>({{ $formattedModuleCount }})</span>


                    </a>

                </li>
            @else
                <li class="ms-list-li microservice-link {{ $isActiveMs ? 'active' : '' }}"
                    data-microservice-id="{{ $microservice->id }}">
                    <a class="microservice-link-a" href="{{ route($routeName, ['microservice' => $microservice]) }}">
                        {{ strtoupper($microservice->name) }}:<span>({{ $formattedModuleCount }})</span>
                    </a>
                </li>
            @endif

        @endforeach
    </ul>
</div>