@php use App\Enums\NotificationTypeEnum; @endphp
<li class="nav-item dropdown-notifications navbar-dropdown dropdown me-3 me-xl-1">
    <a
        class="nav-link dropdown-toggle hide-arrow"
        href="javascript:void(0);"
        data-bs-toggle="dropdown"
        data-bs-auto-close="outside"
        aria-expanded="false">
        <i class="ti ti-bell ti-md"></i>
        @if($notificationsCount > 0)
            <span class="badge bg-danger rounded-pill badge-notifications">{{ $notificationsCount }}</span>
        @endif
    </a>
    <ul class="dropdown-menu dropdown-menu-end py-0">
        <li class="dropdown-menu-header border-bottom">
            <div class="dropdown-header d-flex align-items-center py-3">
                <h5 class="text-body mb-0 me-auto">{{ trans("admin.notifications") }}</h5>
                @if($notificationsCount > 0)
                    <a
                        href="javascript:void(0)"
                        class="dropdown-notifications-all text-body"
                        data-bs-toggle="tooltip"
                        data-bs-placement="top"
                        data-notification-mark-read="true"
                        title="{{ trans("admin.mark_all_as_read") }}"
                    >
                        <i class="ti ti-mail-opened fs-4"></i>
                    </a>
                @endif
            </div>
        </li>
        <li class="dropdown-notifications-list scrollable-container">
            <ul class="list-group list-group-flush">
                @forelse($notifications as $notification)
                    @php $type = NotificationTypeEnum::tryFrom($notification->type) @endphp

                    <li class="list-group-item list-group-item-action dropdown-notifications-item {{ $notification->read_at != null ? "marked-as-read" : "" }}">
                        <div class="d-flex">
                            <div class="flex-shrink-0 me-3">
                                <div class="avatar">
                                    <span class="avatar-initial rounded-circle bg-label-{{ $type->iconColor() }}">
                                        <i class="ti {{ $type->icon() }}"></i>
                                    </span>
                                </div>
                            </div>
                            <div class="flex-grow-1">
                                @php $hasLink = (array_key_exists('link', $notification->data) and $notification->data['link'] !== "#" ) ? $notification->data['link'] : null @endphp

                                <{{ $hasLink != null ? "a" : "div" }} {!! $hasLink != null ? 'href="' . route('admin.notification.redirect', $notification->id) . '"' : '' !!}>

                                    <h6 class="mb-1"><strong>{{ $type->name() }}</strong></h6>
                                    @if(app()->getLocale() == "ar" and array_key_exists('message_ar', $notification->data))
                                        <p class="mb-0">{!! $notification->data['message_ar'] !!}</p>
                                    @elseif(array_key_exists('message_en', $notification->data))
                                        <p class="mb-0">{!! $notification->data['message_en'] !!}</p>
                                    @endif
                                    <small class="text-muted">{{ $notification->created_at->diffForHumans() }}</small>
                                </{{ $hasLink != null ? "a" : "div" }}>
                            </div>
                            <div class="flex-shrink-0 dropdown-notifications-actions">
                                @if($notification->read_at == null)
                                    <a href="javascript:void(0)" class="dropdown-notifications-read" data-notification-mark-read="{{ $notification->id }}">
                                        <span class="badge badge-dot"></span>
                                    </a>
                                @endif
                            </div>
                        </div>
                    </li>
                @empty
                    <li class="list-group-item list-group-item-action dropdown-notifications-item">
                        <p class="text-center">{{ trans("admin.no_notification_found") }}</p>
                    </li>
                @endforelse
            </ul>
        </li>
        <li class="dropdown-menu-footer border-top">
            <a href="{{ route('admin.notification.index') }}" class="dropdown-item d-flex justify-content-center text-primary p-2 h-px-40 mb-1 align-items-center">
                {{ trans("admin.view_all_notifications") }}
            </a>
        </li>
    </ul>
</li>
<!--/ Notification -->