From b1cc8d178c1f88c88b0829f434f03794e1e7ad70 Mon Sep 17 00:00:00 2001
From: Thomas Chazot <tchazot63@gmail.com>
Date: Tue, 15 Nov 2022 08:55:49 +0100
Subject: [PATCH] =?UTF-8?q?Avanc=C3=A9e=20jusqu=E2=80=99=C3=A0=20l?=
 =?UTF-8?q?=E2=80=99api=20mais=20probl=C3=A8me=20sur=20la=20partie=20using?=
 =?UTF-8?q?=20component?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 BlazorApp/BlazorApp/App.razor                 |  18 ++--
 BlazorApp/BlazorApp/BlazorApp.csproj          |  25 +++++
 BlazorApp/BlazorApp/Components/Card.razor     |   9 ++
 BlazorApp/BlazorApp/Components/Card.razor.cs  |  21 ++++
 BlazorApp/BlazorApp/Components/Crafting.razor |  54 ++++++++++
 .../BlazorApp/Components/Crafting.razor.cs    |  82 +++++++++++++++
 .../BlazorApp/Components/Crafting.razor.css   |  19 ++++
 .../BlazorApp/Components/Crafting.razor.js    |  20 ++++
 .../BlazorApp/Components/CraftingAction.cs    |  13 +++
 .../BlazorApp/Components/CraftingItem.razor   |  13 +++
 .../Components/CraftingItem.razor.cs          |  68 ++++++++++++
 .../Components/CraftingItem.razor.css         |   6 ++
 .../BlazorApp/Components/CraftingRecipe.cs    |  12 +++
 .../Components/MyFirstChildComponent.razor    |  14 +++
 .../Components/MyRootComponent.razor          |  16 +++
 .../Components/MySecondChildComponent.razor   |  14 +++
 .../BlazorApp/Components/ShowItems.razor      |  11 ++
 .../BlazorApp/Components/ShowItems.razor.cs   |  15 +++
 .../Components/TestRenderFragment.razor       |   7 ++
 .../Controllers/CultureController.cs          |  36 +++++++
 BlazorApp/BlazorApp/Factories/ItemFactory.cs  |  53 ++++++++++
 .../BlazorApp/Modals/DeleteConfirmation.razor |  10 ++
 .../Modals/DeleteConfirmation.razor.cs        |  40 +++++++
 BlazorApp/BlazorApp/Models/Cake.cs            |  11 ++
 BlazorApp/BlazorApp/Models/Item.cs            |   5 +-
 BlazorApp/BlazorApp/Models/ItemModel.cs       |   2 +
 BlazorApp/BlazorApp/Pages/Edit.razor          |  79 +++++++++++++-
 BlazorApp/BlazorApp/Pages/Edit.razor.cs       |  99 ++++++++++++++++++
 BlazorApp/BlazorApp/Pages/Index.razor         |  43 +++++++-
 BlazorApp/BlazorApp/Pages/Index.razor.cs      |  58 ++++++++++
 BlazorApp/BlazorApp/Pages/List.razor          |   4 +-
 BlazorApp/BlazorApp/Pages/List.razor.cs       |  33 +++++-
 BlazorApp/BlazorApp/Pages/Pets1.razor         |  29 +++++
 BlazorApp/BlazorApp/Pages/Pets2.razor         |  29 +++++
 BlazorApp/BlazorApp/Pages/Pets3.razor         |  29 +++++
 BlazorApp/BlazorApp/Pages/Pets4.razor         |  29 +++++
 BlazorApp/BlazorApp/Pages/_Layout.cshtml      |   7 +-
 BlazorApp/BlazorApp/Program.cs                |  40 ++++++-
 .../Resources/Pages.List.Designer.cs          |  60 +++++++++++
 BlazorApp/BlazorApp/Resources/Pages.List.resx |  16 +++
 .../BlazorApp/Services/DataLocalService.cs    |  66 ++++++++----
 BlazorApp/BlazorApp/Services/IDataService.cs  |   7 +-
 .../BlazorApp/Shared/CultureSelector.razor    |  43 ++++++++
 BlazorApp/BlazorApp/Shared/MainLayout.razor   |   4 +
 .../BlazorApp/Shared/TableTemplate.razor      |  28 +++++
 BlazorApp/BlazorApp/_Imports.razor            |   2 +
 BlazorApp/BlazorApp/wwwroot/images/edit.png   | Bin 0 -> 2267 bytes
 47 files changed, 1261 insertions(+), 38 deletions(-)
 create mode 100644 BlazorApp/BlazorApp/Components/Card.razor
 create mode 100644 BlazorApp/BlazorApp/Components/Card.razor.cs
 create mode 100644 BlazorApp/BlazorApp/Components/Crafting.razor
 create mode 100644 BlazorApp/BlazorApp/Components/Crafting.razor.cs
 create mode 100644 BlazorApp/BlazorApp/Components/Crafting.razor.css
 create mode 100644 BlazorApp/BlazorApp/Components/Crafting.razor.js
 create mode 100644 BlazorApp/BlazorApp/Components/CraftingAction.cs
 create mode 100644 BlazorApp/BlazorApp/Components/CraftingItem.razor
 create mode 100644 BlazorApp/BlazorApp/Components/CraftingItem.razor.cs
 create mode 100644 BlazorApp/BlazorApp/Components/CraftingItem.razor.css
 create mode 100644 BlazorApp/BlazorApp/Components/CraftingRecipe.cs
 create mode 100644 BlazorApp/BlazorApp/Components/MyFirstChildComponent.razor
 create mode 100644 BlazorApp/BlazorApp/Components/MyRootComponent.razor
 create mode 100644 BlazorApp/BlazorApp/Components/MySecondChildComponent.razor
 create mode 100644 BlazorApp/BlazorApp/Components/ShowItems.razor
 create mode 100644 BlazorApp/BlazorApp/Components/ShowItems.razor.cs
 create mode 100644 BlazorApp/BlazorApp/Components/TestRenderFragment.razor
 create mode 100644 BlazorApp/BlazorApp/Controllers/CultureController.cs
 create mode 100644 BlazorApp/BlazorApp/Factories/ItemFactory.cs
 create mode 100644 BlazorApp/BlazorApp/Modals/DeleteConfirmation.razor
 create mode 100644 BlazorApp/BlazorApp/Modals/DeleteConfirmation.razor.cs
 create mode 100644 BlazorApp/BlazorApp/Models/Cake.cs
 create mode 100644 BlazorApp/BlazorApp/Pages/Index.razor.cs
 create mode 100644 BlazorApp/BlazorApp/Pages/Pets1.razor
 create mode 100644 BlazorApp/BlazorApp/Pages/Pets2.razor
 create mode 100644 BlazorApp/BlazorApp/Pages/Pets3.razor
 create mode 100644 BlazorApp/BlazorApp/Pages/Pets4.razor
 create mode 100644 BlazorApp/BlazorApp/Resources/Pages.List.Designer.cs
 create mode 100644 BlazorApp/BlazorApp/Resources/Pages.List.resx
 create mode 100644 BlazorApp/BlazorApp/Shared/CultureSelector.razor
 create mode 100644 BlazorApp/BlazorApp/Shared/TableTemplate.razor
 create mode 100644 BlazorApp/BlazorApp/wwwroot/images/edit.png

diff --git a/BlazorApp/BlazorApp/App.razor b/BlazorApp/BlazorApp/App.razor
index 60ab6f5..08b40fe 100644
--- a/BlazorApp/BlazorApp/App.razor
+++ b/BlazorApp/BlazorApp/App.razor
@@ -1,8 +1,10 @@
-<Router AppAssembly="@typeof(Program).Assembly">
-    <Found Context="routeData">
-        <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
-    </Found>
-    <NotFound>
-        <p>Sorry, there's nothing at this address.</p>
-    </NotFound>
-</Router>
+<CascadingBlazoredModal>
+    <Router AppAssembly="@typeof(Program).Assembly">
+        <Found Context="routeData">
+            <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
+        </Found>
+        <NotFound>
+            <p>Sorry, there's nothing at this address.</p>
+        </NotFound>
+    </Router>
+</CascadingBlazoredModal>   
diff --git a/BlazorApp/BlazorApp/BlazorApp.csproj b/BlazorApp/BlazorApp/BlazorApp.csproj
index cd54721..a00e35c 100644
--- a/BlazorApp/BlazorApp/BlazorApp.csproj
+++ b/BlazorApp/BlazorApp/BlazorApp.csproj
@@ -11,13 +11,38 @@
     <PackageReference Include="Blazorise.DataGrid" Version="1.1.2" />
     <PackageReference Include="Blazorise.Icons.FontAwesome" Version="1.1.2" />
     <PackageReference Include="Blazored.LocalStorage" Version="4.3.0" />
+    <PackageReference Include="Blazored.Modal" Version="7.1.0" />
+    <PackageReference Include="Microsoft.Extensions.Localization" Version="7.0.0" />
   </ItemGroup>
 
   <ItemGroup>
     <None Remove="Blazored.LocalStorage" />
     <None Remove="Services\" />
+    <None Remove="Factories\" />
+    <None Remove="Blazored.Modal" />
+    <None Remove="Modals\" />
+    <None Remove="Microsoft.Extensions.Localization" />
+    <None Remove="Controllers\" />
+    <None Remove="Resources\" />
+    <None Remove="Components\" />
   </ItemGroup>
   <ItemGroup>
     <Folder Include="Services\" />
+    <Folder Include="Factories\" />
+    <Folder Include="Modals\" />
+    <Folder Include="Controllers\" />
+    <Folder Include="Resources\" />
+    <Folder Include="Components\" />
+  </ItemGroup>
+  <ItemGroup>
+    <EmbeddedResource Update="Resources\Pages.List.resx">
+      <Generator>ResXFileCodeGenerator</Generator>
+      <LastGenOutput>Pages.List.Designer.cs</LastGenOutput>
+    </EmbeddedResource>
+  </ItemGroup>
+  <ItemGroup>
+    <Compile Update="Resources\Pages.List.Designer.cs">
+      <DependentUpon>Pages.List.resx</DependentUpon>
+    </Compile>
   </ItemGroup>
 </Project>
diff --git a/BlazorApp/BlazorApp/Components/Card.razor b/BlazorApp/BlazorApp/Components/Card.razor
new file mode 100644
index 0000000..e814a9b
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/Card.razor
@@ -0,0 +1,9 @@
+<h3>Card</h3>
+@typeparam TItem
+
+<div class="card text-center">
+    @CardHeader(Item)
+    @CardBody(Item)
+    @CardFooter
+</div>
+
diff --git a/BlazorApp/BlazorApp/Components/Card.razor.cs b/BlazorApp/BlazorApp/Components/Card.razor.cs
new file mode 100644
index 0000000..838cb8a
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/Card.razor.cs
@@ -0,0 +1,21 @@
+using System;
+using Microsoft.AspNetCore.Components;
+
+namespace BlazorApp.Components
+{
+    public partial class Card<TItem>
+    {
+        [Parameter]
+        public RenderFragment<TItem> CardBody { get; set; }
+
+        [Parameter]
+        public RenderFragment CardFooter { get; set; }
+
+        [Parameter]
+        public RenderFragment<TItem> CardHeader { get; set; }
+
+        [Parameter]
+        public TItem Item { get; set; }
+    }
+}
+
diff --git a/BlazorApp/BlazorApp/Components/Crafting.razor b/BlazorApp/BlazorApp/Components/Crafting.razor
new file mode 100644
index 0000000..42dd978
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/Crafting.razor
@@ -0,0 +1,54 @@
+
+<CascadingValue Value="@this">
+    <div class="container">
+        <div class="row">
+            <div class="col-6">
+
+                <div>Available items:</div>
+                <div>
+                    <div class="css-grid">
+
+                        @foreach (var item in Items)
+                        {
+                            <CraftingItem Item="item" NoDrop="true" />
+                        }
+                    </div>
+                </div>
+
+            </div>
+
+            <div class="col-6">
+                <div>Recipe</div>
+
+                <div>
+
+                    <div class="css-recipe">
+                        <CraftingItem Index="0" />
+                        <CraftingItem Index="1" />
+                        <CraftingItem Index="2" />
+                        <CraftingItem Index="3" />
+                        <CraftingItem Index="4" />
+                        <CraftingItem Index="5" />
+                        <CraftingItem Index="6" />
+                        <CraftingItem Index="7" />
+                        <CraftingItem Index="8" />
+                    </div>
+                </div>
+
+                <div>Result</div>
+                <div>
+                    <CraftingItem Item="RecipeResult" />
+                </div>
+            </div>
+
+            <div class="col-12">
+                <div>Actions</div>
+                <div class="actions" id="actions">
+
+                </div>
+            </div>
+        </div>
+    </div>
+</CascadingValue>
+
+
diff --git a/BlazorApp/BlazorApp/Components/Crafting.razor.cs b/BlazorApp/BlazorApp/Components/Crafting.razor.cs
new file mode 100644
index 0000000..f7578fc
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/Crafting.razor.cs
@@ -0,0 +1,82 @@
+using System;
+using BlazorApp.Models;
+using Microsoft.AspNetCore.Components;
+using Microsoft.JSInterop;
+using System.Collections.ObjectModel;
+using System.Collections.Specialized;
+
+namespace BlazorApp.Components
+{
+    public partial class Crafting
+    {
+        private Item _recipeResult;
+
+        public Crafting()
+        {
+            Actions = new ObservableCollection<CraftingAction>();
+            Actions.CollectionChanged += OnActionsCollectionChanged;
+            this.RecipeItems = new List<Item> { null, null, null, null, null, null, null, null, null };
+        }
+
+        public ObservableCollection<CraftingAction> Actions { get; set; }
+        public Item CurrentDragItem { get; set; }
+
+        [Parameter]
+        public List<Item> Items { get; set; }
+
+        public List<Item> RecipeItems { get; set; }
+
+        public Item RecipeResult
+        {
+            get => this._recipeResult;
+            set
+            {
+                if (this._recipeResult == value)
+                {
+                    return;
+                }
+
+                this._recipeResult = value;
+                this.StateHasChanged();
+            }
+        }
+
+        [Parameter]
+        public List<CraftingRecipe> Recipes { get; set; }
+
+        /// <summary>
+        /// Gets or sets the java script runtime.
+        /// </summary>
+        [Inject]
+        internal IJSRuntime JavaScriptRuntime { get; set; }
+
+        public void CheckRecipe()
+        {
+            RecipeResult = null;
+
+            // Get the current model
+            var currentModel = string.Join("|", this.RecipeItems.Select(s => s != null ? s.Name : string.Empty));
+
+            this.Actions.Add(new CraftingAction { Action = $"Items : {currentModel}" });
+
+            foreach (var craftingRecipe in Recipes)
+            {
+                // Get the recipe model
+                var recipeModel = string.Join("|", craftingRecipe.Have.SelectMany(s => s));
+
+                this.Actions.Add(new CraftingAction { Action = $"Recipe model : {recipeModel}" });
+
+                if (currentModel == recipeModel)
+                {
+                    RecipeResult = craftingRecipe.Give;
+                }
+            }
+        }
+
+        private void OnActionsCollectionChanged(object? sender, NotifyCollectionChangedEventArgs e)
+        {
+            JavaScriptRuntime.InvokeVoidAsync("Crafting.AddActions", e.NewItems);
+        }
+    }
+}
+
diff --git a/BlazorApp/BlazorApp/Components/Crafting.razor.css b/BlazorApp/BlazorApp/Components/Crafting.razor.css
new file mode 100644
index 0000000..2a388f2
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/Crafting.razor.css
@@ -0,0 +1,19 @@
+.css-grid {
+    grid-template-columns: repeat(4,minmax(0,1fr));
+    gap: 10px;
+    display: grid;
+    width: 286px;
+}
+
+.css-recipe {
+    grid-template-columns: repeat(3,minmax(0,1fr));
+    gap: 10px;
+    display: grid;
+    width: 212px;
+}
+
+.actions {
+    border: 1px solid black;
+    height: 250px;
+    overflow: scroll;
+}
diff --git a/BlazorApp/BlazorApp/Components/Crafting.razor.js b/BlazorApp/BlazorApp/Components/Crafting.razor.js
new file mode 100644
index 0000000..f222938
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/Crafting.razor.js
@@ -0,0 +1,20 @@
+<script>
+
+    window.Crafting =
+    {
+        AddActions: function (data) {
+
+            data.forEach(element => {
+                var div = document.createElement('div');
+                div.innerHTML = 'Action: ' + element.action + ' - Index: ' + element.index;
+
+                if (element.item) {
+                    div.innerHTML += ' - Item Name: ' + element.item.name;
+                }
+
+                document.getElementById('actions').appendChild(div);
+            });
+        }
+    }
+
+</script>
\ No newline at end of file
diff --git a/BlazorApp/BlazorApp/Components/CraftingAction.cs b/BlazorApp/BlazorApp/Components/CraftingAction.cs
new file mode 100644
index 0000000..87cc02e
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/CraftingAction.cs
@@ -0,0 +1,13 @@
+using System;
+using BlazorApp.Models;
+
+namespace BlazorApp.Components
+{
+    public class CraftingAction
+    {
+        public string Action { get; set; }
+        public int Index { get; set; }
+        public Item Item { get; set; }
+    }
+}
+
diff --git a/BlazorApp/BlazorApp/Components/CraftingItem.razor b/BlazorApp/BlazorApp/Components/CraftingItem.razor
new file mode 100644
index 0000000..e64e6cd
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/CraftingItem.razor
@@ -0,0 +1,13 @@
+<div class="item"
+     ondragover="event.preventDefault();"
+     draggable="true"
+     @ondragstart="@OnDragStart"
+     @ondrop="@OnDrop"
+     @ondragenter="@OnDragEnter"
+     @ondragleave="@OnDragLeave">
+
+    @if (Item != null)
+    {
+        @Item.DisplayName
+    }
+</div>
\ No newline at end of file
diff --git a/BlazorApp/BlazorApp/Components/CraftingItem.razor.cs b/BlazorApp/BlazorApp/Components/CraftingItem.razor.cs
new file mode 100644
index 0000000..5893a1f
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/CraftingItem.razor.cs
@@ -0,0 +1,68 @@
+using System;
+using BlazorApp.Models;
+using Blazorise;
+using Microsoft.AspNetCore.Components;
+
+namespace BlazorApp.Components
+{
+    public partial class CraftingItem
+    {
+        [Parameter]
+        public int Index { get; set; }
+
+        [Parameter]
+        public Item Item { get; set; }
+
+        [Parameter]
+        public bool NoDrop { get; set; }
+
+        [CascadingParameter]
+        public Crafting Parent { get; set; }
+
+        internal void OnDragEnter()
+        {
+            if (NoDrop)
+            {
+                return;
+            }
+
+            Parent.Actions.Add(new CraftingAction { Action = "Drag Enter", Item = this.Item, Index = this.Index });
+        }
+
+        internal void OnDragLeave()
+        {
+            if (NoDrop)
+            {
+                return;
+            }
+
+            Parent.Actions.Add(new CraftingAction { Action = "Drag Leave", Item = this.Item, Index = this.Index });
+        }
+
+        internal void OnDrop()
+        {
+            if (NoDrop)
+            {
+                return;
+            }
+
+            this.Item = Parent.CurrentDragItem;
+            Parent.RecipeItems[this.Index] = this.Item;
+
+            Parent.Actions.Add(new CraftingAction { Action = "Drop", Item = this.Item, Index = this.Index });
+
+            // Check recipe
+            Parent.CheckRecipe();
+        }
+
+        private void OnDragStart()
+        {
+            Parent.CurrentDragItem = this.Item;
+
+            Parent.Actions.Add(new CraftingAction { Action = "Drag Start", Item = this.Item, Index = this.Index });
+        }
+    }
+}
+
+
+
diff --git a/BlazorApp/BlazorApp/Components/CraftingItem.razor.css b/BlazorApp/BlazorApp/Components/CraftingItem.razor.css
new file mode 100644
index 0000000..b2d4521
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/CraftingItem.razor.css
@@ -0,0 +1,6 @@
+.item {
+    width: 64px;
+    height: 64px;
+    border: 1px solid;
+    overflow: hidden;
+}
diff --git a/BlazorApp/BlazorApp/Components/CraftingRecipe.cs b/BlazorApp/BlazorApp/Components/CraftingRecipe.cs
new file mode 100644
index 0000000..759bbb8
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/CraftingRecipe.cs
@@ -0,0 +1,12 @@
+using System;
+using BlazorApp.Models;
+
+namespace BlazorApp.Components
+{
+    public class CraftingRecipe
+    {
+        public Item Give { get; set; }
+        public List<List<string>> Have { get; set; }
+    }
+}
+
diff --git a/BlazorApp/BlazorApp/Components/MyFirstChildComponent.razor b/BlazorApp/BlazorApp/Components/MyFirstChildComponent.razor
new file mode 100644
index 0000000..592c4e4
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/MyFirstChildComponent.razor
@@ -0,0 +1,14 @@
+@code {
+    [Parameter]
+    public RenderFragment ChildContent { get; set; }
+
+    [CascadingParameter]
+    public MyRootComponent RootComponent { get; set; }
+}
+
+<div style="border: 1px solid black; padding: 10px;">
+    <strong>MyFirstChildComponent - @RootComponent.Text</strong>
+    <div>
+        @ChildContent
+    </div>
+</div>
\ No newline at end of file
diff --git a/BlazorApp/BlazorApp/Components/MyRootComponent.razor b/BlazorApp/BlazorApp/Components/MyRootComponent.razor
new file mode 100644
index 0000000..18895ba
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/MyRootComponent.razor
@@ -0,0 +1,16 @@
+@code {
+    [Parameter]
+    public RenderFragment ChildContent { get; set; }
+
+    [Parameter]
+    public string Text { get; set; }
+}
+
+<div style="border: 1px solid black; padding: 10px;">
+    <strong>MyRootComponent - @Text</strong>
+    <div>
+        <CascadingValue Value="@this">
+            @ChildContent
+        </CascadingValue>
+    </div>
+</div>
\ No newline at end of file
diff --git a/BlazorApp/BlazorApp/Components/MySecondChildComponent.razor b/BlazorApp/BlazorApp/Components/MySecondChildComponent.razor
new file mode 100644
index 0000000..7d207e6
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/MySecondChildComponent.razor
@@ -0,0 +1,14 @@
+@code {
+    [Parameter]
+    public RenderFragment ChildContent { get; set; }
+
+    [CascadingParameter]
+    public MyRootComponent RootComponent { get; set; }
+}
+
+<div style="border: 1px solid black; padding: 10px;">
+    <strong>MySecondChildComponent - @RootComponent.Text</strong>
+    <div>
+        @ChildContent
+    </div>
+</div>
\ No newline at end of file
diff --git a/BlazorApp/BlazorApp/Components/ShowItems.razor b/BlazorApp/BlazorApp/Components/ShowItems.razor
new file mode 100644
index 0000000..f7c75f8
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/ShowItems.razor
@@ -0,0 +1,11 @@
+@typeparam TItem
+
+<div>
+    @if ((Items?.Count ?? 0) != 0)
+    {
+        @foreach (var item in Items)
+        {
+            @ShowTemplate(item);
+        }
+    }
+</div>
diff --git a/BlazorApp/BlazorApp/Components/ShowItems.razor.cs b/BlazorApp/BlazorApp/Components/ShowItems.razor.cs
new file mode 100644
index 0000000..f4fda81
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/ShowItems.razor.cs
@@ -0,0 +1,15 @@
+using System;
+using Microsoft.AspNetCore.Components;
+
+namespace BlazorApp.Components
+{
+    public partial class ShowItems<TItem>
+    {
+        [Parameter]
+        public List<TItem> Items { get; set; }
+
+        [Parameter]
+        public RenderFragment<TItem> ShowTemplate { get; set; }
+    }
+}
+
diff --git a/BlazorApp/BlazorApp/Components/TestRenderFragment.razor b/BlazorApp/BlazorApp/Components/TestRenderFragment.razor
new file mode 100644
index 0000000..e8ca13f
--- /dev/null
+++ b/BlazorApp/BlazorApp/Components/TestRenderFragment.razor
@@ -0,0 +1,7 @@
+<h3>TestRenderFragment</h3>
+
+@code {
+    [Parameter]
+    public RenderFragment ChildContent { get; set; }
+}
+
diff --git a/BlazorApp/BlazorApp/Controllers/CultureController.cs b/BlazorApp/BlazorApp/Controllers/CultureController.cs
new file mode 100644
index 0000000..4af37d9
--- /dev/null
+++ b/BlazorApp/BlazorApp/Controllers/CultureController.cs
@@ -0,0 +1,36 @@
+using System;
+using Microsoft.AspNetCore.Localization;
+using Microsoft.AspNetCore.Mvc;
+
+namespace BlazorApp.Controllers
+{
+    /// <summary>
+    /// The culture controller.
+    /// </summary>
+    [Route("[controller]/[action]")]
+    public class CultureController : Controller
+    {
+        /// <summary>
+        /// Sets the culture.
+        /// </summary>
+        /// <param name="culture">The culture.</param>
+        /// <param name="redirectUri">The redirect URI.</param>
+        /// <returns>
+        /// The action result.
+        /// </returns>
+        public IActionResult SetCulture(string culture, string redirectUri)
+        {
+            if (culture != null)
+            {
+                // Define a cookie with the selected culture
+                this.HttpContext.Response.Cookies.Append(
+                    CookieRequestCultureProvider.DefaultCookieName,
+                    CookieRequestCultureProvider.MakeCookieValue(
+                        new RequestCulture(culture)));
+            }
+
+            return this.LocalRedirect(redirectUri);
+        }
+    }
+}
+
diff --git a/BlazorApp/BlazorApp/Factories/ItemFactory.cs b/BlazorApp/BlazorApp/Factories/ItemFactory.cs
new file mode 100644
index 0000000..c58fa10
--- /dev/null
+++ b/BlazorApp/BlazorApp/Factories/ItemFactory.cs
@@ -0,0 +1,53 @@
+using System;
+using BlazorApp.Models;
+
+namespace BlazorApp.Factories
+{
+    public static class ItemFactory
+    {
+        public static ItemModel ToModel(Item item, byte[] imageContent)
+        {
+            return new ItemModel
+            {
+                Id = item.Id,
+                DisplayName = item.DisplayName,
+                Name = item.Name,
+                RepairWith = item.RepairWith,
+                EnchantCategories = item.EnchantCategories,
+                MaxDurability = item.MaxDurability,
+                StackSize = item.StackSize,
+                ImageContent = imageContent,
+                ImageBase64 = string.IsNullOrWhiteSpace(item.ImageBase64) ? Convert.ToBase64String(imageContent) : item.ImageBase64
+
+            };
+        }
+
+        public static Item Create(ItemModel model)
+        {
+            return new Item
+            {
+                Id = model.Id,
+                DisplayName = model.DisplayName,
+                Name = model.Name,
+                RepairWith = model.RepairWith,
+                EnchantCategories = model.EnchantCategories,
+                MaxDurability = model.MaxDurability,
+                StackSize = model.StackSize,
+                CreatedDate = DateTime.Now
+            };
+        }
+
+        public static void Update(Item item, ItemModel model)
+        {
+            item.DisplayName = model.DisplayName;
+            item.Name = model.Name;
+            item.RepairWith = model.RepairWith;
+            item.EnchantCategories = model.EnchantCategories;
+            item.MaxDurability = model.MaxDurability;
+            item.StackSize = model.StackSize;
+            item.UpdatedDate = DateTime.Now;
+        }
+
+    }
+}
+
diff --git a/BlazorApp/BlazorApp/Modals/DeleteConfirmation.razor b/BlazorApp/BlazorApp/Modals/DeleteConfirmation.razor
new file mode 100644
index 0000000..c3123c8
--- /dev/null
+++ b/BlazorApp/BlazorApp/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>  
diff --git a/BlazorApp/BlazorApp/Modals/DeleteConfirmation.razor.cs b/BlazorApp/BlazorApp/Modals/DeleteConfirmation.razor.cs
new file mode 100644
index 0000000..ac365ac
--- /dev/null
+++ b/BlazorApp/BlazorApp/Modals/DeleteConfirmation.razor.cs
@@ -0,0 +1,40 @@
+using System;
+using BlazorApp.Models;
+using BlazorApp.Services;
+using Blazored.Modal;
+using Blazored.Modal.Services;
+using Microsoft.AspNetCore.Components;
+
+namespace BlazorApp.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();
+        }
+    }
+}
+
diff --git a/BlazorApp/BlazorApp/Models/Cake.cs b/BlazorApp/BlazorApp/Models/Cake.cs
new file mode 100644
index 0000000..068e3af
--- /dev/null
+++ b/BlazorApp/BlazorApp/Models/Cake.cs
@@ -0,0 +1,11 @@
+using System;
+namespace BlazorApp.Models
+{
+    public class Cake
+    {
+        public int Id { get; set; }
+        public string Name { get; set; }
+        public decimal Cost { get; set; }
+    }
+}
+
diff --git a/BlazorApp/BlazorApp/Models/Item.cs b/BlazorApp/BlazorApp/Models/Item.cs
index 0eb9b53..9d26617 100644
--- a/BlazorApp/BlazorApp/Models/Item.cs
+++ b/BlazorApp/BlazorApp/Models/Item.cs
@@ -1,7 +1,7 @@
 namespace BlazorApp.Models
 {
     public class Item
-{
+    {
     public int Id { get; set; }
     public string DisplayName { get; set; }
     public string Name { get; set; }
@@ -11,5 +11,6 @@
     public List<string> RepairWith { get; set; }
     public DateTime CreatedDate { get; set; }
     public DateTime? UpdatedDate { get; set; }
-}
+    public string ImageBase64 { get; set; }
+    }
 }
diff --git a/BlazorApp/BlazorApp/Models/ItemModel.cs b/BlazorApp/BlazorApp/Models/ItemModel.cs
index 59ecd50..b640531 100644
--- a/BlazorApp/BlazorApp/Models/ItemModel.cs
+++ b/BlazorApp/BlazorApp/Models/ItemModel.cs
@@ -34,6 +34,8 @@ namespace BlazorApp.Models
 
         [Required(ErrorMessage = "The image of the item is mandatory!")]
         public byte[] ImageContent { get; set; }
+
+        public string ImageBase64 { get; set; }
     }
 }
 
diff --git a/BlazorApp/BlazorApp/Pages/Edit.razor b/BlazorApp/BlazorApp/Pages/Edit.razor
index 34d55a3..74d3978 100644
--- a/BlazorApp/BlazorApp/Pages/Edit.razor
+++ b/BlazorApp/BlazorApp/Pages/Edit.razor
@@ -2,4 +2,81 @@
 
 <h3>Edit</h3>
 
-<div>My paremeter: @Id</div>
+<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>
+            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>
\ No newline at end of file
diff --git a/BlazorApp/BlazorApp/Pages/Edit.razor.cs b/BlazorApp/BlazorApp/Pages/Edit.razor.cs
index be21d60..7d1abe1 100644
--- a/BlazorApp/BlazorApp/Pages/Edit.razor.cs
+++ b/BlazorApp/BlazorApp/Pages/Edit.razor.cs
@@ -1,5 +1,9 @@
 using System;
+using BlazorApp.Factories;
+using BlazorApp.Models;
+using BlazorApp.Services;
 using Microsoft.AspNetCore.Components;
+using Microsoft.AspNetCore.Components.Forms;
 
 namespace BlazorApp.Pages
 {
@@ -8,6 +12,101 @@ namespace BlazorApp.Pages
         [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");
+
+            if (File.Exists($"{WebHostEnvironment.WebRootPath}/images/{itemModel.Name}.png"))
+            {
+                fileContent = await File.ReadAllBytesAsync($"{WebHostEnvironment.WebRootPath}/images/{item.Name}.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);
+            }
+        }
     }
 }
 
diff --git a/BlazorApp/BlazorApp/Pages/Index.razor b/BlazorApp/BlazorApp/Pages/Index.razor
index b1a9fbd..5deb450 100644
--- a/BlazorApp/BlazorApp/Pages/Index.razor
+++ b/BlazorApp/BlazorApp/Pages/Index.razor
@@ -1,9 +1,48 @@
 @page "/"
+@using System.Globalization
+@using BlazorApp.Components
 
 <PageTitle>Index</PageTitle>
 
 <h1>Hello, world!</h1>
 
-Welcome to your new app.
+<!--
+<ShowItems Items="Cakes">
+    <ShowTemplate Context="CakeContext">
+        <div class="card text-center">
+            <div class="card-header">
+                Cake Token Id - @CakeContext.Id
+            </div>
+            <div class="card-body">
+                <h5 class="card-title">@CakeContext.Name</h5>
+                <p class="card-text">Price $@CakeContext.Cost</p>
+            </div>
+            <div class="card-footer text-muted">
+                Click Here
+            </div>
+        </div>
+    </ShowTemplate>
+</ShowItems>
 
-<SurveyPrompt Title="How is Blazor working for you?" />
+
+<MyRootComponent Text="RootComponentText">
+    <MyFirstChildComponent>
+        <MySecondChildComponent>
+            <div>MySecondChildComponent - Content</div>
+        </MySecondChildComponent>
+    </MyFirstChildComponent>
+</MyRootComponent>
+
+
+<TestRenderFragment>
+    <div>Content of my TestRenderFragment</div>
+</TestRenderFragment>
+
+<p>
+    <b>CurrentCulture</b>: @CultureInfo.CurrentCulture
+</p>
+    -->
+
+<div>
+    <Crafting Items="Items" Recipes="Recipes" />
+</div>
diff --git a/BlazorApp/BlazorApp/Pages/Index.razor.cs b/BlazorApp/BlazorApp/Pages/Index.razor.cs
new file mode 100644
index 0000000..b0e2eb7
--- /dev/null
+++ b/BlazorApp/BlazorApp/Pages/Index.razor.cs
@@ -0,0 +1,58 @@
+using System;
+using BlazorApp.Components;
+using BlazorApp.Models;
+using BlazorApp.Services;
+using Microsoft.AspNetCore.Components;
+
+namespace BlazorApp.Pages
+{
+    public partial class Index
+    {
+        /*
+        public List<Cake> Cakes { get; set; }
+
+        protected override Task OnAfterRenderAsync(bool firstRender)
+        {
+            LoadCakes();
+            StateHasChanged();
+            return base.OnAfterRenderAsync(firstRender);
+        }
+
+        public void LoadCakes()
+        {
+            Cakes = new List<Cake>
+            {
+                // items hidden for display purpose
+                new Cake
+                {
+                    Id = 1,
+                    Name = "Red Velvet",
+                    Cost = 60
+                },
+                new Cake
+                {
+                    Id = 2,
+                    Name = "Black Forest",
+                    Cost = 50
+                },
+            };
+        }
+        */
+
+        [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   OnInitializedAsync()
+        {
+            await base.OnInitializedAsync();
+
+            Items = await DataService.List(0, await DataService.Count());
+            Recipes = await DataService.GetRecipes();
+        }
+    }
+}
+
diff --git a/BlazorApp/BlazorApp/Pages/List.razor b/BlazorApp/BlazorApp/Pages/List.razor
index 6ed4807..9fc6239 100644
--- a/BlazorApp/BlazorApp/Pages/List.razor
+++ b/BlazorApp/BlazorApp/Pages/List.razor
@@ -1,8 +1,7 @@
 @page "/List"
 @using BlazorApp.Models;
 
-
-<h3>List</h3>
+<h3>@Localizer["Title"]</h3>
 
 <!--
 
@@ -81,6 +80,7 @@
     <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="() => OnDeleteAsync(context.Id)"><i class="fa fa-trash"></i> Supprimer</button>
         </DisplayTemplate>
     </DataGridColumn>
 </DataGrid>
\ No newline at end of file
diff --git a/BlazorApp/BlazorApp/Pages/List.razor.cs b/BlazorApp/BlazorApp/Pages/List.razor.cs
index 361129a..12909a1 100644
--- a/BlazorApp/BlazorApp/Pages/List.razor.cs
+++ b/BlazorApp/BlazorApp/Pages/List.razor.cs
@@ -1,9 +1,13 @@
-using BlazorApp.Models;
+using BlazorApp.Modals;
+using BlazorApp.Models;
 using BlazorApp.Services;
 using Blazored.LocalStorage;
+using Blazored.Modal;
+using Blazored.Modal.Services;
 using Blazorise.DataGrid;
 using Microsoft.AspNetCore.Components;
-
+using Microsoft.Extensions.Localization;
+
 namespace BlazorApp.Pages
 {
     public partial class List
@@ -27,6 +31,12 @@ namespace BlazorApp.Pages
         [Inject]
         public IDataService DataService { get; set; }
 
+        [Inject]
+        public IStringLocalizer<List> Localizer { get; set; }
+
+        [CascadingParameter]
+        public IModalService Modal { get; set; }
+
         protected override async Task OnAfterRenderAsync(bool firstRender)
         {
             // Do not treat this action if is not the first render
@@ -59,5 +69,24 @@ namespace BlazorApp.Pages
                 totalItem = await DataService.Count();
             }
         }
+
+        private async Task OnDeleteAsync(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);
+        }
     }
 }
diff --git a/BlazorApp/BlazorApp/Pages/Pets1.razor b/BlazorApp/BlazorApp/Pages/Pets1.razor
new file mode 100644
index 0000000..bc3600d
--- /dev/null
+++ b/BlazorApp/BlazorApp/Pages/Pets1.razor
@@ -0,0 +1,29 @@
+@page "/pets1"
+
+<h1>Pets</h1>
+
+<TableTemplate Items="pets" Context="pet">
+    <TableHeader>
+        <th>ID</th>
+        <th>Name</th>
+    </TableHeader>
+    <RowTemplate>
+        <td>@pet.PetId</td>
+        <td>@pet.Name</td>
+    </RowTemplate>
+</TableTemplate>
+
+@code {
+    private List<Pet> pets = new()
+{
+        new Pet { PetId = 2, Name = "Mr. Bigglesworth" },
+        new Pet { PetId = 4, Name = "Salem Saberhagen" },
+        new Pet { PetId = 7, Name = "K-9" }
+    };
+
+    private class Pet
+    {
+        public int PetId { get; set; }
+        public string? Name { get; set; }
+    }
+}
\ No newline at end of file
diff --git a/BlazorApp/BlazorApp/Pages/Pets2.razor b/BlazorApp/BlazorApp/Pages/Pets2.razor
new file mode 100644
index 0000000..2cd9155
--- /dev/null
+++ b/BlazorApp/BlazorApp/Pages/Pets2.razor
@@ -0,0 +1,29 @@
+@page "/pets2"
+
+<h1>Pets</h1>
+
+<TableTemplate Items="pets">
+    <TableHeader>
+        <th>ID</th>
+        <th>Name</th>
+    </TableHeader>
+    <RowTemplate Context="pet">
+        <td>@pet.PetId</td>
+        <td>@pet.Name</td>
+    </RowTemplate>
+</TableTemplate>
+
+@code {
+    private List<Pet> pets = new()
+{
+        new Pet { PetId = 2, Name = "Mr. Bigglesworth" },
+        new Pet { PetId = 4, Name = "Salem Saberhagen" },
+        new Pet { PetId = 7, Name = "K-9" }
+    };
+
+    private class Pet
+    {
+        public int PetId { get; set; }
+        public string? Name { get; set; }
+    }
+}
\ No newline at end of file
diff --git a/BlazorApp/BlazorApp/Pages/Pets3.razor b/BlazorApp/BlazorApp/Pages/Pets3.razor
new file mode 100644
index 0000000..b15a61f
--- /dev/null
+++ b/BlazorApp/BlazorApp/Pages/Pets3.razor
@@ -0,0 +1,29 @@
+@page "/pets3"
+
+<h1>Pets</h1>
+
+<TableTemplate Items="pets">
+    <TableHeader>
+        <th>ID</th>
+        <th>Name</th>
+    </TableHeader>
+    <RowTemplate>
+        <td>@context.PetId</td>
+        <td>@context.Name</td>
+    </RowTemplate>
+</TableTemplate>
+
+@code {
+    private List<Pet> pets = new()
+{
+        new Pet { PetId = 2, Name = "Mr. Bigglesworth" },
+        new Pet { PetId = 4, Name = "Salem Saberhagen" },
+        new Pet { PetId = 7, Name = "K-9" }
+    };
+
+    private class Pet
+    {
+        public int PetId { get; set; }
+        public string? Name { get; set; }
+    }
+}
\ No newline at end of file
diff --git a/BlazorApp/BlazorApp/Pages/Pets4.razor b/BlazorApp/BlazorApp/Pages/Pets4.razor
new file mode 100644
index 0000000..ba32af9
--- /dev/null
+++ b/BlazorApp/BlazorApp/Pages/Pets4.razor
@@ -0,0 +1,29 @@
+@page "/pets4"
+
+<h1>Pets</h1>
+
+<TableTemplate Items="pets" TItem="Pet">
+    <TableHeader>
+        <th>ID</th>
+        <th>Name</th>
+    </TableHeader>
+    <RowTemplate>
+        <td>@context.PetId</td>
+        <td>@context.Name</td>
+    </RowTemplate>
+</TableTemplate>
+
+@code {
+    private List<Pet> pets = new()
+{
+        new Pet { PetId = 2, Name = "Mr. Bigglesworth" },
+        new Pet { PetId = 4, Name = "Salem Saberhagen" },
+        new Pet { PetId = 7, Name = "K-9" }
+    };
+
+    private class Pet
+    {
+        public int PetId { get; set; }
+        public string? Name { get; set; }
+    }
+}
\ No newline at end of file
diff --git a/BlazorApp/BlazorApp/Pages/_Layout.cshtml b/BlazorApp/BlazorApp/Pages/_Layout.cshtml
index c34fa19..44ede79 100644
--- a/BlazorApp/BlazorApp/Pages/_Layout.cshtml
+++ b/BlazorApp/BlazorApp/Pages/_Layout.cshtml
@@ -11,6 +11,8 @@
     <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
     <link href="css/site.css" rel="stylesheet" />
     <link href="BlazorApp.styles.css" rel="stylesheet" />
+    <link href="_content/Blazored.Modal/blazored-modal.css" rel="stylesheet" />
+
     <component type="typeof(HeadOutlet)" render-mode="ServerPrerendered" />
 </head>
 <body>
@@ -28,8 +30,11 @@
     </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 rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css">
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css">
 
     <link href="_content/Blazorise/blazorise.css" rel="stylesheet" />
     <link href="_content/Blazorise.Bootstrap/blazorise.bootstrap.css" rel="stylesheet" />
diff --git a/BlazorApp/BlazorApp/Program.cs b/BlazorApp/BlazorApp/Program.cs
index 53eaa40..a981be2 100644
--- a/BlazorApp/BlazorApp/Program.cs
+++ b/BlazorApp/BlazorApp/Program.cs
@@ -6,7 +6,11 @@ using Blazorise.Bootstrap;
 using Blazorise.Icons.FontAwesome;
 using Microsoft.AspNetCore.Components;
 using Microsoft.AspNetCore.Components.Web;
-
+using Blazored.Modal;
+using System.Globalization;
+using Microsoft.Extensions.Options;
+using Microsoft.AspNetCore.Localization;
+
 var builder = WebApplication.CreateBuilder(args);
 
 // Add services to the container.
@@ -23,6 +27,25 @@ builder.Services.AddBlazoredLocalStorage();
 
 builder.Services.AddScoped<IDataService, DataLocalService>();
 
+builder.Services.AddBlazoredModal();
+
+// Add the controller of the app
+builder.Services.AddControllers();
+
+// Add the localization to the app and specify the resources path
+builder.Services.AddLocalization(opts => { opts.ResourcesPath = "Resources"; });
+
+// Configure the localtization
+builder.Services.Configure<RequestLocalizationOptions>(options =>
+{
+    // Set the default culture of the web site
+    options.DefaultRequestCulture = new RequestCulture(new CultureInfo("en-US"));
+
+    // Declare the supported culture
+    options.SupportedCultures = new List<CultureInfo> { new CultureInfo("en-US"), new CultureInfo("fr-FR") };
+    options.SupportedUICultures = new List<CultureInfo> { new CultureInfo("en-US"), new CultureInfo("fr-FR") };
+});
+
 var app = builder.Build();
 
 // Configure the HTTP request pipeline.
@@ -39,6 +62,21 @@ app.UseStaticFiles();
 
 app.UseRouting();
 
+// Get the current localization options
+var options = ((IApplicationBuilder)app).ApplicationServices.GetService<IOptions<RequestLocalizationOptions>>();
+
+if (options?.Value != null)
+{
+    // use the default localization
+    app.UseRequestLocalization(options.Value);
+}
+
+// Add the controller to the endpoint
+app.UseEndpoints(endpoints =>
+{
+    endpoints.MapControllers();
+});
+
 app.MapBlazorHub();
 app.MapFallbackToPage("/_Host");
 
diff --git a/BlazorApp/BlazorApp/Resources/Pages.List.Designer.cs b/BlazorApp/BlazorApp/Resources/Pages.List.Designer.cs
new file mode 100644
index 0000000..febd593
--- /dev/null
+++ b/BlazorApp/BlazorApp/Resources/Pages.List.Designer.cs
@@ -0,0 +1,60 @@
+//------------------------------------------------------------------------------
+// <auto-generated>
+//     This code was generated by a tool.
+//
+//     Changes to this file may cause incorrect behavior and will be lost if
+//     the code is regenerated.
+// </auto-generated>
+//------------------------------------------------------------------------------
+
+namespace BlazorApp.Resources {
+    using System;
+    
+    
+    /// <summary>
+    ///   A strongly-typed resource class, for looking up localized strings, etc.
+    ///   This class was generated by MSBuild using the GenerateResource task.
+    ///   To add or remove a member, edit your .resx file then rerun MSBuild.
+    /// </summary>
+    [global::System.CodeDom.Compiler.GeneratedCodeAttribute("Microsoft.Build.Tasks.StronglyTypedResourceBuilder", "15.1.0.0")]
+    [global::System.Diagnostics.DebuggerNonUserCodeAttribute()]
+    [global::System.Runtime.CompilerServices.CompilerGeneratedAttribute()]
+    internal class Pages_List {
+        
+        private static global::System.Resources.ResourceManager resourceMan;
+        
+        private static global::System.Globalization.CultureInfo resourceCulture;
+        
+        [global::System.Diagnostics.CodeAnalysis.SuppressMessageAttribute("Microsoft.Performance", "CA1811:AvoidUncalledPrivateCode")]
+        internal Pages_List() {
+        }
+        
+        /// <summary>
+        ///   Returns the cached ResourceManager instance used by this class.
+        /// </summary>
+        [global::System.ComponentModel.EditorBrowsableAttribute(global::System.ComponentModel.EditorBrowsableState.Advanced)]
+        internal static global::System.Resources.ResourceManager ResourceManager {
+            get {
+                if (object.ReferenceEquals(resourceMan, null)) {
+                    global::System.Resources.ResourceManager temp = new global::System.Resources.ResourceManager("BlazorApp.Resources.Pages.List", typeof(Pages_List).Assembly);
+                    resourceMan = temp;
+                }
+                return resourceMan;
+            }
+        }
+        
+        /// <summary>
+        ///   Overrides the current thread's CurrentUICulture property for all
+        ///   resource lookups using this strongly typed resource class.
+        /// </summary>
+        [global::System.ComponentModel.EditorBrowsableAttribute(global::System.ComponentModel.EditorBrowsableState.Advanced)]
+        internal static global::System.Globalization.CultureInfo Culture {
+            get {
+                return resourceCulture;
+            }
+            set {
+                resourceCulture = value;
+            }
+        }
+    }
+}
diff --git a/BlazorApp/BlazorApp/Resources/Pages.List.resx b/BlazorApp/BlazorApp/Resources/Pages.List.resx
new file mode 100644
index 0000000..8bb86da
--- /dev/null
+++ b/BlazorApp/BlazorApp/Resources/Pages.List.resx
@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<root>
+	<resheader name="resmimetype">
+		<value>text/microsoft-resx</value>
+	</resheader>
+	<resheader name="version">
+		<value>2.0</value>
+	</resheader>
+	<resheader name="reader">
+		<value>System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
+	</resheader>
+	<resheader name="writer">
+		<value>System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
+	</resheader>
+</root>
+
diff --git a/BlazorApp/BlazorApp/Services/DataLocalService.cs b/BlazorApp/BlazorApp/Services/DataLocalService.cs
index 1a1d806..f2cbcb7 100644
--- a/BlazorApp/BlazorApp/Services/DataLocalService.cs
+++ b/BlazorApp/BlazorApp/Services/DataLocalService.cs
@@ -1,4 +1,6 @@
 using System;
+using BlazorApp.Components;
+using BlazorApp.Factories;
 using BlazorApp.Models;
 using Blazored.LocalStorage;
 using Microsoft.AspNetCore.Components;
@@ -33,17 +35,7 @@ namespace BlazorApp.Services
             model.Id = currentData.Max(s => s.Id) + 1;
 
             // Add the item to the current data
-            currentData.Add(new Item
-            {
-                Id = model.Id,
-                DisplayName = model.DisplayName,
-                Name = model.Name,
-                RepairWith = model.RepairWith,
-                EnchantCategories = model.EnchantCategories,
-                MaxDurability = model.MaxDurability,
-                StackSize = model.StackSize,
-                CreatedDate = DateTime.Now
-            });
+            currentData.Add(ItemFactory.Create(model));
 
             // Save the image
             var imagePathInfo = new DirectoryInfo($"{_webHostEnvironment.WebRootPath}/images");
@@ -143,17 +135,55 @@ namespace BlazorApp.Services
             await File.WriteAllBytesAsync(fileName.FullName, model.ImageContent);
 
             // Modify the content of the item
-            item.DisplayName = model.DisplayName;
-            item.Name = model.Name;
-            item.RepairWith = model.RepairWith;
-            item.EnchantCategories = model.EnchantCategories;
-            item.MaxDurability = model.MaxDurability;
-            item.StackSize = model.StackSize;
-            item.UpdatedDate = DateTime.Now;
+            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);
+
+            // Delete the image
+            var imagePathInfo = new DirectoryInfo($"{_webHostEnvironment.WebRootPath}/images");
+            var fileName = new FileInfo($"{imagePathInfo}/{item.Name}.png");
+
+            if (fileName.Exists)
+            {
+                File.Delete(fileName.FullName);
+            }
 
             // 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);
+        }
     }
 }
 
diff --git a/BlazorApp/BlazorApp/Services/IDataService.cs b/BlazorApp/BlazorApp/Services/IDataService.cs
index bfbdd1e..c040c68 100644
--- a/BlazorApp/BlazorApp/Services/IDataService.cs
+++ b/BlazorApp/BlazorApp/Services/IDataService.cs
@@ -1,4 +1,5 @@
 using System;
+using BlazorApp.Components;
 using BlazorApp.Models;
 
 namespace BlazorApp.Services
@@ -8,8 +9,12 @@ namespace BlazorApp.Services
         Task Add(ItemModel model);
 
         Task<int> Count();
-
+        Task<Item> GetById(int id);
         Task<List<Item>> List(int currentPage, int pageSize);
+        Task Update(int id, ItemModel itemModel);
+        Task Delete(int id);
+        Task<List<CraftingRecipe>> GetRecipes();
+
     }
 }
 
diff --git a/BlazorApp/BlazorApp/Shared/CultureSelector.razor b/BlazorApp/BlazorApp/Shared/CultureSelector.razor
new file mode 100644
index 0000000..0f46a4e
--- /dev/null
+++ b/BlazorApp/BlazorApp/Shared/CultureSelector.razor
@@ -0,0 +1,43 @@
+@using  System.Globalization
+@inject NavigationManager NavigationManager
+
+<p>
+    <label>
+        Select your locale:
+        <select @bind="Culture">
+            @foreach (var culture in supportedCultures)
+            {
+                <option value="@culture">@culture.DisplayName</option>
+            }
+        </select>
+    </label>
+</p>
+
+@code
+{
+    private CultureInfo[] supportedCultures = new[]
+    {
+        new CultureInfo("en-US"),
+        new CultureInfo("fr-FR")
+    };
+
+    private CultureInfo Culture
+    {
+        get => CultureInfo.CurrentCulture;
+        set
+        {
+            if (CultureInfo.CurrentUICulture == value)
+            {
+                return;
+            }
+
+            var culture = value.Name.ToLower(CultureInfo.InvariantCulture);
+
+            var uri = new Uri(this.NavigationManager.Uri).GetComponents(UriComponents.PathAndQuery, UriFormat.Unescaped);
+            var query = $"?culture={Uri.EscapeDataString(culture)}&" + $"redirectUri={Uri.EscapeDataString(uri)}";
+
+            // Redirect the user to the culture controller to set the cookie
+            this.NavigationManager.NavigateTo("/Culture/SetCulture" + query, forceLoad: true);
+        }
+    }
+}
diff --git a/BlazorApp/BlazorApp/Shared/MainLayout.razor b/BlazorApp/BlazorApp/Shared/MainLayout.razor
index b6f228d..227d618 100644
--- a/BlazorApp/BlazorApp/Shared/MainLayout.razor
+++ b/BlazorApp/BlazorApp/Shared/MainLayout.razor
@@ -10,6 +10,10 @@
     <main>
         <div class="top-row px-4">
             <a href="https://docs.microsoft.com/aspnet/" target="_blank">About</a>
+
+            <div class="px-4">
+                <CultureSelector />
+            </div>
         </div>
 
         <article class="content px-4">
diff --git a/BlazorApp/BlazorApp/Shared/TableTemplate.razor b/BlazorApp/BlazorApp/Shared/TableTemplate.razor
new file mode 100644
index 0000000..72c3ae5
--- /dev/null
+++ b/BlazorApp/BlazorApp/Shared/TableTemplate.razor
@@ -0,0 +1,28 @@
+@typeparam TItem
+@using System.Diagnostics.CodeAnalysis
+
+<table class="table">
+    <thead>
+        <tr>@TableHeader</tr>
+    </thead>
+    <tbody>
+        @foreach (var item in Items)
+        {
+            if (RowTemplate is not null)
+            {
+                <tr>@RowTemplate(item)</tr>
+            }
+        }
+    </tbody>
+</table>
+
+@code {
+    [Parameter]
+    public RenderFragment? TableHeader { get; set; }
+
+    [Parameter]
+    public RenderFragment<TItem>? RowTemplate { get; set; }
+
+    [Parameter, AllowNull]
+    public IReadOnlyList<TItem> Items { get; set; }
+}
\ No newline at end of file
diff --git a/BlazorApp/BlazorApp/_Imports.razor b/BlazorApp/BlazorApp/_Imports.razor
index 6c0ecaf..e134351 100644
--- a/BlazorApp/BlazorApp/_Imports.razor
+++ b/BlazorApp/BlazorApp/_Imports.razor
@@ -9,3 +9,5 @@
 @using BlazorApp
 @using BlazorApp.Shared
 @using Blazorise.DataGrid
+@using Blazored.Modal
+@using Blazored.Modal.Services
diff --git a/BlazorApp/BlazorApp/wwwroot/images/edit.png b/BlazorApp/BlazorApp/wwwroot/images/edit.png
new file mode 100644
index 0000000000000000000000000000000000000000..a7446c9e8a8c755f1e21faf389634136d44fed6d
GIT binary patch
literal 2267
zcmeHIX<HJA7N)euRB9U19L<?Y!?M&|(XuSu%dON=D#ldOTrzi4$7;+C8<#S1OUnhF
z6hyR0aS6w@5m!VI6jX3Qam5W$^xEfp|G}N}yze>BIq!$_ocGH~zGZI(lvb1m006)n
z*5;1;HEW*%QWE<)?4{2);XtUPl_>z%dun#Sk$ecXg8~56=`uSWhX4Qxz%5&6i`?AY
zyu7@(Z{OzU=NA+d6c-nll$4;+=+e^Cva+)B^74v`3JeB=#bPTfD{(knRaF%pkFTz-
zCJ+dpKYy;Rt*xu8BNB=A_4N%64ULVBBoe8mrKPpCwXLnKy}iA&v$MOqyQin8x3{;i
zudlzqe_&vMLZJ)}4pOPqp`jrfjYg-_hlht53<i_Q92prI9UWz{SZp?XY;0_Ne0*YJ
zg2Ul(x!lRg$*HNS>FMd2nHe6BH#<8!H#f)U^XKR17Zw&47Z;b7mX?>7S5{U80>SF)
z>e|}c`uh6D#>VF6rcfx{+S(F{MBCfjJ3BjKv3PfPcW-ZR-<E&l|Ji{Lsj}Gp`;P=!
z-w6c(WI*3|0Falj0010%aKjwx9O<@@_xrsO$cZGDPV}9sxW~$IgjY&Lef?O7M`og=
zwPO-Ir(|jGPIOuf$2twfHv*AAc9O0ky^in+8ndUA{|RnC++|m-aI@OzzahGYU~S&*
zi6+3$qcH2<m?sXk^nNDHt@ie1>2fMBI<w%Gzvue387VM&bjC#P209#HR-g+tuNcjB
zgnpql*K0Y73vE{>vBA&SM#k#iJoyiib{34ADdDcA_31T)KpX{irS?~{BklHj+M+J%
zdw&s15$x2E%ww_b0<!iD2C{7v4T{RTAe~_kq1;fvnz{JJpiC*U=2vOGRFr|e;<G>H
zGN`Wrd|F^q*B=xc1K~Lt??CkcoFt51b6of2;ey0^_r$9zTQI|#vY7M?ow*q>9SF8-
z@0i<G?huNtDEeMGp(ZE&tvl2n?gVa9PE00d>VrUJnQmY<rdyY7i@gXlgZ3VqhI0`b
zdkKz~9FOpotvgS?PAY!=vD8K#RE@u~#SGwi*y14a*Supa<!OgZn$le1xXbdS!uVJt
z7-&cS(%85*QO)S7S5KwtcbMcenm4tHIDFWfA67iwSqKE`;2SfzyFz+|sR%KkWf$zy
zqj=Fo0hWy{>RvoR7rLH3!`KV^4KZPJv+ZSUf{CD-c{CJf7_T?DikxnFe$i3IWg0g2
z8v2|y1wY;cR@ycOa~`B6D4Xd0Y?F=Zy2WL(Sz}{QZDAy5>($Mi!c@bBwP~2}xXFM4
zuZi236Fe2m@7jC35T~iKy6(nCi6p^xq+%VK6rWTqDTU9^HVZc7N>f=YvH1%#>G~R%
ztWwS$S4Cj$c|}Mt5&b?1PH1XsJ*=P*c;8XHl`h;qD`)csmh^*;Ziip9o=jM3227F8
zGZ>AGkd9ka_Ac5MHM|7lJ(R+fRS_ES7v)@X=iSMWqkq4Nk|x#Rgm$f_t*}zQ!jA|K
zRz)QkD}}qV_E;EYEdSU3?oVs4d{vw@j`_P7cgT_%2??YQ!jK#rBos#}?S6pO{GJzO
zSO%*hRbUDLG8fcv#_##pk;k6BOB-r6^)?$g;r~avGaYk)R-Th4hjZ1|vu#)R@`K6r
z!L*z-e50v`Ks?iP*$*8`EH=wk%z6~8w~BZ<)M;hu8QxwA;?&Fi)&+0Vy{C;EyQ>^&
ziS+-4nd#d=aM{pQ2suv|PKaoN*Fq>#LKsyUq)t4amGHVQh8@jG)`|u;8%Whfh_5J<
zTN(*rSx-(aM+k(N5a9hTjs1}Zsax&EyR-zOwm;8l$&nN7QZ{};vtz%D6v=9-)H!P?
z{bY_NSum|GVuI^xUE?OoLe*g*)SZ#ttQeoK#=uV{@mFJT2ZPmNE{%gy_uU3)(0l9x
zx73I5aUQ83j};0gQ0ZxhqEjxs510W4{evv(Gw7`OBsfwDI*IqD5T{{Tv}C~r`M9YN
zah2EQ*j>4xg4@A5?ZY_<zpk6gdZG^EuG2ifFGBYCB@pK=9_<LTbgi(Nm{5YY7x>GR
zmBeb<>8q*!FOJv@Tn9(^si4T-^I<>vLI(56kI}gtf%j20pN=VJDtS<=V}+tg$0Kbl
z!!;H?``<Y*VhU}vGKa4I%skBvWw1`aT{xR1t9&AlRk?Kba6?t%`WiYL@qE)@7z4R9
zuHCduHfeSX$A8?@i6~ZZe(-k^gOT(+L-pBUFZ6oqM<>-8vO}uA81l5)Nwwb>B1i#R
zUwuubIGlO9-DiKM2qM^#_tA4`D1xj!Dx_MzL$48HXY3cwwR8R_eDtd0w<U($bz3qB
S+U4J#&<zWFbDXLBi~j(G8>ig>

literal 0
HcmV?d00001