<?php  if (!defined('ABSPATH')) exit; ?>

<div class="h-100 w-100 pt-4 d-flex gap-4">
    <div class="container">
        <div class="d-flex align-items-center gap-1">
            <h3><i class="bi bi-bell"></i> <?php esc_html_e('Notifications', 'assistini'); ?></h3>
        </div>
        <div class="row justify-content-end mt-3">
            <div class="col-12 col-md-auto my-1 ps-1" data-id="all">
                <button type="submit" class="ass-notification-item-delete btn btn-sm btn-danger px-5"><?php esc_html_e('Delete all', 'assistini'); ?></button>
            </div>
        </div>
        <div class="row mt-2">
            <div class="col-12">
                <div class="ass-notification-area rounded border ass-shadow text-center" style="display: none;">
                    <p class="ass-size-16 pt-4"><?php esc_html_e('You have no new Notifications', 'assistini'); ?></p>
                </div>
                <div class="ass-notification-area ass-custom-scrollbar rounded border ass-shadow">
                    <?php
                    $assi_notifications = ASSI_Notification::getNotificationsHtml();
                    if (!empty($assi_notifications) && $assi_notifications != false) {
                        echo wp_kses($assi_notifications, array(
                            'div' => array(
                                'class' => array(),
                                'data-id' => array(),
                                'data-type' => array(),
                                'data-session-id' => array(),
                            ),
                            'img' => array(
                                'class' => array(),
                                'src' => array(),
                            ),
                            'small' => array(
                                'class' => array(),
                            ),
                            'i' => array(
                                'class' => array(),
                            ),
                        ));
                    }
                    ?>
                </div>
            </div>
        </div>
    </div>
</div>