<?php
/**
 * Blog Listing Page — Gmind Institute
 *
 * Blog cards grid with sidebar (categories, recent posts) and pagination.
 *
 * Expected PHP variables:
 *   $posts        — array of blog post records
 *   $categories   — array of blog categories (optional)
 *   $recentPosts  — array of recent blog posts (optional)
 *   $pagination   — array with 'current', 'total', 'last', 'prev', 'next' keys
 *   $csrfToken    — CSRF token string
 *   $currentPage  — string 'blog'
 *   $title        — page title
 */

$posts       = $posts       ?? [];
$categories  = $categories  ?? [];
$recentPosts = $recentPosts ?? [];
$pagination  = $pagination  ?? ['current' => 1, 'total' => 1, 'last' => 1, 'prev' => null, 'next' => null];
$basePath = defined('BASE_PATH') ? BASE_PATH : '/gmind';
include __DIR__ . '/../layouts/header.php';

?>
<!-- ============================================================
     Page Banner
     ============================================================ -->
<section class="page-banner" aria-label="Page heading">
    <div class="container">
        <h1><?= __('blog.title') ?></h1>
        <p><?= __('blog.subtitle') ?></p>
        <nav class="breadcrumb" aria-label="Breadcrumb">
            <a href="<?= $basePath ?>/"><?= __('blog.breadcrumb_home') ?></a>
            <span aria-hidden="true">/</span>
            <span><?= __('blog.breadcrumb_blog') ?></span>
        </nav>
    </div>
</section>

<!-- ============================================================
     Blog Listing Section
     ============================================================ -->
<section class="blog-listing-section section-offwhite" aria-label="Blog posts">
    <div class="container">
        <div class="blog-layout">
            <!-- Main Content -->
            <div class="blog-main">
                <?php if (!empty($posts)): ?>
                <div class="blog-grid">
                    <?php foreach ($posts as $post): ?>
                    <article class="blog-card">
                        <div class="blog-card-image">
                            <img
                                src="<?= htmlspecialchars(!empty($post['image']) ? upload_url($post['image']) : $basePath . '/images/blog-default.jpg', ENT_QUOTES, 'UTF-8') ?>"
                                alt="<?= htmlspecialchars(getBilingual($post, 'title') ?: 'Blog Post', ENT_QUOTES, 'UTF-8') ?>"
                                loading="lazy"
                            >
                        </div>
                        <div class="blog-card-body">
                            <div class="blog-card-meta">
                                <span class="blog-card-date">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
                                    <?= htmlspecialchars(date('M d, Y', strtotime($post['created_at'] ?? 'now')), ENT_QUOTES, 'UTF-8') ?>
                                </span>
                            </div>
                            <h2 class="blog-card-title">
                                <a href="<?= $basePath ?>/blog/<?= htmlspecialchars($post['slug'] ?? $post['id'] ?? '#', ENT_QUOTES, 'UTF-8') ?>">
                                    <?= htmlspecialchars(getBilingual($post, 'title') ?: 'Untitled', ENT_QUOTES, 'UTF-8') ?>
                                </a>
                            </h2>
                            <p class="blog-card-excerpt">
                                <?= htmlspecialchars(mb_substr(strip_tags(getBilingual($post, 'content') ?: ($post['content'] ?? '')), 0, 180), ENT_QUOTES, 'UTF-8') ?><?= mb_strlen(strip_tags(getBilingual($post, 'content') ?: ($post['content'] ?? ''))) > 180 ? '...' : '' ?>
                            </p>
                            <a href="<?= $basePath ?>/blog/<?= htmlspecialchars($post['slug'] ?? $post['id'] ?? '#', ENT_QUOTES, 'UTF-8') ?>" class="blog-card-link">
                                <?= __('blog.read_more') ?>
                                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><line x1="5" y1="12" x2="19" y2="12"/><polyline points="12 5 19 12 12 19"/></svg>
                            </a>
                        </div>
                    </article>
                    <?php endforeach; ?>
                </div>

                <!-- Pagination -->
                <?php if (($pagination['last'] ?? 1) > 1): ?>
                <nav class="pagination" aria-label="Blog pagination">
                    <?php if ($pagination['prev'] ?? null): ?>
                    <a href="<?= $basePath ?>/blog?page=<?= (int) $pagination['prev'] ?>" class="pagination-btn" aria-label="Previous page">
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="15 18 9 12 15 6"/></svg>
                        <?= __('courses.prev') ?>
                    </a>
                    <?php endif; ?>

                    <?php for ($i = 1; $i <= $pagination['last']; $i++): ?>
                    <?php if ($i === (int) $pagination['current']): ?>
                    <span class="pagination-btn active" aria-current="page"><?= $i ?></span>
                    <?php else: ?>
                    <a href="<?= $basePath ?>/blog?page=<?= $i ?>" class="pagination-btn"><?= $i ?></a>
                    <?php endif; ?>
                    <?php endfor; ?>

                    <?php if ($pagination['next'] ?? null): ?>
                    <a href="<?= $basePath ?>/blog?page=<?= (int) $pagination['next'] ?>" class="pagination-btn" aria-label="Next page">
                        <?= __('courses.next') ?>
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="9 18 15 12 9 6"/></svg>
                    </a>
                    <?php endif; ?>
                </nav>
                <?php endif; ?>

                <?php else: ?>
                <div class="empty-state">
                    <svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 19.5A2.5 2.5 0 016.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 014 19.5v-15A2.5 2.5 0 016.5 2z"/></svg>
                    <h3><?= __('blog.no_posts') ?></h3>
                    <p><?= __('blog.no_posts_desc') ?></p>
                </div>
                <?php endif; ?>
            </div>

            <!-- Sidebar -->
            <aside class="blog-sidebar">
                <?php if (!empty($categories)): ?>
                <div class="sidebar-widget">
                    <h3><?= __('blog.categories') ?></h3>
                    <ul class="sidebar-list">
                        <?php foreach ($categories as $cat): ?>
                        <li>
                            <a href="<?= $basePath ?>/blog?category=<?= htmlspecialchars($cat['slug'] ?? $cat['id'] ?? '', ENT_QUOTES, 'UTF-8') ?>">
                                <?= htmlspecialchars($cat['name'] ?? 'Category', ENT_QUOTES, 'UTF-8') ?>
                                <?php if (!empty($cat['count'])): ?>
                                <span class="count">(<?= (int) $cat['count'] ?>)</span>
                                <?php endif; ?>
                            </a>
                        </li>
                        <?php endforeach; ?>
                    </ul>
                </div>
                <?php endif; ?>

                <?php if (!empty($recentPosts)): ?>
                <div class="sidebar-widget">
                    <h3><?= __('blog.recent_posts') ?></h3>
                    <ul class="sidebar-recent">
                        <?php foreach ($recentPosts as $rp): ?>
                        <li>
                            <a href="<?= $basePath ?>/blog/<?= htmlspecialchars($rp['slug'] ?? $rp['id'] ?? '#', ENT_QUOTES, 'UTF-8') ?>">
                                <?= htmlspecialchars(mb_substr(getBilingual($rp, 'title') ?: 'Post', 0, 60), ENT_QUOTES, 'UTF-8') ?>
                            </a>
                            <span class="recent-date"><?= htmlspecialchars(date('M d, Y', strtotime($rp['created_at'] ?? 'now')), ENT_QUOTES, 'UTF-8') ?></span>
                        </li>
                        <?php endforeach; ?>
                    </ul>
                </div>
                <?php endif; ?>
            </aside>
        </div>
    </div>
</section>

<?php include __DIR__ . '/../layouts/footer.php'; ?>
