Loading data

@* First, Previous and Next by cursor, for a source that gives both cursors and a total. The cursor
   is opaque to the table; a new sort starts again from the first page. *@
<Table TItem="Order" ItemsProvider="LoadOrders" PageSize="5" Paging="DataPaging.NextPrevious" InitialSort="-date"
       Caption="Orders by cursor" QueryPrefix="cursor-" Grow>
    <PropertyColumn Property="o => o.Number" Title="Order" Align="CellAlign.Start" />
    <PropertyColumn Property="o => o.Customer" Sortable />
    <PropertyColumn Property="o => o.Date" Format="MMM d" Sortable />
    <PropertyColumn Property="o => o.Total" Format="C" Sortable />
</Table>

@code {
    // Here the cursor is an offset in base64; a real API's would be its own token.
    private static ValueTask<DataResult<Order>> LoadOrders(DataRequest<Order> request)
    {
        var size = request.Take ?? 5;
        var at = Decode(request.Cursor);
        var query = request.ApplySorting(request.ApplyFiltering(Orders.All.AsQueryable()));
        var total = query.Count();
        return ValueTask.FromResult(new DataResult<Order>(query.Skip(at).Take(size).ToList(), total)
        {
            Next = at + size < total ? Encode(at + size) : null,
            Previous = at > 0 ? Encode(Math.Max(0, at - size)) : null,
        });
    }

    private static string Encode(int offset) => Convert.ToBase64String(System.Text.Encoding.UTF8.GetBytes(offset.ToString()));

    // A cursor this source didn't make reads as the first page.
    private static int Decode(string? cursor)
    {
        Span<byte> bytes = stackalloc byte[32];
        return cursor is not null && Convert.TryFromBase64String(cursor, bytes, out var length)
            && int.TryParse(bytes[..length], System.Globalization.NumberStyles.None, System.Globalization.CultureInfo.InvariantCulture, out var at) ? at : 0;
    }
}

@* Loading as you scroll: the next page loads when the last row comes into view in the table's own
   scroll box (MaxHeight), with a spinner under the rows while it does. The Load more button is
   there for the keyboard, out of sight until it has focus. *@
<Table TItem="AuditEvent" ItemsProvider="LoadEvents" PageSize="8" Paging="DataPaging.LoadOnScroll" MaxHeight="Length.Rem(18)"
       ItemKey="e => e.Id.ToString()" Caption="Audit log, loading on scroll" QueryPrefix="scroll-" Grow>
    <PropertyColumn Property="e => e.At" Title="Time (UTC)" Format="MMM d, HH:mm" />
    <PropertyColumn Property="e => e.Who" />
    <PropertyColumn Property="e => e.What" Title="Action" />
</Table>

@code {
    private static async ValueTask<DataResult<AuditEvent>> LoadEvents(DataRequest<AuditEvent> request)
    {
        var (items, next) = await Events.ListAsync(request.Cursor, request.Take ?? 8);
        return new DataResult<AuditEvent>(items) { Next = next };
    }
}

@inject NavigationManager Navigation

@* When loading fails: the provider throws, and the table shows "Couldn't load the rows." with
   Retry in place of the rows (and logs the exception). The link above it takes this stand-in API
   down or brings it back (?flaky-api=), so Retry can fail or succeed. *@
<Stack Gap="3" Grow>
    <TextBlock Size="TextSize.Sm">
        @(Down ? "The orders API is down." : "The orders API is up.")
        <Anchor Href="@Navigation.GetUriWithQueryParameter("flaky-api", Down ? "up" : null)">@(Down ? "Bring it back" : "Take it down")</Anchor>
    </TextBlock>
    <Table TItem="Order" ItemsProvider="LoadOrders" PageSize="5" InitialSort="-date" Caption="Orders from a flaky API" QueryPrefix="flaky-">
        <PropertyColumn Property="o => o.Number" Title="Order" Align="CellAlign.Start" />
        <PropertyColumn Property="o => o.Customer" Sortable />
        <PropertyColumn Property="o => o.Date" Format="MMM d" Sortable />
        <PropertyColumn Property="o => o.Total" Format="C" Sortable />
    </Table>
</Stack>

@code {
    [SupplyParameterFromQuery(Name = "flaky-api")] private string? Api { get; set; }

    private bool Down => Api != "up";

    private async ValueTask<DataResult<Order>> LoadOrders(DataRequest<Order> request)
    {
        await Task.Delay(300, request.CancellationToken); // a network call
        if (Down)
        {
            throw new HttpRequestException("The orders API didn't answer.");
        }

        return request.ToResult(Orders.All.AsQueryable());
    }
}