@page "/posts"

@{
    // Heading and intro come from the "posts" page record; fall back to a sensible
    // default only if that record is missing, so the page still renders.
    var title = _page?.Title ?? "Beiträge";
}

<PageTitle>@title</PageTitle>

<h1>@title</h1>

@if (_page is not null && !string.IsNullOrWhiteSpace(_page.Body))
{
    <article class="markdown-body">@Body</article>
}

@if (_unavailable)
{
    <p>Die Beiträge sind gerade nicht erreichbar. Bitte später erneut versuchen.</p>
}
else if (_posts.Count == 0)
{
    <p>Zurzeit gibt es keine Beiträge.</p>
}
else
{
    @* The newest post (GetPostsAsync sorts newest first) opens the page as a large
       card across the full width; the rest follow in the grid. *@
    <ul class="post-list post-list-grid">
        @for (var i = 0; i < _posts.Count; i++)
        {
            <li class="@(i == 0 ? "post-list-featured" : null)"><PostCard Value="_posts[i]" Featured="i == 0" /></li>
        }
    </ul>
}