<?php

$layoutNav = is_array($layoutNav ?? null) ? $layoutNav : [];
$notifNav = is_array($layoutNav['notifications.nav'] ?? null) ? $layoutNav['notifications.nav'] : [];
$unreadCount = (int) ($notifNav['unread_count'] ?? 0);
?>
<li>
    <details class="dropdown app-topbar-notification-menu" data-notification-bell data-summary-chevron="none">
        <summary
            aria-label="<?php e(t('Notifications')); ?>"
            >
            <i class="bi <?php e($unreadCount > 0 ? 'bi-bell-fill' : 'bi-bell'); ?>"></i>
            <?php if ($unreadCount > 0): ?>
                <span class="app-notification-badge" data-notification-badge><?php e($unreadCount > 99 ? '99+' : $unreadCount); ?></span>
            <?php else: ?>
                <span class="app-notification-badge" data-notification-badge style="display:none;"></span>
            <?php endif; ?>
        </summary>
        <ul class="app-topbar-menu-list app-topbar-menu-list--right app-notification-dropdown" data-notification-dropdown
            data-label-dismiss="<?php e(t('Dismiss')); ?>"
            data-label-mark-read="<?php e(t('Mark as read')); ?>">
            <li class="app-notification-dropdown__header">
                <span class="app-notification-dropdown__title"><?php e(t('Notifications')); ?></span>
                <button type="button" class="app-notification-dropdown__mark-all" data-notification-mark-all>
                    <?php e(t('Mark all as read')); ?>
                </button>
            </li>
            <li class="app-notification-dropdown__body" data-notification-list>
                <div class="app-notification-loading" data-notification-loading style="display:none;">
                    <span class="app-notification-loading__spinner"></span>
                    <span class="app-notification-loading__text"><?php e(t('Loading notifications…')); ?></span>
                </div>
                <div class="app-notification-error" data-notification-error style="display:none;">
                    <i class="bi bi-exclamation-triangle"></i>
                    <span><?php e(t('Failed to load notifications')); ?></span>
                </div>
                <?php
                $emptyState = [
                    'message' => t('No notifications'),
                    'size' => 'compact',
                    'icon' => false,
                ];
                require templatePath('partials/app-empty-state.phtml');
                ?>
            </li>
        </ul>
    </details>
</li>
