<?php
require_once __DIR__ . '/config.php';
require_once __DIR__ . '/db.php';
require_once __DIR__ . '/includes/functions.php';
require_once __DIR__ . '/includes/Language.php';
require_once __DIR__ . '/includes/notify.php';

if (!isLoggedIn()) { redirect('login.php'); }

$lang = new Language($db);
$current_lang = $lang->getCurrentLanguage();
$user_id = $_SESSION['user_id'];
notify_ensure_schema($db);

$success_msg = '';
if (isset($_SESSION['flash_success'])) { $success_msg = $_SESSION['flash_success']; unset($_SESSION['flash_success']); }

// Open a notification: mark it read and jump to its page
if (isset($_GET['open'])) {
    $link = notify_open($db, intval($_GET['open']), $user_id);
    redirect($link !== '' ? notify_url($link, '') : 'notifications.php');
}

// Mark all as read
if (isset($_POST['mark_all_read'])) {
    $db->insert("UPDATE notifications SET is_read = 1 WHERE user_id = ?", [$user_id]);
    redirect('notifications.php');
}

// Delete one notification
if (isset($_GET['delete'])) {
    $del_id = intval($_GET['delete']);
    $db->insert("DELETE FROM notifications WHERE id = ? AND user_id = ?", [$del_id, $user_id]);
    $_SESSION['flash_success'] = "Notification deleted.";
    redirect('notifications.php');
}

// Clear everything
if (isset($_POST['clear_all'])) {
    $db->insert("DELETE FROM notifications WHERE user_id = ?", [$user_id]);
    $_SESSION['flash_success'] = "All notifications cleared.";
    redirect('notifications.php');
}


// Fetch All Notifications
$notifications = $db->select("SELECT * FROM notifications WHERE user_id = ? ORDER BY created_at DESC", [$user_id]);

$company_name = getSetting('company_name', 'WBMCZ');
?>
<!DOCTYPE html>
<html lang="<?php echo $current_lang; ?>">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo $lang->translate('notification', 'Notifications'); ?> - <?php echo $company_name; ?></title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
    <style> body { font-family: 'Inter', sans-serif; } </style>
</head>
<body class="bg-gray-50 min-h-screen">

    <div class="max-w-4xl mx-auto px-4 py-8">
        
        <div class="flex items-center justify-between mb-8">
            <a href="dashboard.php" class="flex items-center text-gray-600 hover:text-indigo-600 font-semibold transition-colors bg-white px-4 py-2 rounded-xl shadow-sm border border-gray-200">
                <i class="fas fa-arrow-left mr-2"></i> <?php echo $lang->translate('back_to_dashboard', 'Back to Dashboard'); ?>
            </a>
            
            <?php if(!empty($notifications)): ?>
                <form method="POST" action="notifications.php" class="m-0">
                    <button type="submit" name="mark_all_read" class="text-sm font-bold text-indigo-600 hover:text-white hover:bg-indigo-600 bg-indigo-50 border border-indigo-100 px-4 py-2 rounded-xl transition-all shadow-sm">
                        <i class="fas fa-check-double mr-1"></i> <?php echo $lang->translate('mark_all_read', 'Mark all read'); ?>
                    </button>
                </form>
            <?php endif; ?>
        </div>

        <h1 class="text-3xl font-extrabold text-gray-900 mb-6"><?php echo $lang->translate('notification', 'Notifications'); ?></h1>

        <div class="bg-white rounded-2xl shadow-sm border border-gray-200 overflow-hidden">
            <div class="divide-y divide-gray-100">
                <?php if(!empty($notifications)): ?>
                    <?php foreach($notifications as $notif): ?>
                        <div class="p-6 hover:bg-gray-50 transition flex items-start group relative">
                            <div class="w-12 h-12 rounded-full bg-indigo-50 text-indigo-600 flex items-center justify-center flex-shrink-0 mt-1 border border-indigo-100">
                                <i class="fas fa-bell"></i>
                            </div>
                            <div class="ml-4 flex-1 pr-10">
                                <div class="flex flex-col sm:flex-row sm:justify-between sm:items-start mb-1">
                                    <h4 class="text-lg font-bold text-gray-800"><?php echo htmlspecialchars($notif['title']); ?></h4>
                                    <span class="text-xs font-semibold text-gray-400 whitespace-nowrap mt-1 sm:mt-0 sm:ml-4 bg-gray-100 px-2 py-1 rounded-md">
                                        <i class="far fa-clock mr-1"></i><?php echo date('d M Y, h:i A', strtotime($notif['created_at'])); ?>
                                    </span>
                                </div>
                                <p class="text-gray-600 mt-2 text-sm leading-relaxed"><?php echo nl2br(htmlspecialchars($notif['message'])); ?></p>
                            </div>
                            
                            <a href="?delete=<?php echo $notif['id']; ?>" onclick="return confirm('<?php echo $lang->translate('delete_confirm', 'Delete this notification?'); ?>');" class="absolute right-6 top-8 text-gray-300 hover:text-red-500 transition opacity-100 sm:opacity-0 sm:group-hover:opacity-100 p-2 bg-white rounded-full shadow-sm sm:shadow-none border sm:border-transparent sm:hover:bg-red-50">
                                <i class="fas fa-trash-alt"></i>
                            </a>
                        </div>
                    <?php endforeach; ?>
                <?php else: ?>
                    <div class="p-16 text-center text-gray-500">
                        <div class="w-20 h-20 bg-gray-50 rounded-full flex items-center justify-center mx-auto mb-4 text-gray-400 text-3xl border border-gray-100">
                            <i class="fas fa-bell-slash"></i>
                        </div>
                        <p class="text-lg font-semibold"><?php echo $lang->translate('no_notifications', 'No new notifications'); ?></p>
                        <p class="text-sm mt-2 text-gray-400">You will see your alerts and updates here.</p>
                    </div>
                <?php endif; ?>
            </div>
        </div>
    </div>
</body>
</html>
