<?php $currentStatus = $_GET['status'] ?? 'all'; ?>


<div class="mb-3 flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3">
    <div class="flex items-center gap-2">
        <a href="/admin/comments" class="px-2.5 py-1 text-xs font-medium rounded border <?= $currentStatus === 'all' ? 'bg-blue-600 text-white border-blue-600' : 'bg-white text-gray-600 border-gray-300 hover:bg-gray-50' ?>">All</a>
        <a href="/admin/comments?status=pending" class="px-2.5 py-1 text-xs font-medium rounded border <?= $currentStatus === 'pending' ? 'bg-blue-600 text-white border-blue-600' : 'bg-white text-gray-600 border-gray-300 hover:bg-gray-50' ?>">Pending</a>
        <a href="/admin/comments?status=approved" class="px-2.5 py-1 text-xs font-medium rounded border <?= $currentStatus === 'approved' ? 'bg-blue-600 text-white border-blue-600' : 'bg-white text-gray-600 border-gray-300 hover:bg-gray-50' ?>">Approved</a>
        <a href="/admin/comments?status=spam" class="px-2.5 py-1 text-xs font-medium rounded border <?= $currentStatus === 'spam' ? 'bg-blue-600 text-white border-blue-600' : 'bg-white text-gray-600 border-gray-300 hover:bg-gray-50' ?>">Spam</a>
    </div>
    <div class="flex items-center gap-3">
        <input type="text" data-search-table="comments-table" placeholder="Search comments..." class="w-full sm:w-64 px-3 py-1.5 border border-gray-300 rounded-lg text-xs focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none">
        <span id="comments-table-count" class="hidden sm:inline text-xs text-gray-500 whitespace-nowrap"></span>
    </div>
</div>


<div id="bulkBar" class="hidden mb-2 px-3 py-2 bg-primary-50 border border-primary-200 rounded-lg flex items-center gap-3 text-xs">
    <span class="font-medium text-primary-700"><span id="bulkCount">0</span> selected</span>
    <button type="button" onclick="bulkDeleteSelected()" class="inline-flex items-center gap-1 px-2.5 py-1 bg-red-600 text-white text-xs font-medium rounded hover:bg-red-700 transition-colors">
        <svg class="w-3 h-3" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/></svg>
        Delete
    </button>
    <button type="button" onclick="bulkClearAll()" class="text-xs text-gray-500 hover:text-gray-700">Clear</button>
</div>


<div class="bg-white rounded-lg shadow-sm border border-gray-200">
    <div class="overflow-x-auto">
        <table id="comments-table" class="w-full" data-bulk-delete="/admin/comments/bulk-delete" data-bulk-noun="comment">
            <thead>
                <tr class="bg-gray-50">
                    <th class="px-2 py-2 w-8"><input type="checkbox" data-bulk-select-all class="rounded border-gray-300 text-primary-600 focus:ring-primary-500"></th>
                    <th class="px-2 py-2 text-left text-[11px] font-semibold uppercase tracking-wider text-gray-500 hide-mobile">User</th>
                    <th class="px-2 py-2 text-left text-[11px] font-semibold uppercase tracking-wider text-gray-500">Video</th>
                    <th class="px-2 py-2 text-left text-[11px] font-semibold uppercase tracking-wider text-gray-500">Comment</th>
                    <th class="px-2 py-2 text-left text-[11px] font-semibold uppercase tracking-wider text-gray-500">Status</th>
                    <th class="px-2 py-2 text-left text-[11px] font-semibold uppercase tracking-wider text-gray-500 hide-mobile">Date</th>
                    <th class="px-2 py-2 text-right text-[11px] font-semibold uppercase tracking-wider text-gray-500">Actions</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-gray-100">
                <?php if (!empty($comments)): ?>
                    <?php foreach ($comments as $comment): $cSubj = Comment::subject($comment); ?>
                        <tr class="hover:bg-gray-50 transition-colors" data-searchable="<?= htmlspecialchars(($comment['username'] ?? 'Anonymous') . ' ' . ($cSubj['title'] ?? '') . ' ' . ($comment['body'] ?? '')) ?>">
                            <td class="px-2 py-1.5"><input type="checkbox" data-bulk-id="<?= (int)$comment['id'] ?>" class="rounded border-gray-300 text-primary-600 focus:ring-primary-500"></td>
                            <td class="px-2 py-1.5 text-xs font-medium text-gray-900 hide-mobile"><?= htmlspecialchars($comment['username'] ?? 'Anonymous') ?></td>
                            <td class="px-2 py-1.5 text-xs">
                                <a href="<?= $cSubj['type'] === 'album' ? '/admin/albums/' . (int)($comment['album_id'] ?? 0) . '/edit' : '/admin/videos/' . (int)($comment['video_id'] ?? 0) . '/edit' ?>" class="text-blue-600 hover:text-blue-800 line-clamp-1 inline-flex items-center gap-1"><span class="inline-flex items-center px-1 py-0.5 rounded text-[9px] font-bold uppercase <?= $cSubj['type'] === 'album' ? 'bg-fuchsia-100 text-fuchsia-700' : 'bg-slate-100 text-slate-600' ?>"><?= $cSubj['label'] ?></span> <?= htmlspecialchars($cSubj['title'] ?: '—') ?></a>
                            </td>
                            <td class="px-2 py-1.5 text-xs text-gray-600 max-w-xs truncate"><?= htmlspecialchars(mb_strimwidth($comment['body'] ?? '', 0, 80, '...')) ?></td>
                            <td class="px-2 py-1.5 text-xs">
                                <?php if (($comment['status'] ?? '') === 'approved'): ?>
                                    <span class="inline-flex items-center px-1.5 py-0.5 rounded-full text-[10px] font-medium bg-green-100 text-green-800">Approved</span>
                                <?php elseif (($comment['status'] ?? '') === 'pending'): ?>
                                    <span class="inline-flex items-center px-1.5 py-0.5 rounded-full text-[10px] font-medium bg-yellow-100 text-yellow-800">Pending</span>
                                <?php elseif (($comment['status'] ?? '') === 'spam'): ?>
                                    <span class="inline-flex items-center px-1.5 py-0.5 rounded-full text-[10px] font-medium bg-red-100 text-red-800">Spam</span>
                                <?php else: ?>
                                    <span class="inline-flex items-center px-1.5 py-0.5 rounded-full text-[10px] font-medium bg-gray-100 text-gray-600"><?= htmlspecialchars($comment['status'] ?? '-') ?></span>
                                <?php endif; ?>
                            </td>
                            <td class="px-2 py-1.5 text-xs text-gray-400 hide-mobile"><?= htmlspecialchars(substr($comment['created_at'] ?? '', 0, 10)) ?></td>
                            <td class="px-2 py-1.5 text-xs text-right">
                                <div class="flex items-center justify-end gap-1">
                                    <?php if (($comment['status'] ?? '') !== 'approved'): ?>
                                        <form method="POST" action="/admin/comments/<?= (int)$comment['id'] ?>/approve">
                                            <?= Router::csrfField() ?>
                                            <button type="submit" class="px-2 py-1 text-[11px] font-medium rounded border bg-green-600 text-white border-green-600 hover:bg-green-700">Approve</button>
                                        </form>
                                    <?php endif; ?>
                                    <?php if (($comment['status'] ?? '') !== 'spam'): ?>
                                        <form method="POST" action="/admin/comments/<?= (int)$comment['id'] ?>/spam">
                                            <?= Router::csrfField() ?>
                                            <button type="submit" class="px-2 py-1 text-[11px] font-medium rounded border bg-white text-gray-600 border-gray-300 hover:bg-gray-50">Spam</button>
                                        </form>
                                    <?php endif; ?>
                                    <form method="POST" action="/admin/comments/<?= (int)$comment['id'] ?>/delete" onsubmit="return confirm('Delete this comment?');">
                                        <?= Router::csrfField() ?>
                                        <button type="submit" class="px-2 py-1 text-[11px] font-medium rounded border bg-red-600 text-white border-red-600 hover:bg-red-700">Del</button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                    <?php endforeach; ?>
                <?php else: ?>
                    <tr>
                        <td colspan="7" class="text-center py-8 text-gray-500 text-xs">No comments found.</td>
                    </tr>
                <?php endif; ?>
            </tbody>
        </table>
    </div>
</div>

<?php require APP_ROOT . '/templates/admin/_admin_pagination.php'; ?>
