@php
    $locale = app()->getLocale();
    $authUser = auth()->user();
    $accountRequestsUrl = (($customerNotificationsUrl ?? null) && ($accountBadgeCount ?? 0) > 0)
        ? $customerNotificationsUrl
        : route('site.account.requests', ['locale' => $locale, 'tab' => 'requests']);
    $accountAvatarUrl = $authUser
        ? (\App\Support\UserAvatar::url($authUser->avatar) ?: \App\Support\UserAvatar::fallbackUrl((int) $authUser->id))
        : null;
    $accountInitial = mb_substr((string) ($authUser?->name ?: $authUser?->mobile ?: '?'), 0, 1);

    $items = array_values(array_filter([
        [
            'type' => 'link',
            'label' => __('site.nav_home'),
            'href' => route('site.home', ['locale' => $locale]),
            'active' => request()->routeIs('site.home'),
            'svg' => 'home',
            'slot' => 'home',
        ],
        site_feature_enabled('activities') ? [
            'type' => 'link',
            'label' => __('site.nav_activities_short'),
            'href' => route('site.activities.index', ['locale' => $locale]),
            'active' => request()->routeIs('site.activities.*'),
            'svg' => 'details',
            'slot' => 'feature',
        ] : null,
        [
            'type' => $authUser ? 'link' : 'button',
            'label' => $authUser ? __('site.member_profile_short') : __('site.member_login_short'),
            'href' => $authUser ? $accountRequestsUrl : null,
            'active' => request()->routeIs('site.account.*'),
            'svg' => $authUser ? null : 'login',
            'avatar' => (bool) $authUser,
            'slot' => 'member',
            'center' => true,
        ],
        site_feature_enabled('news') ? [
            'type' => 'link',
            'label' => __('site.nav_news_short'),
            'href' => route('site.news.index', ['locale' => $locale]),
            'active' => request()->routeIs('site.news.*'),
            'svg' => 'document-add',
            'slot' => 'feature',
        ] : null,
    ]));
@endphp

<nav class="site-mobile-bottom-nav" aria-label="{{ __('site.nav_menu') }}">
    <div class="site-mobile-bottom-nav-shell" style="--bottom-nav-cols: {{ count($items) }};">
        @foreach ($items as $item)
            @php
                $classes = 'site-mobile-bottom-nav-item'
                    .($item['active'] ? ' site-mobile-bottom-nav-item--active' : '')
                    .(! empty($item['center']) ? ' site-mobile-bottom-nav-item--center' : '');
            @endphp

            @if ($item['type'] === 'link')
                <a href="{{ $item['href'] }}" class="{{ $classes }}">
                    <span @class([
                        'absolute inset-x-5 top-0 h-1 rounded-full bg-brand-accent transition',
                        'opacity-100' => $item['active'],
                        'opacity-0' => ! $item['active'],
                    ]) aria-hidden="true"></span>
                    @if (! empty($item['avatar']))
                        <span class="site-mobile-bottom-nav-avatar relative">
                            @if (($accountBadgeCount ?? 0) > 0)
                                <span class="site-mobile-bottom-nav-avatar__badge" aria-hidden="true">{{ $accountBadgeCount > 9 ? '9+' : $accountBadgeCount }}</span>
                            @endif
                            @if ($accountAvatarUrl)
                                <img src="{{ $accountAvatarUrl }}" alt="" class="site-mobile-bottom-nav-avatar__img" data-account-avatar />
                            @else
                                <span class="site-mobile-bottom-nav-avatar__img site-mobile-bottom-nav-avatar__img--initial" data-account-avatar-fallback aria-hidden="true">{{ $accountInitial }}</span>
                            @endif
                        </span>
                    @else
                        <x-site.svg-icon :name="$item['svg']" class="h-6 w-6" aria-hidden="true" />
                    @endif
                    <span class="truncate">{{ $item['label'] }}</span>
                </a>
            @else
                <button
                    type="button"
                    class="{{ $classes }}"
                    @click="$store.siteAuth.show()"
                >
                    <span @class([
                        'absolute inset-x-5 top-0 h-1 rounded-full bg-brand-accent transition',
                        'opacity-100' => $item['active'],
                        'opacity-0' => ! $item['active'],
                    ]) aria-hidden="true"></span>
                    <x-site.svg-icon :name="$item['svg']" class="h-6 w-6" aria-hidden="true" />
                    <span class="truncate">{{ $item['label'] }}</span>
                </button>
            @endif
        @endforeach
    </div>
</nav>