diff --git a/Sources/BlazorApp/.vs/BlazorApp/DesignTimeBuild/.dtbcache.v2 b/Sources/BlazorApp/.vs/BlazorApp/DesignTimeBuild/.dtbcache.v2
index fabc074..98bf87c 100644
Binary files a/Sources/BlazorApp/.vs/BlazorApp/DesignTimeBuild/.dtbcache.v2 and b/Sources/BlazorApp/.vs/BlazorApp/DesignTimeBuild/.dtbcache.v2 differ
diff --git a/Sources/BlazorApp/.vs/BlazorApp/v17/.suo b/Sources/BlazorApp/.vs/BlazorApp/v17/.suo
index 704c603..8a112c5 100644
Binary files a/Sources/BlazorApp/.vs/BlazorApp/v17/.suo and b/Sources/BlazorApp/.vs/BlazorApp/v17/.suo differ
diff --git a/Sources/BlazorApp/BlazorApp/BlazorApp.csproj b/Sources/BlazorApp/BlazorApp/BlazorApp.csproj
index 5af9042..6600272 100644
--- a/Sources/BlazorApp/BlazorApp/BlazorApp.csproj
+++ b/Sources/BlazorApp/BlazorApp/BlazorApp.csproj
@@ -11,4 +11,10 @@
+
+
+
+
+
+
diff --git a/Sources/BlazorApp/BlazorApp/Pages/List.razor b/Sources/BlazorApp/BlazorApp/Pages/List.razor
index 9bdf8e1..9a798bd 100644
--- a/Sources/BlazorApp/BlazorApp/Pages/List.razor
+++ b/Sources/BlazorApp/BlazorApp/Pages/List.razor
@@ -1,34 +1,28 @@
@page "/list"
+@using BlazorApp.Models
List
-@if (items != null)
-{
-
-
-
- Id |
- Display Name |
- Stack Size |
- Maximum Durability |
- Enchant Categories |
- Repair With |
- Created Date |
-
-
-
- @foreach (var item in items)
- {
-
- @item.Id |
- @item.DisplayName |
- @item.StackSize |
- @item.MaxDurability |
- @(string.Join(", ", item.EnchantCategories)) |
- @(string.Join(", ", item.RepairWith)) |
- @item.CreatedDate.ToShortDateString() |
-
- }
-
-
-}
+
+
+
+
+
+
+
+ @(string.Join(", ", ((Item)context).EnchantCategories))
+
+
+
+
+ @(string.Join(", ", ((Item)context).RepairWith))
+
+
+
+
\ No newline at end of file
diff --git a/Sources/BlazorApp/BlazorApp/Pages/List.razor.cs b/Sources/BlazorApp/BlazorApp/Pages/List.razor.cs
index 12a68cf..2286314 100644
--- a/Sources/BlazorApp/BlazorApp/Pages/List.razor.cs
+++ b/Sources/BlazorApp/BlazorApp/Pages/List.razor.cs
@@ -1,15 +1,30 @@
-using BlazorApp.Models;
+namespace BlazorApp.Pages;
+
+using BlazorApp.Models;
+using Blazorise.DataGrid;
using Microsoft.AspNetCore.Components;
-namespace BlazorApp.Pages
+public partial class List
{
- public partial class List
+ private List- items;
+ private int totalItem;
+ [Inject]
+ public HttpClient Http { get; set; }
+ [Inject]
+ public NavigationManager NavigationManager { get; set; }
+ private async Task OnReadData(DataGridReadDataEventArgs
- e)
{
- private Item[] items;
- [Inject]
- public HttpClient Http { get; set; }
- [Inject]
- public NavigationManager NavigationManager { get; set; }
- protected override async Task OnInitializedAsync() => items = await Http.GetFromJsonAsync
- ($"{NavigationManager.BaseUri}fake-data.json");
+ if (e.CancellationToken.IsCancellationRequested)
+ {
+ return;
+ }
+ // When you use a real API, we use this follow code
+ //var response = await Http.GetJsonAsync
- ( $"http://my-api/api/data?page={e.Page}&pageSize={e.PageSize}" );
+ var response = (await Http.GetFromJsonAsync
- ($"{NavigationManager.BaseUri}fake-data.json")).Skip((e.Page - 1) * e.PageSize).Take(e.PageSize).ToList();
+ if (!e.CancellationToken.IsCancellationRequested)
+ {
+ totalItem = (await Http.GetFromJsonAsync
>($"{NavigationManager.BaseUri}fake-data.json")).Count;
+ items = new List- (response); // an actual data for the current page
+ }
}
-}
+}
\ No newline at end of file
diff --git a/Sources/BlazorApp/BlazorApp/Pages/_Layout.cshtml b/Sources/BlazorApp/BlazorApp/Pages/_Layout.cshtml
index 2498c7a..bef526c 100644
--- a/Sources/BlazorApp/BlazorApp/Pages/_Layout.cshtml
+++ b/Sources/BlazorApp/BlazorApp/Pages/_Layout.cshtml
@@ -28,5 +28,10 @@
+
+
+
+
+