tsv08kulmbach-website/app/components/instagram-feed.php

<?php

declare(strict_types=1);

/**
 * "Aktuelles": Instagram-Grid aus dem lokalen Cache (data/instagram.json,
 * geschrieben von bin/instagram-sync.php). Besucher laden ausschließlich
 * lokal gehostete Bilder. Ohne Cache: CTA-Karte als Degradation.
 */
$club = json_load('club');
$feed = json_load('instagram');
$posts = $feed['posts'] ?? [];
$maxPosts = (int) config('instagram.max_posts', 9);
?>
        <section class="section instagram" id="aktuelles">
            <div class="container">
                <h2>Aktuelles</h2>
<?php if ($posts !== []): ?>
                <p class="text-muted">Unsere neuesten Beiträge auf <a href="<?= e($club['social']['instagram']) ?>" rel="noopener">Instagram (@<?= e($feed['username'] ?? 'tsv08kulmbach') ?>)</a>.</p>
                <ul class="instagram__grid">
<?php foreach (array_slice($posts, 0, $maxPosts) as $post): ?>
                    <li class="instagram__item">
                        <a class="instagram__link" href="<?= e($post['url']) ?>" rel="noopener">
                            <img src="<?= e(asset($post['image'])) ?>"
                                alt="<?= e($post['alt'] ?? 'Instagram-Beitrag des TSV 08 Kulmbach') ?>"
                                width="640" height="800" loading="lazy" decoding="async">
<?php if (!empty($post['is_video'])): ?>
                            <span class="instagram__badge" aria-hidden="true">▶</span>
<?php endif; ?>
                        </a>
                    </li>
<?php endforeach; ?>
                </ul>
<?php else: ?>
                <div class="instagram__fallback">
                    <p>Was bei uns gerade los ist, siehst du auf unserem Instagram-Kanal.</p>
                    <p><a class="btn" href="<?= e($club['social']['instagram']) ?>" rel="noopener">Folge uns auf Instagram</a></p>
                </div>
<?php endif; ?>
            </div>
        </section>