Ajout des List, Des fonctionnalités Ajouter, Suprimer, Editer... Pas de connexion à l'API pour l'instant

src/CraftSharp/App.razor

@@ -1,4 +1,5 @@
-<Router AppAssembly="@typeof(App).Assembly">
+<CascadingBlazoredModal>
+    <Router AppAssembly="@typeof(App).Assembly">
         <Found Context="routeData">
             <RouteView RouteData="@routeData" DefaultLayout="@typeof(CraftLayout)" />
             <FocusOnNavigate RouteData="@routeData" Selector="h1" />
@@ -9,4 +10,5 @@
                 <p role="alert">Sorry, there's nothing at this address.</p>
             </LayoutView>
         </NotFound>
-</Router>
+    </Router>
+</CascadingBlazoredModal>

src/CraftSharp/CraftSharp.csproj

@@ -25,7 +25,11 @@
 	</ItemGroup>
 
 	<ItemGroup>
+		<PackageReference Include="Blazored.LocalStorage" Version="4.3.0" />
+		<PackageReference Include="Blazored.Modal" Version="7.1.0" />
+		<PackageReference Include="Blazorise.Bootstrap" Version="1.1.4.1" />
 		<PackageReference Include="Blazorise.DataGrid" Version="1.1.4.1" />
+		<PackageReference Include="Blazorise.Icons.FontAwesome" Version="1.1.4.1" />
 		<PackageReference Include="Microsoft.Extensions.Localization" Version="7.0.0" />
 		<PackageReference Include="Microsoft.VisualStudio.Azure.Containers.Tools.Targets" Version="1.17.0" />
 	</ItemGroup>

src/CraftSharp/Factories/ItemFactory.cs

@@ -17,7 +17,7 @@ namespace CraftSharp.Factories
                 StackSize = item.StackSize,
                 ImageContent = imageContent,
                 ImageBase64 = string.IsNullOrWhiteSpace(item.ImageBase64) ? Convert.ToBase64String(imageContent) : item.ImageBase64,
-                Rarity = item.Rarity
+                //Rarity = item.Rarity
             };
         }
 
@@ -34,7 +34,7 @@ namespace CraftSharp.Factories
                 StackSize = model.StackSize,
                 CreatedDate = DateTime.Now,
                 ImageBase64 = Convert.ToBase64String(model.ImageContent),
-                Rarity = model.Rarity
+                //Rarity = model.Rarity
             };
         }
 
@@ -48,7 +48,7 @@ namespace CraftSharp.Factories
             item.StackSize = model.StackSize;
             item.UpdatedDate = DateTime.Now;
             item.ImageBase64 = Convert.ToBase64String(model.ImageContent);
-            item.Rarity = model.Rarity;
+            //item.Rarity = model.Rarity;
 
     }
 }

src/CraftSharp/Modals/DeleteConfirmation.razor

@@ -0,0 +1,10 @@
+<div class="simple-form">
+    
+    <p>
+        Are you sure you want to delete @item.DisplayName ?
+    </p>
+
+    <button @onclick="ConfirmDelete" class="btn btn-primary">Delete</button>
+
+    <button @onclick="Cancel" class="btn btn-secondary">Cancel</button>
+</div>

src/CraftSharp/Modals/DeleteConfirmation.razor.cs

@@ -0,0 +1,38 @@
+using Blazored.Modal;
+using Blazored.Modal.Services;
+using CraftSharp.Models;
+using CraftSharp.Services;
+using Microsoft.AspNetCore.Components;
+
+namespace CraftSharp.Modals
+{
+    public partial class DeleteConfirmation
+    {
+        [CascadingParameter]
+        public BlazoredModalInstance ModalInstance { get; set; }
+
+        [Inject]
+        public IDataService DataService { get; set; }
+
+        [Parameter]
+        public int Id { get; set; }
+
+        private Item item = new Item();
+
+        protected override async Task OnInitializedAsync()
+        {
+            // Get the item
+            item = await DataService.GetById(Id);
+        }
+
+        void ConfirmDelete()
+        {
+            ModalInstance.CloseAsync(ModalResult.Ok(true));
+        }
+
+        void Cancel()
+        {
+            ModalInstance.CancelAsync();
+        }
+    }
+}

src/CraftSharp/Models/Item.cs

@@ -13,6 +13,6 @@
         public DateTime? UpdatedDate { get; set; }
         public string ImageBase64 { get; set; }
 
-        public Rarities Rarity { get; set; }
+        //public Rarities Rarity { get; set; }
     }
 }

src/CraftSharp/Models/ItemModel.cs

@@ -36,7 +36,7 @@ namespace CraftSharp.Models
 
         public string ImageBase64 { get; set; }
        
-        [Required]
-        public Rarities Rarity { get; set; }
+        /*[Required]
+        public Rarities Rarity { get; set; }*/
     }
 }

src/CraftSharp/Pages/Add.razor

@@ -0,0 +1,69 @@
+@page "/add"
+
+<h3>Add</h3>
+
+<EditForm Model="@itemModel" OnValidSubmit="@HandleValidSubmit">
+    <DataAnnotationsValidator />
+    <ValidationSummary />
+
+    <p>
+        <label for="display-name">
+            Display name:
+            <InputText id="display-name" @bind-Value="itemModel.DisplayName" />
+        </label>
+    </p>
+    <p>
+        <label for="name">
+            Name:
+            <InputText id="name" @bind-Value="itemModel.Name" />
+        </label>
+    </p>
+    <p>
+        <label for="stack-size">
+            Stack size:
+            <InputNumber id="stack-size" @bind-Value="itemModel.StackSize" />
+        </label>
+    </p>
+    <p>
+        <label for="max-durability">
+            Max durability:
+            <InputNumber id="max-durability" @bind-Value="itemModel.MaxDurability" />
+        </label>
+    </p>
+    <p>
+        Enchant categories:
+        <div>
+            @foreach (var item in enchantCategories)
+            {
+                <label>
+                    <input type="checkbox" @onchange="@(e => OnEnchantCategoriesChange(item, e.Value))" />@item
+                </label>
+            }
+        </div>
+    </p>
+    <p>
+        Repair with:
+        <div>
+            @foreach (var item in repairWith)
+            {
+                <label>
+                    <input type="checkbox" @onchange="@(e => OnRepairWithChange(item, e.Value))" />@item
+                </label>
+            }
+        </div>
+    </p>
+    <p>
+        <label>
+            Item image:
+            <InputFile OnChange="@LoadImage" accept=".png" />
+        </label>
+    </p>
+    <p>
+        <label>
+            Accept Condition:
+            <InputCheckbox @bind-Value="itemModel.AcceptCondition" />
+        </label>
+    </p>
+
+    <button type="submit">Submit</button>
+</EditForm>

src/CraftSharp/Pages/Add.razor.cs

@@ -0,0 +1,89 @@
+using Blazored.LocalStorage;
+using CraftSharp.Models;
+using CraftSharp.Services;
+using Microsoft.AspNetCore.Components;
+using Microsoft.AspNetCore.Components.Forms;
+
+namespace CraftSharp.Pages
+{
+    public partial class Add
+    {
+        /// <summary>
+        /// The default enchant categories.
+        /// </summary>
+        private List<string> enchantCategories = new List<string>() { "armor", "armor_head", "armor_chest", "weapon", "digger", "breakable", "vanishable" };
+
+        /// <summary>
+        /// The current item model
+        /// </summary>
+        private ItemModel itemModel = new()
+        {
+            EnchantCategories = new List<string>(),
+            RepairWith = new List<string>()
+        };
+
+        /// <summary>
+        /// The default repair with.
+        /// </summary>
+        private List<string> repairWith = new List<string>() { "oak_planks", "spruce_planks", "birch_planks", "jungle_planks", "acacia_planks", "dark_oak_planks", "crimson_planks", "warped_planks" };
+
+        [Inject]
+        public IDataService DataService { get; set; }
+
+        [Inject]
+        public NavigationManager NavigationManager { get; set; }
+
+        private async void HandleValidSubmit()
+        {
+            await DataService.Add(itemModel);
+
+            NavigationManager.NavigateTo("list");
+        }
+
+        private async Task LoadImage(InputFileChangeEventArgs e)
+        {
+            // Set the content of the image to the model
+            using (var memoryStream = new MemoryStream())
+            {
+                await e.File.OpenReadStream().CopyToAsync(memoryStream);
+                itemModel.ImageContent = memoryStream.ToArray();
+            }
+        }
+
+        private void OnEnchantCategoriesChange(string item, object checkedValue)
+        {
+            if ((bool)checkedValue)
+            {
+                if (!itemModel.EnchantCategories.Contains(item))
+                {
+                    itemModel.EnchantCategories.Add(item);
+                }
+
+                return;
+            }
+
+            if (itemModel.EnchantCategories.Contains(item))
+            {
+                itemModel.EnchantCategories.Remove(item);
+            }
+        }
+
+        private void OnRepairWithChange(string item, object checkedValue)
+        {
+            if ((bool)checkedValue)
+            {
+                if (!itemModel.RepairWith.Contains(item))
+                {
+                    itemModel.RepairWith.Add(item);
+                }
+
+                return;
+            }
+
+            if (itemModel.RepairWith.Contains(item))
+            {
+                itemModel.RepairWith.Remove(item);
+            }
+        }
+    }
+}

src/CraftSharp/Pages/Crafting.razor

@@ -0,0 +1,5 @@
+@page "/Crafting"
+
+<div>
+    <Crafting Items="Items" Recipes="Recipes" />
+</div>

src/CraftSharp/Pages/Crafting.razor.cs

@@ -0,0 +1,32 @@
+using CraftSharp.Components;
+using CraftSharp.Models;
+using CraftSharp.Services;
+using Microsoft.AspNetCore.Components;
+
+namespace CraftSharp.Pages
+{
+    public partial class Crafting
+    {
+        [Inject]
+        public IDataService DataService { get; set; }
+
+        public List<Item> Items { get; set; } = new List<Item>();
+
+        private List<CraftingRecipe> Recipes { get; set; } = new List<CraftingRecipe>();
+
+        protected override async Task OnAfterRenderAsync(bool firstRender)
+        {
+            base.OnAfterRenderAsync(firstRender);
+
+            if (!firstRender)
+            {
+                return;
+            }
+
+            Items = await DataService.List(0, await DataService.Count());
+            Recipes = await DataService.GetRecipes();
+
+            StateHasChanged();
+        }
+    }
+}

src/CraftSharp/Pages/Edit.razor

@@ -0,0 +1,88 @@
+@page "/edit/{Id:int}"
+
+<h3>Edit</h3>
+
+<EditForm Model="@itemModel" OnValidSubmit="@HandleValidSubmit">
+    <DataAnnotationsValidator />
+    <ValidationSummary />
+
+    <p>
+        <label for="display-name">
+            Display name:
+            <InputText id="display-name" @bind-Value="itemModel.DisplayName" />
+        </label>
+    </p>
+    <p>
+        <label for="name">
+            Name:
+            <InputText id="name" @bind-Value="itemModel.Name" />
+        </label>
+    </p>
+    <p>
+        <label for="stack-size">
+            Stack size:
+            <InputNumber id="stack-size" @bind-Value="itemModel.StackSize" />
+        </label>
+    </p>
+    <p>
+        <label for="max-durability">
+            Max durability:
+            <InputNumber id="max-durability" @bind-Value="itemModel.MaxDurability" />
+        </label>
+    </p>
+    <p>
+        Enchant categories:
+        <div>
+            @foreach (var item in enchantCategories)
+            {
+                <label>
+                    <input type="checkbox" @onchange="@(e => OnEnchantCategoriesChange(item, e.Value))" checked="@(itemModel.EnchantCategories.Contains(item) ? "checked" : null)" />@item
+                </label>
+            }
+        </div>
+    </p>
+    <p>
+        Repair with:
+        <div>
+            @foreach (var item in repairWith)
+            {
+                <label>
+                    <input type="checkbox" @onchange="@(e => OnRepairWithChange(item, e.Value))" checked="@(itemModel.RepairWith.Contains(item) ? "checked" : null)" />@item
+                </label>
+            }
+        </div>
+    </p>
+    <p>
+        <label>
+            Current Item image:
+            @if (File.Exists($"{WebHostEnvironment.WebRootPath}/images/{itemModel.Name}.png"))
+            {
+                <img src="images/@(itemModel.Name).png" class="img-thumbnail" title="@itemModel.DisplayName" alt="@itemModel.DisplayName" style="max-width: 150px"/>
+            }
+            else
+            {
+                <img src="images/default.png" class="img-thumbnail" title="@itemModel.DisplayName" alt="@itemModel.DisplayName" style="max-width: 150px"/>
+            }
+        </label>
+    </p>
+    <p>
+        <label>
+            Current Item image:
+            <img src="data:image/png;base64, @(itemModel.ImageBase64)" class="img-thumbnail" title="@itemModel.DisplayName" alt="@itemModel.DisplayName" style="min-width: 50px; max-width: 150px"/>
+        </label>
+    </p>
+    <p>
+        <label>
+            Item image:
+            <InputFile OnChange="@LoadImage" accept=".png" />
+        </label>
+    </p>
+    <p>
+        <label>
+            Accept Condition:
+            <InputCheckbox @bind-Value="itemModel.AcceptCondition" />
+        </label>
+    </p>
+
+    <button type="submit">Submit</button>
+</EditForm>

src/CraftSharp/Pages/Edit.razor.cs

@@ -0,0 +1,105 @@
+using CraftSharp.Factories;
+using CraftSharp.Models;
+using CraftSharp.Services;
+using Microsoft.AspNetCore.Components;
+using Microsoft.AspNetCore.Components.Forms;
+
+namespace CraftSharp.Pages
+{
+    public partial class Edit
+    {
+        [Parameter]
+        public int Id { get; set; }
+
+        /// <summary>
+        /// The default enchant categories.
+        /// </summary>
+        private List<string> enchantCategories = new List<string>() { "armor", "armor_head", "armor_chest", "weapon", "digger", "breakable", "vanishable" };
+
+        /// <summary>
+        /// The current item model
+        /// </summary>
+        private ItemModel itemModel = new()
+        {
+            EnchantCategories = new List<string>(),
+            RepairWith = new List<string>()
+        };
+
+        /// <summary>
+        /// The default repair with.
+        /// </summary>
+        private List<string> repairWith = new List<string>() { "oak_planks", "spruce_planks", "birch_planks", "jungle_planks", "acacia_planks", "dark_oak_planks", "crimson_planks", "warped_planks" };
+
+        [Inject]
+        public IDataService DataService { get; set; }
+
+        [Inject]
+        public NavigationManager NavigationManager { get; set; }
+
+        [Inject]
+        public IWebHostEnvironment WebHostEnvironment { get; set; }
+
+        protected override async Task OnInitializedAsync()
+        {
+            var item = await DataService.GetById(Id);
+
+            var fileContent = await File.ReadAllBytesAsync($"{WebHostEnvironment.WebRootPath}/images/default.png");
+
+            // Set the model with the item
+            itemModel = ItemFactory.ToModel(item, fileContent);
+        }
+
+        private async void HandleValidSubmit()
+        {
+            await DataService.Update(Id, itemModel);
+
+            NavigationManager.NavigateTo("list");
+        }
+
+        private async Task LoadImage(InputFileChangeEventArgs e)
+        {
+            // Set the content of the image to the model
+            using (var memoryStream = new MemoryStream())
+            {
+                await e.File.OpenReadStream().CopyToAsync(memoryStream);
+                itemModel.ImageContent = memoryStream.ToArray();
+            }
+        }
+
+        private void OnEnchantCategoriesChange(string item, object checkedValue)
+        {
+            if ((bool)checkedValue)
+            {
+                if (!itemModel.EnchantCategories.Contains(item))
+                {
+                    itemModel.EnchantCategories.Add(item);
+                }
+
+                return;
+            }
+
+            if (itemModel.EnchantCategories.Contains(item))
+            {
+                itemModel.EnchantCategories.Remove(item);
+            }
+        }
+
+        private void OnRepairWithChange(string item, object checkedValue)
+        {
+            if ((bool)checkedValue)
+            {
+                if (!itemModel.RepairWith.Contains(item))
+                {
+                    itemModel.RepairWith.Add(item);
+                }
+
+                return;
+            }
+
+            if (itemModel.RepairWith.Contains(item))
+            {
+                itemModel.RepairWith.Remove(item);
+            }
+        }
+    }
+}

src/CraftSharp/Pages/List.razor

@@ -1,8 +1,52 @@
 @page "/list"
-@using Models
+@using CraftSharp.Models
 
-<h3>@Localizer["Title"]</h3>
+<h3>List</h3>
 
-@code {
+<div>
+    <NavLink class="btn btn-primary" href="Add" Match="NavLinkMatch.All">
+        <i class="fa fa-plus"></i> Ajouter
+    </NavLink>
+</div>
 
-}
+<DataGrid TItem="Item"
+          Data="@items"
+          ReadData="@OnReadData"
+          TotalItems="@totalItem"
+          PageSize="10"
+          ShowPager
+          Responsive>
+    <DataGridColumn TItem="Item" Field="@nameof(Item.Id)" Caption="#" />
+    <DataGridColumn TItem="Item" Field="@nameof(Item.Id)" Caption="Image">
+        <DisplayTemplate>
+            @if (!string.IsNullOrWhiteSpace(context.ImageBase64))
+            {
+                <img src="data:image/png;base64, @(context.ImageBase64)" class="img-thumbnail" title="@context.DisplayName" alt="@context.DisplayName" style="min-width: 50px; max-width: 150px" />
+            }
+            else
+            {
+                <img src="images/default.png" class="img-thumbnail" title="@context.DisplayName" alt="@context.DisplayName" style="max-width: 150px"/>
+            }
+        </DisplayTemplate>
+    </DataGridColumn>
+    <DataGridColumn TItem="Item" Field="@nameof(Item.DisplayName)" Caption="Display name" />
+    <DataGridColumn TItem="Item" Field="@nameof(Item.StackSize)" Caption="Stack size" />
+    <DataGridColumn TItem="Item" Field="@nameof(Item.MaxDurability)" Caption="Maximum durability" />
+    <DataGridColumn TItem="Item" Field="@nameof(Item.EnchantCategories)" Caption="Enchant categories">
+        <DisplayTemplate>
+            @(string.Join(", ", ((Item)context).EnchantCategories))
+        </DisplayTemplate>
+    </DataGridColumn>
+    <DataGridColumn TItem="Item" Field="@nameof(Item.RepairWith)" Caption="Repair with">
+        <DisplayTemplate>
+            @(string.Join(", ", ((Item)context).RepairWith))
+        </DisplayTemplate>
+    </DataGridColumn>
+    <DataGridColumn TItem="Item" Field="@nameof(Item.CreatedDate)" Caption="Created date" DisplayFormat="{0:d}" DisplayFormatProvider="@System.Globalization.CultureInfo.GetCultureInfo("fr-FR")" />
+    <DataGridColumn TItem="Item" Field="@nameof(Item.Id)" Caption="Action">
+        <DisplayTemplate>
+            <a href="Edit/@(context.Id)" class="btn btn-primary"><i class="fa fa-edit"></i> Editer</a>
+            <button type="button" class="btn btn-primary" @onclick="() => OnDelete(context.Id)"><i class="fa fa-trash"></i> Supprimer</button>
+        </DisplayTemplate>
+    </DataGridColumn>
+</DataGrid>

src/CraftSharp/Pages/List.razor.cs

@@ -1,12 +1,64 @@
-using Microsoft.AspNetCore.Components;
+using Blazored.LocalStorage;
+using Blazored.Modal;
+using Blazored.Modal.Services;
+using Blazorise.DataGrid;
+using CraftSharp.Modals;
+using CraftSharp.Models;
+using CraftSharp.Services;
+using Microsoft.AspNetCore.Components;
 using Microsoft.Extensions.Localization;
 
 namespace CraftSharp.Pages
 {
     public partial class List
     {
+        private List<Item> items;
+
+        private int totalItem;
+
+        [Inject]
+        public NavigationManager NavigationManager { get; set; }
+
+        [CascadingParameter]
+        public IModalService Modal { get; set; }
+
+        [Inject]
+        public IDataService DataService { get; set; }
 
         [Inject]
-        public IStringLocalizer<List> Localizer { get; set; }
+        public IWebHostEnvironment WebHostEnvironment { get; set; }
+
+        private async Task OnReadData(DataGridReadDataEventArgs<Item> e)
+        {
+            if (e.CancellationToken.IsCancellationRequested)
+            {
+                return;
+            }
+
+            if (!e.CancellationToken.IsCancellationRequested)
+            {
+                items = await DataService.List(e.Page, e.PageSize);
+                totalItem = await DataService.Count();
+            }
+        }
+        private async void OnDelete(int id)
+        {
+            var parameters = new ModalParameters();
+            parameters.Add(nameof(Item.Id), id);
+
+            var modal = Modal.Show<DeleteConfirmation>("Delete Confirmation", parameters);
+            var result = await modal.Result;
+
+            if (result.Cancelled)
+            {
+                return;
+            }
+
+            await DataService.Delete(id);
+
+            // Reload the page
+            NavigationManager.NavigateTo("list", true);
+        }
     }
 }
+

src/CraftSharp/Pages/_Layout.cshtml

@@ -28,7 +28,10 @@
     </div>
 
     <script src="_framework/blazor.server.js"></script>
+    <script src="_content/Blazored.Modal/blazored.modal.js"></script>
+    <script src="Components/Crafting.razor.js"></script>
     
+    <link href="_content/Blazored.Modal/blazored-modal.css" rel="stylesheet" />
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css">
 
     <link href="_content/Blazorise/blazorise.css" rel="stylesheet" />

src/CraftSharp/Program.cs

@@ -1,3 +1,8 @@
+using Blazored.LocalStorage;
+using Blazorise;
+using Blazored.Modal;
+using Blazorise.Bootstrap;
+using Blazorise.Icons.FontAwesome;
 using CraftSharp.Data;
 using CraftSharp.Services;
 using Microsoft.AspNetCore.Components;
@@ -21,7 +26,16 @@ builder.Services.AddLocalization(opts => { opts.ResourcesPath = "Resources"; });
 
 builder.Services.AddHttpClient();
 
-builder.Services.AddScoped<IDataService, DataApiService>();
+builder.Services.AddBlazoredModal();
+
+builder.Services
+   .AddBlazorise()
+   .AddBootstrapProviders()
+   .AddFontAwesomeIcons();
+
+builder.Services.AddBlazoredLocalStorage();
+
+builder.Services.AddScoped<IDataService, DataLocalService>();
 
 // Configure the localtization
 builder.Services.Configure<RequestLocalizationOptions>(options =>

src/CraftSharp/Services/DataLocalService.cs

@@ -0,0 +1,147 @@
+using Blazored.LocalStorage;
+using CraftSharp.Components;
+using CraftSharp.Factories;
+using CraftSharp.Models;
+using Microsoft.AspNetCore.Components;
+
+namespace CraftSharp.Services
+{
+    public class DataLocalService : IDataService
+    {
+        private readonly HttpClient _http;
+        private readonly ILocalStorageService _localStorage;
+        private readonly NavigationManager _navigationManager;
+        private readonly IWebHostEnvironment _webHostEnvironment;
+
+        public DataLocalService(
+            ILocalStorageService localStorage,
+            HttpClient http,
+            IWebHostEnvironment webHostEnvironment,
+            NavigationManager navigationManager)
+        {
+            _localStorage = localStorage;
+            _http = http;
+            _webHostEnvironment = webHostEnvironment;
+            _navigationManager = navigationManager;
+        }
+
+        public async Task Add(ItemModel model)
+        {
+            // Get the current data
+            var currentData = await _localStorage.GetItemAsync<List<Item>>("data");
+
+            // Simulate the Id
+            model.Id = currentData.Max(s => s.Id) + 1;
+
+            // Add the item to the current data
+            currentData.Add(ItemFactory.Create(model));
+
+            // Save the data
+            await _localStorage.SetItemAsync("data", currentData);
+        }
+
+        public async Task<int> Count()
+        {
+            // Load data from the local storage
+            var currentData = await _localStorage.GetItemAsync<Item[]>("data");
+
+            // Check if data exist in the local storage
+            if (currentData == null)
+            {
+                // this code add in the local storage the fake data
+                var originalData = await _http.GetFromJsonAsync<Item[]>($"{_navigationManager.BaseUri}fake-data.json");
+                await _localStorage.SetItemAsync("data", originalData);
+            }
+
+            return (await _localStorage.GetItemAsync<Item[]>("data")).Length;
+        }
+
+        public async Task<List<Item>> List(int currentPage, int pageSize)
+        {
+            // Load data from the local storage
+            var currentData = await _localStorage.GetItemAsync<Item[]>("data");
+
+            // Check if data exist in the local storage
+            if (currentData == null)
+            {
+                // this code add in the local storage the fake data
+                var originalData = await _http.GetFromJsonAsync<Item[]>($"{_navigationManager.BaseUri}fake-data.json");
+                await _localStorage.SetItemAsync("data", originalData);
+            }
+
+            return (await _localStorage.GetItemAsync<Item[]>("data")).Skip((currentPage - 1) * pageSize).Take(pageSize).ToList();
+        }
+        public async Task<Item> GetById(int id)
+        {
+            // Get the current data
+            var currentData = await _localStorage.GetItemAsync<List<Item>>("data");
+
+            // Get the item int the list
+            var item = currentData.FirstOrDefault(w => w.Id == id);
+
+            // Check if item exist
+            if (item == null)
+            {
+                throw new Exception($"Unable to found the item with ID: {id}");
+            }
+
+            return item;
+        }
+
+        public async Task Update(int id, ItemModel model)
+        {
+            // Get the current data
+            var currentData = await _localStorage.GetItemAsync<List<Item>>("data");
+
+            // Get the item int the list
+            var item = currentData.FirstOrDefault(w => w.Id == id);
+
+            // Check if item exist
+            if (item == null)
+            {
+                throw new Exception($"Unable to found the item with ID: {id}");
+            }
+
+            // Modify the content of the item
+            ItemFactory.Update(item, model);
+
+            // Save the data
+            await _localStorage.SetItemAsync("data", currentData);
+        }
+
+        public async Task Delete(int id)
+        {
+            // Get the current data
+            var currentData = await _localStorage.GetItemAsync<List<Item>>("data");
+
+            // Get the item int the list
+            var item = currentData.FirstOrDefault(w => w.Id == id);
+
+            // Delete item in
+            currentData.Remove(item);
+
+            // Save the data
+            await _localStorage.SetItemAsync("data", currentData);
+        }
+
+        public Task<List<CraftingRecipe>> GetRecipes()
+        {
+            var items = new List<CraftingRecipe>
+            {
+                new CraftingRecipe
+                {
+                    Give = new Item { DisplayName = "Diamond", Name = "diamond" },
+                    Have = new List<List<string>>
+                    {
+                        new List<string> { "dirt", "dirt", "dirt" },
+                        new List<string> { "dirt", null, "dirt" },
+                        new List<string> { "dirt", "dirt", "dirt" }
+                    }
+                }
+            };
+
+            return Task.FromResult(items);
+        }
+
+    }
+}

src/CraftSharp/Services/IDataService.cs

@@ -14,8 +14,9 @@ namespace CraftSharp.Services
 
         Task Update(int id, ItemModel model);
         Task Delete(int id);
-
         Task<List<CraftingRecipe>> GetRecipes();
+
+        //Task<List<CraftingRecipe>> GetRecipes();
     }
 }
 

src/CraftSharp/Shared/HeaderLayout.razor

@@ -30,6 +30,11 @@
                         <span class="oi oi-list-rich"></span> Inventaire
                     </NavLink>
                 </li>
+                <li class="nav-item">
+                    <NavLink class="nav-link" href="Crafting">
+                        <span class="oi oi-list-rich"></span> Table de craft
+                    </NavLink>
+                </li>
             </ul>
             <div>
                 <div >

src/CraftSharp/_Imports.razor

@@ -8,3 +8,6 @@
 @using Microsoft.JSInterop
 @using CraftSharp
 @using CraftSharp.Shared
+@using Blazorise.DataGrid
+@using Blazored.Modal
+@using Blazored.Modal.Services

src/CraftSharp/wwwroot/fake-data.json

@@ -1,469 +1,223 @@
-{
-  "blocks": [
+[
   {
     "id": 1,
-      "name": "Comveyer",
-      "stacksize": 35,
-      "rarity": "rare"
-    },
-    {
-      "id": 2,
-      "name": "Uncorp",
-      "stacksize": 56,
-      "rarity": "legendary"
-    },
-    {
-      "id": 3,
-      "name": "Oatfarm",
-      "stacksize": 27,
-      "rarity": "rare"
-    },
-    {
-      "id": 4,
-      "name": "Isostream",
-      "stacksize": 21,
-      "rarity": "legendary"
-    },
-    {
-      "id": 5,
-      "name": "Deepends",
-      "stacksize": 23,
-      "rarity": "rare"
-    },
-    {
-      "id": 6,
-      "name": "Flumbo",
-      "stacksize": 26,
-      "rarity": "common"
-    },
-    {
-      "id": 7,
-      "name": "Navir",
-      "stacksize": 64,
-      "rarity": "common"
-    },
-    {
-      "id": 8,
-      "name": "Circum",
-      "stacksize": 31,
-      "rarity": "legendary"
-    },
-    {
-      "id": 9,
-      "name": "Virva",
-      "stacksize": 30,
-      "rarity": "epic"
-    },
-    {
-      "id": 10,
-      "name": "Zillanet",
-      "stacksize": 18,
-      "rarity": "common"
-    },
-    {
-      "id": 11,
-      "name": "Ezent",
-      "stacksize": 49,
-      "rarity": "legendary"
-    },
-    {
-      "id": 12,
-      "name": "Pigzart",
-      "stacksize": 48,
-      "rarity": "common"
-    },
-    {
-      "id": 13,
-      "name": "Mantrix",
+    "displayname": "Bicol",
+    "name": "bicol",
     "stacksize": 6,
-      "rarity": "rare"
-    },
-    {
-      "id": 14,
-      "name": "Aquamate",
-      "stacksize": 9,
-      "rarity": "rare"
-    },
-    {
-      "id": 15,
-      "name": "Twiist",
-      "stacksize": 54,
-      "rarity": "legendary"
-    },
-    {
-      "id": 16,
-      "name": "Mazuda",
-      "stacksize": 17,
-      "rarity": "rare"
-    },
-    {
-      "id": 17,
-      "name": "Ecolight",
-      "stacksize": 50,
-      "rarity": "epic"
-    },
-    {
-      "id": 18,
-      "name": "Greeker",
-      "stacksize": 40,
-      "rarity": "rare"
-    },
-    {
-      "id": 19,
-      "name": "Stelaecor",
-      "stacksize": 28,
-      "rarity": "legendary"
-    },
-    {
-      "id": 20,
-      "name": "Deviltoe",
-      "stacksize": 24,
-      "rarity": "epic"
-    },
-    {
-      "id": 21,
-      "name": "Comveyor",
-      "stacksize": 39,
-      "rarity": "legendary"
-    },
-    {
-      "id": 22,
-      "name": "Neptide",
-      "stacksize": 63,
-      "rarity": "common"
-    }
+    "maxdurability": 18,
+    "enchantcategories": [
+      "armor_head",
+      "armor",
+      "armor_head"
     ],
-  "tools": [
-      {
-        "id": 1,
-        "name": "Applideck",
-        "stacksize": 10,
-        "rarity": "common",
-        "damages": 3
+    "repairwith": [],
+    "createddate": "2022-06-14",
+    "updateddate": null
   },
   {
     "id": 2,
-        "name": "Kenegy",
-        "stacksize": 7,
-        "rarity": "legendary",
-        "damages": 7
+    "displayname": "Kyagoro",
+    "name": "kyagoro",
+    "stacksize": 60,
+    "maxdurability": 56,
+    "enchantcategories": [],
+    "repairwith": [
+      "birch_planks"
+    ],
+    "createddate": "2016-01-06",
+    "updateddate": null
   },
   {
     "id": 3,
-        "name": "Pyramis",
-        "stacksize": 47,
-        "rarity": "epic",
-        "damages": 8
+    "displayname": "Euron",
+    "name": "euron",
+    "stacksize": 22,
+    "maxdurability": 116,
+    "enchantcategories": [
+      "armor_head"
+    ],
+    "repairwith": [],
+    "createddate": "2016-04-03",
+    "updateddate": "2017-01-22"
   },
   {
     "id": 4,
-        "name": "Xsports",
-        "stacksize": 6,
-        "rarity": "rare",
-        "damages": 7
+    "displayname": "Cosmetex",
+    "name": "cosmetex",
+    "stacksize": 24,
+    "maxdurability": 33,
+    "enchantcategories": [
+      "breakable"
+    ],
+    "repairwith": [
+      "oak_planks",
+      "dark_oak_planks"
+    ],
+    "createddate": "2016-02-25",
+    "updateddate": null
   },
   {
     "id": 5,
-        "name": "Extragen",
-        "stacksize": 11,
-        "rarity": "common",
-        "damages": 10
+    "displayname": "Microluxe",
+    "name": "microluxe",
+    "stacksize": 48,
+    "maxdurability": 50,
+    "enchantcategories": [
+      "armor_head",
+      "digger",
+      "weapon"
+    ],
+    "repairwith": [],
+    "createddate": "2022-05-20",
+    "updateddate": "2020-05-18"
   },
   {
     "id": 6,
-        "name": "Recrisys",
-        "stacksize": 40,
-        "rarity": "rare",
-        "damages": 3
+    "displayname": "Pyramis",
+    "name": "pyramis",
+    "stacksize": 3,
+    "maxdurability": 89,
+    "enchantcategories": [
+      "vanishable",
+      "weapon"
+    ],
+    "repairwith": [],
+    "createddate": "2021-01-09",
+    "updateddate": null
   },
   {
     "id": 7,
-        "name": "Martgo",
-        "stacksize": 39,
-        "rarity": "legendary",
-        "damages": 6
+    "displayname": "Magnafone",
+    "name": "magnafone",
+    "stacksize": 16,
+    "maxdurability": 124,
+    "enchantcategories": [],
+    "repairwith": [],
+    "createddate": "2021-08-28",
+    "updateddate": "2019-02-25"
   },
   {
     "id": 8,
-        "name": "Lotron",
-        "stacksize": 11,
-        "rarity": "rare",
-        "damages": 9
+    "displayname": "Macronaut",
+    "name": "macronaut",
+    "stacksize": 45,
+    "maxdurability": 81,
+    "enchantcategories": [
+      "armor_chest",
+      "weapon"
+    ],
+    "repairwith": [],
+    "createddate": "2021-09-05",
+    "updateddate": "2017-04-19"
   },
   {
     "id": 9,
-        "name": "Flum",
-        "stacksize": 14,
-        "rarity": "common",
-        "damages": 4
+    "displayname": "Pharmacon",
+    "name": "pharmacon",
+    "stacksize": 1,
+    "maxdurability": 49,
+    "enchantcategories": [
+      "armor"
+    ],
+    "repairwith": [
+      "acacia_planks",
+      "oak_planks"
+    ],
+    "createddate": "2019-12-25",
+    "updateddate": "2014-04-14"
   },
   {
     "id": 10,
-        "name": "Terrago",
-        "stacksize": 23,
-        "rarity": "common",
-        "damages": 10
+    "displayname": "Krog",
+    "name": "krog",
+    "stacksize": 28,
+    "maxdurability": 87,
+    "enchantcategories": [],
+    "repairwith": [],
+    "createddate": "2020-10-26",
+    "updateddate": "2017-10-24"
   },
   {
     "id": 11,
-        "name": "Stralum",
-        "stacksize": 17,
-        "rarity": "common",
-        "damages": 9
+    "displayname": "Escenta",
+    "name": "escenta",
+    "stacksize": 59,
+    "maxdurability": 103,
+    "enchantcategories": [],
+    "repairwith": [
+      "jungle_planks"
+    ],
+    "createddate": "2020-04-07",
+    "updateddate": null
   },
   {
     "id": 12,
-        "name": "Unisure",
-        "stacksize": 4,
-        "rarity": "epic",
-        "damages": 2
+    "displayname": "Vidto",
+    "name": "vidto",
+    "stacksize": 59,
+    "maxdurability": 60,
+    "enchantcategories": [],
+    "repairwith": [],
+    "createddate": "2017-09-24",
+    "updateddate": null
   },
   {
     "id": 13,
-        "name": "Xleen",
-        "stacksize": 6,
-        "rarity": "rare",
-        "damages": 1
+    "displayname": "Datagen",
+    "name": "datagen",
+    "stacksize": 30,
+    "maxdurability": 11,
+    "enchantcategories": [
+      "vanishable"
+    ],
+    "repairwith": [
+      "warped_planks",
+      "spruce_planks"
+    ],
+    "createddate": "2021-12-02",
+    "updateddate": "2018-05-17"
   },
   {
     "id": 14,
-        "name": "Knowlysis",
+    "displayname": "Elemantra",
+    "name": "elemantra",
     "stacksize": 4,
-        "rarity": "rare",
-        "damages": 7
+    "maxdurability": 5,
+    "enchantcategories": [],
+    "repairwith": [
+      "warped_planks",
+      "dark_oak_planks"
+    ],
+    "createddate": "2014-06-04",
+    "updateddate": "2016-07-28"
   },
   {
     "id": 15,
-        "name": "Exoteric",
-        "stacksize": 56,
-        "rarity": "epic",
-        "damages": 4
-      },
-      {
-        "id": 16,
-        "name": "Elentrix",
-        "stacksize": 43,
-        "rarity": "legendary",
-        "damages": 9
-      },
-      {
-        "id": 17,
-        "name": "Exostream",
-        "stacksize": 2,
-        "rarity": "common",
-        "damages": 10
-      },
-      {
-        "id": 18,
-        "name": "Helixo",
-        "stacksize": 50,
-        "rarity": "epic",
-        "damages": 1
-      },
-      {
-        "id": 19,
-        "name": "Eventage",
+    "displayname": "Moltonic",
+    "name": "moltonic",
     "stacksize": 31,
-        "rarity": "common",
-        "damages": 10
-      },
-      {
-        "id": 20,
-        "name": "Isosphere",
-        "stacksize": 44,
-        "rarity": "common",
-        "damages": 9
-      },
-      {
-        "id": 21,
-        "name": "Surelogic",
-        "stacksize": 18,
-        "rarity": "epic",
-        "damages": 3
-      },
-      {
-        "id": 22,
-        "name": "Accufarm",
-        "stacksize": 36,
-        "rarity": "common",
-        "damages": 6
-      },
-      {
-        "id": 23,
-        "name": "Recognia",
-        "stacksize": 13,
-        "rarity": "epic",
-        "damages": 4
-      },
-      {
-        "id": 24,
-        "name": "Fibrodyne",
-        "stacksize": 20,
-        "rarity": "rare",
-        "damages": 7
-      },
-      {
-        "id": 25,
-        "name": "Plasmosis",
-        "stacksize": 62,
-        "rarity": "common",
-        "damages": 2
-      },
-      {
-        "id": 26,
-        "name": "Dogtown",
-        "stacksize": 58,
-        "rarity": "common",
-        "damages": 6
-      },
-      {
-        "id": 27,
-        "name": "Edecine",
-        "stacksize": 56,
-        "rarity": "rare",
-        "damages": 3
-      },
-      {
-        "id": 28,
-        "name": "Spacewax",
-        "stacksize": 51,
-        "rarity": "legendary",
-        "damages": 8
-      }
+    "maxdurability": 105,
+    "enchantcategories": [
+      "weapon"
     ],
-  "armors": [
-    {
-      "id": 1,
-      "name": "Splinx",
-      "stacksize": 59,
-      "rarity": "common",
-      "toughness": 19
-    },
-    {
-      "id": 2,
-      "name": "Digigen",
-      "stacksize": 34,
-      "rarity": "legendary",
-      "toughness": 10
-    },
-    {
-      "id": 3,
-      "name": "Geoform",
-      "stacksize": 33,
-      "rarity": "legendary",
-      "toughness": 13
-    },
-    {
-      "id": 4,
-      "name": "Ovium",
-      "stacksize": 21,
-      "rarity": "legendary",
-      "toughness": 1
-    },
-    {
-      "id": 5,
-      "name": "Slambda",
-      "stacksize": 51,
-      "rarity": "common",
-      "toughness": 8
-    },
-    {
-      "id": 6,
-      "name": "Opticon",
-      "stacksize": 34,
-      "rarity": "rare",
-      "toughness": 18
-    },
-    {
-      "id": 7,
-      "name": "Combogen",
-      "stacksize": 22,
-      "rarity": "rare",
-      "toughness": 2
-    },
-    {
-      "id": 8,
-      "name": "Talae",
-      "stacksize": 38,
-      "rarity": "epic",
-      "toughness": 3
-    },
-    {
-      "id": 9,
-      "name": "Quotezart",
-      "stacksize": 63,
-      "rarity": "common",
-      "toughness": 7
-    },
-    {
-      "id": 10,
-      "name": "Edecine",
-      "stacksize": 54,
-      "rarity": "epic",
-      "toughness": 9
-    },
-    {
-      "id": 11,
-      "name": "Geekwagon",
-      "stacksize": 16,
-      "rarity": "common",
-      "toughness": 17
-    },
-    {
-      "id": 12,
-      "name": "Buzzmaker",
-      "stacksize": 1,
-      "rarity": "epic",
-      "toughness": 1
-    },
-    {
-      "id": 13,
-      "name": "Dreamia",
-      "stacksize": 11,
-      "rarity": "legendary",
-      "toughness": 3
-    },
-    {
-      "id": 14,
-      "name": "Memora",
-      "stacksize": 64,
-      "rarity": "legendary",
-      "toughness": 2
-    },
-    {
-      "id": 15,
-      "name": "Exerta",
-      "stacksize": 10,
-      "rarity": "legendary",
-      "toughness": 13
+    "repairwith": [],
+    "createddate": "2018-09-12",
+    "updateddate": null
   },
   {
     "id": 16,
-      "name": "Talkola",
-      "stacksize": 12,
-      "rarity": "rare",
-      "toughness": 10
-    },
-    {
-      "id": 17,
-      "name": "Zosis",
-      "stacksize": 12,
-      "rarity": "legendary",
-      "toughness": 2
-    },
-    {
-      "id": 18,
-      "name": "Aquazure",
-      "stacksize": 40,
-      "rarity": "rare",
-      "toughness": 6
-    },
-    {
-      "id": 19,
-      "name": "Crustatia",
-      "stacksize": 25,
-      "rarity": "common",
-      "toughness": 16
+    "displayname": "Goko",
+    "name": "goko",
+    "stacksize": 7,
+    "maxdurability": 63,
+    "enchantcategories": [
+      "vanishable"
+    ],
+    "repairwith": [
+      "crimson_planks",
+      "crimson_planks"
+    ],
+    "createddate": "2021-04-13",
+    "updateddate": "2016-10-24"
   }
-  ]
-}
+]