@php
    $items = config('vpm-navigation.bottom', []);
    $activeKey = $active ?? '';
@endphp

<nav class="vpm-app-bottom-nav" aria-label="App navigation">
    <ul class="vpm-app-bottom-nav__list">
        @foreach ($items as $item)
            @php
                $isActive = $activeKey === ($item['key'] ?? '');
                if (($item['key'] ?? '') === 'home' && in_array($activeKey, ['home', 'trading'], true)) {
                    $isActive = true;
                }
            @endphp
            <li class="vpm-app-bottom-nav__item">
                <a
                    href="{{ route($item['route']) }}"
                    @class([
                        'vpm-app-bottom-nav__link',
                        'vpm-app-bottom-nav__link--active' => $isActive,
                    ])
                    @if ($isActive) aria-current="page" @endif
                >
                    <span class="material-icons notranslate" aria-hidden="true">{{ $item['icon'] }}</span>
                    <span class="vpm-app-bottom-nav__label">{{ $item['label'] }}</span>
                </a>
            </li>
        @endforeach
    </ul>
</nav>