<?php
require_once 'functions.php';
requireAuth();

$user = getCurrentUser();
$db = getDB();

// Mark all as read
if (isset($_GET['mark_all_read'])) {
    $stmt = $db->prepare("UPDATE notifications SET is_read = 1 WHERE user_id = ?");
    $stmt->bind_param('i', $user['id']);
    $stmt->execute();
    header('Location: notifications.php');
    exit();
}

// Get all notifications
$page = max(1, intval($_GET['page'] ?? 1));
$limit = 25;
$offset = ($page - 1) * $limit;

$stmt = $db->prepare("SELECT * FROM notifications WHERE user_id = ? ORDER BY created_at DESC LIMIT ? OFFSET ?");
$stmt->bind_param('iii', $user['id'], $limit, $offset);
$stmt->execute();
$notifications = $stmt->get_result();

$totalStmt = $db->prepare("SELECT COUNT(*) as total FROM notifications WHERE user_id = ?");
$totalStmt->bind_param('i', $user['id']);
$totalStmt->execute();
$totalRecords = $totalStmt->get_result()->fetch_assoc()['total'];
$totalPages = ceil($totalRecords / $limit);
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Notifications - <?php echo SITE_NAME; ?></title>
    <link rel="stylesheet" href="assets/css/style.css">
</head>
<body>
    <?php include 'includes/client-sidebar.php'; ?>
    
    <div class="main-content">
        <?php include 'includes/client-header.php'; ?>
        
        <div class="page-content">
            <div class="page-header" style="display: flex; justify-content: space-between; align-items: center;">
                <div>
                    <h2>Notifications</h2>
                    <p>All your account notifications</p>
                </div>
                <a href="?mark_all_read=1" class="btn btn-sm btn-secondary">Mark All as Read</a>
            </div>
            
            <div class="card">
                <div class="card-body" style="padding: 0;">
                    <?php if ($notifications->num_rows > 0): ?>
                        <?php while ($notif = $notifications->fetch_assoc()): ?>
                            <div style="padding: 20px 24px; border-bottom: 1px solid var(--gray-200); <?php echo $notif['is_read'] ? '' : 'background: var(--info-light);'; ?>">
                                <div style="display: flex; gap: 16px; align-items: start;">
                                    <div style="width: 40px; height: 40px; border-radius: 50%; background: <?php 
                                        echo $notif['type'] === 'success' ? 'var(--success-light)' : 
                                            ($notif['type'] === 'warning' ? 'var(--warning-light)' : 
                                            ($notif['type'] === 'error' ? 'var(--danger-light)' : 'var(--info-light)')); 
                                    ?>; display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0;">
                                        <?php echo $notif['type'] === 'success' ? '✓' : ($notif['type'] === 'warning' ? '⚠' : ($notif['type'] === 'error' ? '✕' : 'ℹ')); ?>
                                    </div>
                                    <div style="flex: 1;">
                                        <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px;">
                                            <span style="font-weight: 700; font-size: 14px;"><?php echo e($notif['title']); ?></span>
                                            <span style="font-size: 12px; color: var(--gray);"><?php echo formatDate($notif['created_at']); ?></span>
                                        </div>
                                        <p style="margin: 0; font-size: 13px; color: var(--gray); line-height: 1.5;"><?php echo e($notif['message']); ?></p>
                                    </div>
                                    <?php if (!$notif['is_read']): ?>
                                        <div style="width: 8px; height: 8px; border-radius: 50%; background: var(--primary); flex-shrink: 0; margin-top: 6px;"></div>
                                    <?php endif; ?>
                                </div>
                            </div>
                        <?php endwhile; ?>
                        
                        <?php if ($totalPages > 1): ?>
                        <div style="padding: 16px 24px;">
                            <div class="pagination">
                                <?php for ($i = 1; $i <= $totalPages; $i++): ?>
                                    <?php if ($i === $page): ?>
                                        <span><?php echo $i; ?></span>
                                    <?php else: ?>
                                        <a href="?page=<?php echo $i; ?>"><?php echo $i; ?></a>
                                    <?php endif; ?>
                                <?php endfor; ?>
                            </div>
                        </div>
                        <?php endif; ?>
                    <?php else: ?>
                        <div class="empty-state" style="padding: 60px;">
                            <div class="empty-state-icon">📭</div>
                            <h3>No Notifications</h3>
                            <p>You don't have any notifications yet.</p>
                        </div>
                    <?php endif; ?>
                </div>
            </div>
        </div>
    </div>
    
    <script src="assets/js/main.js"></script>
</body>
</html>
