Initial commit

Groceries/Transactions/Index.cshtml

@@ -0,0 +1,81 @@
+@using Groceries.Transactions
+@using Microsoft.AspNetCore.Html;
+@model TransactionListModel
+@{
+    ViewBag.Title = "Transactions";
+
+    string? GetNextSortDir(string col)
+    {
+        if (col != Model.Sort)
+        {
+            return "asc";
+        }
+
+        return Model.Dir switch
+        {
+            null or "" => "asc",
+            "asc" => "desc",
+            _ => null,
+        };
+    }
+
+    string? GetSortDir(string col)
+    {
+        if (col != Model.Sort)
+        {
+            return null;
+        }
+
+        return Model.Dir switch
+        {
+            "asc" or "desc" => Model.Dir,
+            _ => null,
+        };
+    }
+}
+
+<div class="row">
+    <h1 class="row__fill">Transactions</h1>
+    <a class="button button--primary form-field" asp-action="NewTransaction">New transaction</a>
+</div>
+
+<section class="table">
+    <table>
+        <thead>
+            <tr>
+                <th scope="col" class="table__header table__header--sortable">
+                    <a asp-route-sort="@(GetNextSortDir("date") != null ? "date" : "")" asp-route-dir="@GetNextSortDir("date")" asp-route-page="1" data-dir="@GetSortDir("date")">
+                        Date
+                    </a>
+                </th>
+                <th scope="col" class="table__header" style="width: 100%">Store</th>
+                <th scope="col" class="table__header table__header--sortable">
+                    <a asp-route-sort="@(GetNextSortDir("items") != null ? "items" : "")" asp-route-dir="@GetNextSortDir("items")" asp-route-page="1" data-dir="@GetSortDir("items")">
+                        Items
+                    </a>
+                </th>
+                <th scope="col" class="table__header table__header--sortable">
+                    <a asp-route-sort="@(GetNextSortDir("amount") != null ? "amount" : "")" asp-route-dir="@GetNextSortDir("amount")" asp-route-page="1" data-dir="@GetSortDir("amount")">
+                        Amount
+                    </a>
+                </th>
+                @*<th scope="col" class="table__header"></th>*@
+            </tr>
+        </thead>
+        <tbody>
+            @foreach (var transaction in Model.Transactions)
+            {
+                <tr>
+                    <td class="table__cell">
+                        <time datetime="@transaction.CreatedAt.ToString("o")">@transaction.CreatedAt.ToLongDateString()</time>
+                    </td>
+                    <td class="table__cell">@transaction.Store</td>
+                    <td class="table__cell table__cell--numeric">@transaction.TotalItems</td>
+                    <td class="table__cell table__cell--numeric">@transaction.TotalAmount.ToString("c")</td>
+                    @*<td class="table__cell">View</td>*@
+                </tr>
+            }
+        </tbody>
+    </table>
+    <partial name="_TablePaginator" model="Model.Transactions" />
+</section>