@page
@model CoreWiki.Pages.All

@{
    ViewData["Title"] = "All articles";
}

<h2>All articles</h2>

@foreach (var item in Model.Articles)
{
    <div class="card border-primary my-2 mx-1">
        <div class="card-body">
            <h3 class="card-title">
                <a href="~/@item.Slug">@item.Topic</a>
            </h3>
            <h6 class="card-subtitle mb-2 text-muted">
                <span data-value="@item.Published" class="timeStampValue">@item.Published</span>
            </h6>

            <a class="card-link" asp-page="./Edit" asp-route-slug="@item.Slug">Edit</a>
            <a class="card-link" asp-page="./Delete" asp-route-slug="@item.Slug">Delete</a>
        </div>
    </div>
}

<div class="col-md-12 d-flex">
    <nav class="flex-grow-1">
        <ul class="pagination">
            @for (var i = 1; i <= Model.TotalPages; i++)
            {
                var i1 = i;
                <li class="page-item @(i1 == Model.PageNumber ? "active" : "")">
                    <a class="page-link" asp-page="All" asp-route-PageNumber="@i1" asp-route-PageSize="@Model.PageSize">@i1</a>
                </li>
            }
        </ul>
    </nav>
    <form class="ms-auto" method="get" asp-page="All">
            <input hidden name="@nameof(Model.PageNumber)" value="@Model.PageNumber"/>
            <select class="form-select" asp-for="@Model.PageSize" onchange="this.form.submit()">
                <option value="2">2</option>
                <option value="10">10</option>
                <option value="25">25</option>
                <option value="50">50</option>
            </select>
        </form>
</div>