@props(['href', 'icon', 'text', 'active' => false, 'logout' => false, 'children' => [], 'groupLabel' => null])

@php
    $hasActiveChild = collect($children)->contains(fn($child) => request()->fullUrlIs($child['href']));
    $isActive = $active || $hasActiveChild;
@endphp

@if ($groupLabel)
    <li class="nav-item">
        <!-- Group Label -->
        <p class="navbar-vertical-label">{{ $groupLabel }}</p>
        <hr class="navbar-vertical-line" />
    </li>
@endif

<li class="nav-item">
    <div class="nav-item-wrapper">
        @if ($logout)
            <form method="POST" action="{{ $href }}" class="w-100">
                @csrf
                <button type="submit" class="nav-link label-1 w-100 text-start {{ $isActive ? 'active' : '' }}">
                    <div class="d-flex align-items-center">
                        <span class="nav-link-icon">
                            <span data-feather="{{ $icon }}"></span>
                        </span>
                        <span class="nav-link-text-wrapper">
                            <span class="nav-link-text">{{ $text }}</span>
                        </span>
                    </div>
                </button>
            </form>
        @elseif (count($children) > 0)
            <a class="nav-link dropdown-indicator label-1 {{ $isActive ? 'active' : '' }}"
               href="#{{ Str::slug($text) }}"
               role="button"
               data-bs-toggle="collapse"
               aria-expanded="{{ $isActive ? 'true' : 'false' }}"
               aria-controls="{{ Str::slug($text) }}">
                <div class="d-flex align-items-center">
                    <div class="dropdown-indicator-icon-wrapper">
                        <span class="fas fa-caret-right dropdown-indicator-icon"></span>
                    </div>
                    <span class="nav-link-icon">
                        <span data-feather="{{ $icon }}"></span>
                    </span>
                    <span class="nav-link-text">{{ $text }}</span>
                    @if ($isActive)
                        <span class="fa-solid fa-circle text-info ms-1 new-page-indicator" style="font-size: 6px"></span>
                    @endif
                </div>
            </a>
            <div class="parent-wrapper label-1">
                <ul class="nav collapse parent {{ $isActive ? 'show' : '' }}" id="{{ Str::slug($text) }}">
                    <li class="collapsed-nav-item-title d-none">
                        {{ $text }}
                    </li>
                    @foreach ($children as $child)
                        <li class="nav-item">
                            <a class="nav-link {{ request()->fullUrlIs($child['href']) ? 'active' : '' }}"
                               href="{{ $child['href'] }}">
                                <div class="d-flex align-items-center">
                                    <span class="nav-link-text">{{ $child['text'] }}</span>
                                </div>
                            </a>
                        </li>
                    @endforeach
                </ul>
            </div>
        @else
            <a class="nav-link label-1 {{ $isActive ? 'active' : '' }}" href="{{ $href }}" role="button">
                <div class="d-flex align-items-center">
                    <span class="nav-link-icon">
                        <span data-feather="{{ $icon }}"></span>
                    </span>
                    <span class="nav-link-text-wrapper">
                        <span class="nav-link-text">{{ $text }}</span>
                    </span>
                    @if ($isActive)
                        <span class="fa-solid fa-circle text-info ms-1 new-page-indicator" style="font-size: 6px"></span>
                    @endif
                </div>
            </a>
        @endif
    </div>
</li>