tp de blazor

2 months ago · 5180475d17
parent 652624c4a9
commit 5180475d17
64 changed files with 3150 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,427 @@
+# Created by https://www.toptal.com/developers/gitignore/api/dotnetcore,visualstudio,visualstudiocode
+# Edit at https://www.toptal.com/developers/gitignore?templates=dotnetcore,visualstudio,visualstudiocode
+
+### DotnetCore ###
+# .NET Core build folders
+bin/
+obj/
+
+# Common node modules locations
+/node_modules
+/wwwroot/node_modules
+
+### VisualStudioCode ###
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+!.vscode/*.code-snippets
+
+# Local History for Visual Studio Code
+.history/
+
+# Built Visual Studio Code Extensions
+*.vsix
+
+### VisualStudioCode Patch ###
+# Ignore all local history of files
+.history
+.ionide
+
+### VisualStudio ###
+## Ignore Visual Studio temporary files, build results, and
+## files generated by popular Visual Studio add-ons.
+##
+## Get latest from https://github.com/github/gitignore/blob/main/VisualStudio.gitignore
+
+# User-specific files
+*.rsuser
+*.suo
+*.user
+*.userosscache
+*.sln.docstates
+
+# User-specific files (MonoDevelop/Xamarin Studio)
+*.userprefs
+
+# Mono auto generated files
+mono_crash.*
+
+# Build results
+[Dd]ebug/
+[Dd]ebugPublic/
+[Rr]elease/
+[Rr]eleases/
+x64/
+x86/
+[Ww][Ii][Nn]32/
+[Aa][Rr][Mm]/
+[Aa][Rr][Mm]64/
+bld/
+[Bb]in/
+[Oo]bj/
+[Ll]og/
+[Ll]ogs/
+
+# Visual Studio 2015/2017 cache/options directory
+.vs/
+# Uncomment if you have tasks that create the project's static files in wwwroot
+#wwwroot/
+
+# Visual Studio 2017 auto generated files
+Generated\ Files/
+
+# MSTest test Results
+[Tt]est[Rr]esult*/
+[Bb]uild[Ll]og.*
+
+# NUnit
+*.VisualState.xml
+TestResult.xml
+nunit-*.xml
+
+# Build Results of an ATL Project
+[Dd]ebugPS/
+[Rr]eleasePS/
+dlldata.c
+
+# Benchmark Results
+BenchmarkDotNet.Artifacts/
+
+# .NET Core
+project.lock.json
+project.fragment.lock.json
+artifacts/
+
+# ASP.NET Scaffolding
+ScaffoldingReadMe.txt
+
+# StyleCop
+StyleCopReport.xml
+
+# Files built by Visual Studio
+*_i.c
+*_p.c
+*_h.h
+*.ilk
+*.meta
+*.obj
+*.iobj
+*.pch
+*.pdb
+*.ipdb
+*.pgc
+*.pgd
+*.rsp
+*.sbr
+*.tlb
+*.tli
+*.tlh
+*.tmp
+*.tmp_proj
+*_wpftmp.csproj
+*.log
+*.tlog
+*.vspscc
+*.vssscc
+.builds
+*.pidb
+*.svclog
+*.scc
+
+# Chutzpah Test files
+_Chutzpah*
+
+# Visual C++ cache files
+ipch/
+*.aps
+*.ncb
+*.opendb
+*.opensdf
+*.sdf
+*.cachefile
+*.VC.db
+*.VC.VC.opendb
+
+# Visual Studio profiler
+*.psess
+*.vsp
+*.vspx
+*.sap
+
+# Visual Studio Trace Files
+*.e2e
+
+# TFS 2012 Local Workspace
+$tf/
+
+# Guidance Automation Toolkit
+*.gpState
+
+# ReSharper is a .NET coding add-in
+_ReSharper*/
+*.[Rr]e[Ss]harper
+*.DotSettings.user
+
+# TeamCity is a build add-in
+_TeamCity*
+
+# DotCover is a Code Coverage Tool
+*.dotCover
+
+# AxoCover is a Code Coverage Tool
+.axoCover/*
+!.axoCover/settings.json
+
+# Coverlet is a free, cross platform Code Coverage Tool
+coverage*.json
+coverage*.xml
+coverage*.info
+
+# Visual Studio code coverage results
+*.coverage
+*.coveragexml
+
+# NCrunch
+_NCrunch_*
+.*crunch*.local.xml
+nCrunchTemp_*
+
+# MightyMoose
+*.mm.*
+AutoTest.Net/
+
+# Web workbench (sass)
+.sass-cache/
+
+# Installshield output folder
+[Ee]xpress/
+
+# DocProject is a documentation generator add-in
+DocProject/buildhelp/
+DocProject/Help/*.HxT
+DocProject/Help/*.HxC
+DocProject/Help/*.hhc
+DocProject/Help/*.hhk
+DocProject/Help/*.hhp
+DocProject/Help/Html2
+DocProject/Help/html
+
+# Click-Once directory
+publish/
+
+# Publish Web Output
+*.[Pp]ublish.xml
+*.azurePubxml
+# Note: Comment the next line if you want to checkin your web deploy settings,
+# but database connection strings (with potential passwords) will be unencrypted
+*.pubxml
+*.publishproj
+
+# Microsoft Azure Web App publish settings. Comment the next line if you want to
+# checkin your Azure Web App publish settings, but sensitive information contained
+# in these scripts will be unencrypted
+PublishScripts/
+
+# NuGet Packages
+*.nupkg
+# NuGet Symbol Packages
+*.snupkg
+# The packages folder can be ignored because of Package Restore
+**/[Pp]ackages/*
+# except build/, which is used as an MSBuild target.
+!**/[Pp]ackages/build/
+# Uncomment if necessary however generally it will be regenerated when needed
+#!**/[Pp]ackages/repositories.config
+# NuGet v3's project.json files produces more ignorable files
+*.nuget.props
+*.nuget.targets
+
+# Microsoft Azure Build Output
+csx/
+*.build.csdef
+
+# Microsoft Azure Emulator
+ecf/
+rcf/
+
+# Windows Store app package directories and files
+AppPackages/
+BundleArtifacts/
+Package.StoreAssociation.xml
+_pkginfo.txt
+*.appx
+*.appxbundle
+*.appxupload
+
+# Visual Studio cache files
+# files ending in .cache can be ignored
+*.[Cc]ache
+# but keep track of directories ending in .cache
+!?*.[Cc]ache/
+
+# Others
+ClientBin/
+~$*
+*~
+*.dbmdl
+*.dbproj.schemaview
+*.jfm
+*.pfx
+*.publishsettings
+orleans.codegen.cs
+
+# Including strong name files can present a security risk
+# (https://github.com/github/gitignore/pull/2483#issue-259490424)
+#*.snk
+
+# Since there are multiple workflows, uncomment next line to ignore bower_components
+# (https://github.com/github/gitignore/pull/1529#issuecomment-104372622)
+#bower_components/
+
+# RIA/Silverlight projects
+Generated_Code/
+
+# Backup & report files from converting an old project file
+# to a newer Visual Studio version. Backup files are not needed,
+# because we have git ;-)
+_UpgradeReport_Files/
+Backup*/
+UpgradeLog*.XML
+UpgradeLog*.htm
+ServiceFabricBackup/
+*.rptproj.bak
+
+# SQL Server files
+*.mdf
+*.ldf
+*.ndf
+
+# Business Intelligence projects
+*.rdl.data
+*.bim.layout
+*.bim_*.settings
+*.rptproj.rsuser
+*- [Bb]ackup.rdl
+*- [Bb]ackup ([0-9]).rdl
+*- [Bb]ackup ([0-9][0-9]).rdl
+
+# Microsoft Fakes
+FakesAssemblies/
+
+# GhostDoc plugin setting file
+*.GhostDoc.xml
+
+# Node.js Tools for Visual Studio
+.ntvs_analysis.dat
+node_modules/
+
+# Visual Studio 6 build log
+*.plg
+
+# Visual Studio 6 workspace options file
+*.opt
+
+# Visual Studio 6 auto-generated workspace file (contains which files were open etc.)
+*.vbw
+
+# Visual Studio 6 auto-generated project file (contains which files were open etc.)
+*.vbp
+
+# Visual Studio 6 workspace and project file (working project files containing files to include in project)
+*.dsw
+*.dsp
+
+# Visual Studio 6 technical files
+
+# Visual Studio LightSwitch build output
+**/*.HTMLClient/GeneratedArtifacts
+**/*.DesktopClient/GeneratedArtifacts
+**/*.DesktopClient/ModelManifest.xml
+**/*.Server/GeneratedArtifacts
+**/*.Server/ModelManifest.xml
+_Pvt_Extensions
+
+# Paket dependency manager
+.paket/paket.exe
+paket-files/
+
+# FAKE - F# Make
+.fake/
+
+# CodeRush personal settings
+.cr/personal
+
+# Python Tools for Visual Studio (PTVS)
+__pycache__/
+*.pyc
+
+# Cake - Uncomment if you are using it
+# tools/**
+# !tools/packages.config
+
+# Tabs Studio
+*.tss
+
+# Telerik's JustMock configuration file
+*.jmconfig
+
+# BizTalk build output
+*.btp.cs
+*.btm.cs
+*.odx.cs
+*.xsd.cs
+
+# OpenCover UI analysis results
+OpenCover/
+
+# Azure Stream Analytics local run output
+ASALocalRun/
+
+# MSBuild Binary and Structured Log
+*.binlog
+
+# NVidia Nsight GPU debugger configuration file
+*.nvuser
+
+# MFractors (Xamarin productivity tool) working folder
+.mfractor/
+
+# Local History for Visual Studio
+.localhistory/
+
+# Visual Studio History (VSHistory) files
+.vshistory/
+
+# BeatPulse healthcheck temp database
+healthchecksdb
+
+# Backup folder for Package Reference Convert tool in Visual Studio 2017
+MigrationBackup/
+
+# Ionide (cross platform F# VS Code tools) working folder
+.ionide/
+
+# Fody - auto-generated XML schema
+FodyWeavers.xsd
+
+# VS Code files for those working on multiple tools
+*.code-workspace
+
+# Local History for Visual Studio Code
+
+# Windows Installer files from build outputs
+*.cab
+*.msi
+*.msix
+*.msm
+*.msp
+
+# JetBrains Rider
+*.sln.iml
+
+### VisualStudio Patch ###
+# Additional files built by Visual Studio
+
+# End of https://www.toptal.com/developers/gitignore/api/dotnetcore,visualstudio,visualstudiocode
--- a/BlazorApp1/.DS_Store
+++ b/BlazorApp1/.DS_Store
--- a/BlazorApp1/BlazorApp1.Client/BlazorApp1.Client.csproj
+++ b/BlazorApp1/BlazorApp1.Client/BlazorApp1.Client.csproj
@ -0,0 +1,15 @@
+<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
+
+  <PropertyGroup>
+    <TargetFramework>net8.0</TargetFramework>
+    <ImplicitUsings>enable</ImplicitUsings>
+    <Nullable>enable</Nullable>
+    <NoDefaultLaunchSettingsFile>true</NoDefaultLaunchSettingsFile>
+    <StaticWebAssetProjectMode>Default</StaticWebAssetProjectMode>
+  </PropertyGroup>
+
+  <ItemGroup>
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="8.0.5" />
+  </ItemGroup>
+
+</Project>
--- a/BlazorApp1/BlazorApp1.Client/Pages/Counter.razor
+++ b/BlazorApp1/BlazorApp1.Client/Pages/Counter.razor
@ -0,0 +1,19 @@
+@page "/counter"
+@rendermode InteractiveAuto
+
+<PageTitle>Counter</PageTitle>
+
+<h1>Counter</h1>
+
+<p role="status">Current count: @currentCount</p>
+
+<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
+
+@code {
+    private int currentCount = 0;
+
+    private void IncrementCount()
+    {
+        currentCount++;
+    }
+}
--- a/BlazorApp1/BlazorApp1.Client/Program.cs
+++ b/BlazorApp1/BlazorApp1.Client/Program.cs
@ -0,0 +1,5 @@
+using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
+
+var builder = WebAssemblyHostBuilder.CreateDefault(args);
+
+await builder.Build().RunAsync();
--- a/BlazorApp1/BlazorApp1.Client/_Imports.razor
+++ b/BlazorApp1/BlazorApp1.Client/_Imports.razor
@ -0,0 +1,9 @@
+@using System.Net.Http
+@using System.Net.Http.Json
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.AspNetCore.Components.Web
+@using static Microsoft.AspNetCore.Components.Web.RenderMode
+@using Microsoft.AspNetCore.Components.Web.Virtualization
+@using Microsoft.JSInterop
+@using BlazorApp1.Client
--- a/BlazorApp1/BlazorApp1.Client/wwwroot/appsettings.Development.json
+++ b/BlazorApp1/BlazorApp1.Client/wwwroot/appsettings.Development.json
@ -0,0 +1,8 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  }
+}
--- a/BlazorApp1/BlazorApp1.Client/wwwroot/appsettings.json
+++ b/BlazorApp1/BlazorApp1.Client/wwwroot/appsettings.json
@ -0,0 +1,8 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  }
+}
--- a/BlazorApp1/BlazorApp1/BlazorApp1.csproj
+++ b/BlazorApp1/BlazorApp1/BlazorApp1.csproj
@ -0,0 +1,24 @@
+<Project Sdk="Microsoft.NET.Sdk.Web">
+
+  <PropertyGroup>
+    <TargetFramework>net8.0</TargetFramework>
+    <Nullable>enable</Nullable>
+    <ImplicitUsings>enable</ImplicitUsings>
+  </PropertyGroup>
+
+  <ItemGroup>
+    <ProjectReference Include="..\BlazorApp1.Client\BlazorApp1.Client.csproj" />
+    <PackageReference Include="Blazored.LocalStorage" Version="4.5.0" />
+    <PackageReference Include="Blazored.Modal" Version="7.3.1" />
+    <PackageReference Include="Blazorise.Bootstrap" Version="1.7.0" />
+    <PackageReference Include="Blazorise.DataGrid" Version="1.7.0" />
+    <PackageReference Include="Blazorise.Icons.FontAwesome" Version="1.7.0" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="8.0.5" />
+    <PackageReference Include="Microsoft.Extensions.Localization" Version="9.0.0" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <Folder Include="wwwroot\images\" />
+  </ItemGroup>
+
+</Project>
--- a/BlazorApp1/BlazorApp1/Components/App.razor
+++ b/BlazorApp1/BlazorApp1/Components/App.razor
@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <base href="/" />
+    <link rel="stylesheet" href="bootstrap/bootstrap.min.css" />
+    <link rel="stylesheet" href="app.css" />
+    <link rel="stylesheet" href="BlazorApp1.styles.css" />
+    <link rel="icon" type="image/png" href="favicon.png" />
+    <HeadOutlet />
+</head>
+
+<body>
+    <Routes @rendermode="InteractiveServer"/>
+    <script src="_framework/blazor.web.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 href="_content/Blazorise/blazorise.css" rel="stylesheet" />
+    <link href="_content/Blazorise.Bootstrap/blazorise.bootstrap.css" rel="stylesheet" />
+    <link href="_content/Blazored.Modal/blazored-modal.css" rel="stylesheet" />
+</body>
+
+</html>
--- a/BlazorApp1/BlazorApp1/Components/Card.razor
+++ b/BlazorApp1/BlazorApp1/Components/Card.razor
@ -0,0 +1,6 @@
+@typeparam TItem
+<div class="card text-center">
+    @CardHeader(Item)
+    @CardBody(Item)
+    @CardFooter
+</div>
--- a/BlazorApp1/BlazorApp1/Components/Card.razor.cs
+++ b/BlazorApp1/BlazorApp1/Components/Card.razor.cs
@ -0,0 +1,18 @@
+using Microsoft.AspNetCore.Components;
+
+namespace BlazorApp1.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; }
+}
--- a/BlazorApp1/BlazorApp1/Components/Crafting.razor
+++ b/BlazorApp1/BlazorApp1/Components/Crafting.razor
@ -0,0 +1,51 @@
+<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>
--- a/BlazorApp1/BlazorApp1/Components/Crafting.razor.cs
+++ b/BlazorApp1/BlazorApp1/Components/Crafting.razor.cs
@ -0,0 +1,79 @@
+using BlazorApp1.Models;
+using Microsoft.AspNetCore.Components;
+using Microsoft.JSInterop;
+using System.Collections.ObjectModel;
+using System.Collections.Specialized;
+
+namespace BlazorApp1.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);
+    }
+}
--- a/BlazorApp1/BlazorApp1/Components/Crafting.razor.css
+++ b/BlazorApp1/BlazorApp1/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;
+}
--- a/BlazorApp1/BlazorApp1/Components/Crafting.razor.js
+++ b/BlazorApp1/BlazorApp1/Components/Crafting.razor.js
@ -0,0 +1,16 @@
+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);
+        });
+    }
+}
--- a/BlazorApp1/BlazorApp1/Components/CraftingAction.cs
+++ b/BlazorApp1/BlazorApp1/Components/CraftingAction.cs
@ -0,0 +1,10 @@
+using BlazorApp1.Models;
+
+namespace BlazorApp1.Components;
+
+public class CraftingAction
+{
+    public string Action { get; set; }
+    public int Index { get; set; }
+    public Item Item { get; set; }
+}
--- a/BlazorApp1/BlazorApp1/Components/CraftingItem.razor
+++ b/BlazorApp1/BlazorApp1/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>
--- a/BlazorApp1/BlazorApp1/Components/CraftingItem.razor.cs
+++ b/BlazorApp1/BlazorApp1/Components/CraftingItem.razor.cs
@ -0,0 +1,63 @@
+using BlazorApp1.Models;
+using Blazorise;
+using Microsoft.AspNetCore.Components;
+
+namespace BlazorApp1.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 });
+    }
+}
--- a/BlazorApp1/BlazorApp1/Components/CraftingItem.razor.css
+++ b/BlazorApp1/BlazorApp1/Components/CraftingItem.razor.css
@ -0,0 +1,6 @@
+.item {
+    width: 64px;
+    height: 64px;
+    border: 1px solid;
+    overflow: hidden;
+}
--- a/BlazorApp1/BlazorApp1/Components/CraftingRecipe.cs
+++ b/BlazorApp1/BlazorApp1/Components/CraftingRecipe.cs
@ -0,0 +1,9 @@
+using BlazorApp1.Models;
+
+namespace BlazorApp1.Components;
+
+public class CraftingRecipe
+{
+    public Item Give { get; set; }
+    public List<List<string>> Have { get; set; }
+}
--- a/BlazorApp1/BlazorApp1/Components/CultureSelector.razor
+++ b/BlazorApp1/BlazorApp1/Components/CultureSelector.razor
@ -0,0 +1,44 @@
+@using System.Globalization
+@inject NavigationManager NavigationManager
+@rendermode InteractiveServer
+
+<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);
+        }
+    }
+}
--- a/BlazorApp1/BlazorApp1/Components/Layout/MainLayout.razor
+++ b/BlazorApp1/BlazorApp1/Components/Layout/MainLayout.razor
@ -0,0 +1,28 @@
+@inherits LayoutComponentBase
+@rendermode InteractiveServer
+@using BlazorApp1.Components
+
+<div class="page">
+    <div class="sidebar">
+        <NavMenu />
+    </div>
+
+    <main>
+        <div class="top-row px-4">
+            <a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
+            <div class="px-4">
+                <CultureSelector />
+            </div>
+        </div>
+
+        <article class="content px-4">
+            @Body
+        </article>
+    </main>
+</div>
+
+<div id="blazor-error-ui">
+    An unhandled error has occurred.
+    <a href="" class="reload">Reload</a>
+    <a class="dismiss">🗙</a>
+</div>
--- a/BlazorApp1/BlazorApp1/Components/Layout/MainLayout.razor.css
+++ b/BlazorApp1/BlazorApp1/Components/Layout/MainLayout.razor.css
@ -0,0 +1,96 @@
+.page {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+}
+
+main {
+    flex: 1;
+}
+
+.sidebar {
+    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
+}
+
+.top-row {
+    background-color: #f7f7f7;
+    border-bottom: 1px solid #d6d5d5;
+    justify-content: flex-end;
+    height: 3.5rem;
+    display: flex;
+    align-items: center;
+}
+
+    .top-row ::deep a, .top-row ::deep .btn-link {
+        white-space: nowrap;
+        margin-left: 1.5rem;
+        text-decoration: none;
+    }
+
+    .top-row ::deep a:hover, .top-row ::deep .btn-link:hover {
+        text-decoration: underline;
+    }
+
+    .top-row ::deep a:first-child {
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+@media (max-width: 640.98px) {
+    .top-row {
+        justify-content: space-between;
+    }
+
+    .top-row ::deep a, .top-row ::deep .btn-link {
+        margin-left: 0;
+    }
+}
+
+@media (min-width: 641px) {
+    .page {
+        flex-direction: row;
+    }
+
+    .sidebar {
+        width: 250px;
+        height: 100vh;
+        position: sticky;
+        top: 0;
+    }
+
+    .top-row {
+        position: sticky;
+        top: 0;
+        z-index: 1;
+    }
+
+    .top-row.auth ::deep a:first-child {
+        flex: 1;
+        text-align: right;
+        width: 0;
+    }
+
+    .top-row, article {
+        padding-left: 2rem !important;
+        padding-right: 1.5rem !important;
+    }
+}
+
+#blazor-error-ui {
+    background: lightyellow;
+    bottom: 0;
+    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
+    display: none;
+    left: 0;
+    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
+    position: fixed;
+    width: 100%;
+    z-index: 1000;
+}
+
+    #blazor-error-ui .dismiss {
+        cursor: pointer;
+        position: absolute;
+        right: 0.75rem;
+        top: 0.5rem;
+    }
--- a/BlazorApp1/BlazorApp1/Components/Layout/NavMenu.razor
+++ b/BlazorApp1/BlazorApp1/Components/Layout/NavMenu.razor
@ -0,0 +1,35 @@
+<div class="top-row ps-3 navbar navbar-dark">
+    <div class="container-fluid">
+        <a class="navbar-brand" href="">BlazorApp</a>
+    </div>
+</div>
+
+<input type="checkbox" title="Navigation menu" class="navbar-toggler" />
+
+<div class="nav-scrollable" onclick="document.querySelector('.navbar-toggler').click()">
+    <nav class="flex-column">
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="list" Match="NavLinkMatch.All">
+                <span class="oi oi-list-rich" aria-hidden="true"></span> List
+            </NavLink>
+        </div>
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="" Match="NavLinkMatch.All">
+                <span class="bi bi-house-door-fill-nav-menu" aria-hidden="true"></span> Home
+            </NavLink>
+        </div>
+
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="counter">
+                <span class="bi bi-plus-square-fill-nav-menu" aria-hidden="true"></span> Counter
+            </NavLink>
+        </div>
+
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="weather">
+                <span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> Weather
+            </NavLink>
+        </div>
+    </nav>
+</div>
+
--- a/BlazorApp1/BlazorApp1/Components/Layout/NavMenu.razor.css
+++ b/BlazorApp1/BlazorApp1/Components/Layout/NavMenu.razor.css
@ -0,0 +1,105 @@
+.navbar-toggler {
+    appearance: none;
+    cursor: pointer;
+    width: 3.5rem;
+    height: 2.5rem;
+    color: white;
+    position: absolute;
+    top: 0.5rem;
+    right: 1rem;
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
+}
+
+.navbar-toggler:checked {
+    background-color: rgba(255, 255, 255, 0.5);
+}
+
+.top-row {
+    height: 3.5rem;
+    background-color: rgba(0,0,0,0.4);
+}
+
+.navbar-brand {
+    font-size: 1.1rem;
+}
+
+.bi {
+    display: inline-block;
+    position: relative;
+    width: 1.25rem;
+    height: 1.25rem;
+    margin-right: 0.75rem;
+    top: -1px;
+    background-size: cover;
+}
+
+.bi-house-door-fill-nav-menu {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
+}
+
+.bi-plus-square-fill-nav-menu {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
+}
+
+.bi-list-nested-nav-menu {
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
+}
+
+.nav-item {
+    font-size: 0.9rem;
+    padding-bottom: 0.5rem;
+}
+
+    .nav-item:first-of-type {
+        padding-top: 1rem;
+    }
+
+    .nav-item:last-of-type {
+        padding-bottom: 1rem;
+    }
+
+    .nav-item ::deep .nav-link {
+        color: #d7d7d7;
+        background: none;
+        border: none;
+        border-radius: 4px;
+        height: 3rem;
+        display: flex;
+        align-items: center;
+        line-height: 3rem;
+        width: 100%;
+    }
+
+.nav-item ::deep a.active {
+    background-color: rgba(255,255,255,0.37);
+    color: white;
+}
+
+.nav-item ::deep .nav-link:hover {
+    background-color: rgba(255,255,255,0.1);
+    color: white;
+}
+
+.nav-scrollable {
+    display: none;
+}
+
+.navbar-toggler:checked ~ .nav-scrollable {
+    display: block;
+}
+
+@media (min-width: 641px) {
+    .navbar-toggler {
+        display: none;
+    }
+
+    .nav-scrollable {
+        /* Never collapse the sidebar for wide screens */
+        display: block;
+
+        /* Allow sidebar to scroll for tall menus */
+        height: calc(100vh - 3.5rem);
+        overflow-y: auto;
+    }
+}
--- a/BlazorApp1/BlazorApp1/Components/Pages/Add.razor
+++ b/BlazorApp1/BlazorApp1/Components/Pages/Add.razor
@ -0,0 +1,70 @@
+@page "/add"
+@rendermode InteractiveServer
+
+<h3>Add</h3>
+
+<EditForm Model="@itemModel" OnValidSubmit="@HandleValidSubmit" FormName="addForm">
+    <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>
--- a/BlazorApp1/BlazorApp1/Components/Pages/Add.razor.cs
+++ b/BlazorApp1/BlazorApp1/Components/Pages/Add.razor.cs
@ -0,0 +1,88 @@
+using BlazorApp1.Models;
+using Blazored.LocalStorage;
+using Microsoft.AspNetCore.Components.Forms;
+using Microsoft.AspNetCore.Components;
+using BlazorApp1.Services;
+
+namespace BlazorApp1.Components.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);
+        }
+    }
+}
--- a/BlazorApp1/BlazorApp1/Components/Pages/Edit.razor
+++ b/BlazorApp1/BlazorApp1/Components/Pages/Edit.razor
@ -0,0 +1,83 @@
+@page "/edit/{Id:int}"
+@rendermode InteractiveServer
+
+<h3>Edit</h3>
+
+<EditForm Model="@itemModel" OnValidSubmit="@HandleValidSubmit" FormName="editForm">
+    <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>
--- a/BlazorApp1/BlazorApp1/Components/Pages/Edit.razor.cs
+++ b/BlazorApp1/BlazorApp1/Components/Pages/Edit.razor.cs
@ -0,0 +1,117 @@
+using BlazorApp1.Factories;
+using BlazorApp1.Models;
+using BlazorApp1.Services;
+using Microsoft.AspNetCore.Components;
+using Microsoft.AspNetCore.Components.Forms;
+
+namespace BlazorApp1.Components.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 OnAfterRenderAsync (bool firstRender)
+    {
+        if(firstRender)
+        {
+            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);
+
+        }
+
+        await base.OnAfterRenderAsync(firstRender);
+
+        return;
+    }
+
+    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);
+        }
+    }
+}
--- a/BlazorApp1/BlazorApp1/Components/Pages/Error.razor
+++ b/BlazorApp1/BlazorApp1/Components/Pages/Error.razor
@ -0,0 +1,36 @@
+@page "/Error"
+@using System.Diagnostics
+
+<PageTitle>Error</PageTitle>
+
+<h1 class="text-danger">Error.</h1>
+<h2 class="text-danger">An error occurred while processing your request.</h2>
+
+@if (ShowRequestId)
+{
+    <p>
+        <strong>Request ID:</strong> <code>@RequestId</code>
+    </p>
+}
+
+<h3>Development Mode</h3>
+<p>
+    Swapping to <strong>Development</strong> environment will display more detailed information about the error that occurred.
+</p>
+<p>
+    <strong>The Development environment shouldn't be enabled for deployed applications.</strong>
+    It can result in displaying sensitive information from exceptions to end users.
+    For local debugging, enable the <strong>Development</strong> environment by setting the <strong>ASPNETCORE_ENVIRONMENT</strong> environment variable to <strong>Development</strong>
+    and restarting the app.
+</p>
+
+@code{
+    [CascadingParameter]
+    private HttpContext? HttpContext { get; set; }
+
+    private string? RequestId { get; set; }
+    private bool ShowRequestId => !string.IsNullOrEmpty(RequestId);
+
+    protected override void OnInitialized() =>
+        RequestId = Activity.Current?.Id ?? HttpContext?.TraceIdentifier;
+}
--- a/BlazorApp1/BlazorApp1/Components/Pages/Home.razor
+++ b/BlazorApp1/BlazorApp1/Components/Pages/Home.razor
@ -0,0 +1,17 @@
+@page "/"
+@rendermode InteractiveServer
+@using System.Globalization
+
+<PageTitle>Home</PageTitle>
+
+<p>
+    <b>CurrentCulture</b>: @CultureInfo.CurrentCulture
+</p>
+
+<h1>Hello, world!</h1>
+
+Welcome to your new app.
+
+<div>
+    <Crafting Items="Items" Recipes="Recipes" />
+</div>
--- a/BlazorApp1/BlazorApp1/Components/Pages/Home.razor.cs
+++ b/BlazorApp1/BlazorApp1/Components/Pages/Home.razor.cs
@ -0,0 +1,30 @@
+using BlazorApp1.Models;
+using BlazorApp1.Services;
+using Microsoft.AspNetCore.Components;
+
+namespace BlazorApp1.Components.Pages;
+
+public partial class Home
+{
+    [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();
+    }
+}
--- a/BlazorApp1/BlazorApp1/Components/Pages/List.razor
+++ b/BlazorApp1/BlazorApp1/Components/Pages/List.razor
@ -0,0 +1,54 @@
+@page "/list"
+@rendermode InteractiveServer
+
+
+<h3>@Localizer["Title"]</h3>
+
+<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 (File.Exists($"{WebHostEnvironment.WebRootPath}/images/{context.Name}.png"))
+            {
+                <img src="images/@(context.Name).png" class="img-thumbnail" title="@context.DisplayName" alt="@context.DisplayName" style="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=@Localizer["DisplayName"] />
+    <DataGridColumn TItem="Item" Field="@nameof(Item.StackSize)" Caption=@Localizer["StackSize"] />
+    <DataGridColumn TItem="Item" Field="@nameof(Item.MaxDurability)" Caption=@Localizer["MaxDur"] />
+    <DataGridColumn TItem="Item" Field="@nameof(Item.EnchantCategories)" Caption=@Localizer["EnchantCat"]>
+        <DisplayTemplate>
+            @(string.Join(", ", ((Item)context).EnchantCategories))
+        </DisplayTemplate>
+    </DataGridColumn>
+    <DataGridColumn TItem="Item" Field="@nameof(Item.RepairWith)" Caption=@Localizer["Repair"]>
+        <DisplayTemplate>
+            @(string.Join(", ", ((Item)context).RepairWith))
+        </DisplayTemplate>
+    </DataGridColumn>
+    <DataGridColumn TItem="Item" Field="@nameof(Item.CreatedDate)" Caption=@Localizer["CreaDate"] 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> @Localizer["EditButton"]</a>
+            <button type="button" class="btn btn-primary" @onclick="() => OnDelete(context.Id)"><i class="fa fa-trash"></i> @Localizer["DeleteButton"]</button>
+        </DisplayTemplate>
+    </DataGridColumn>
+</DataGrid>
--- a/BlazorApp1/BlazorApp1/Components/Pages/List.razor.cs
+++ b/BlazorApp1/BlazorApp1/Components/Pages/List.razor.cs
@ -0,0 +1,65 @@
+using BlazorApp1.Modals;
+using BlazorApp1.Models;
+using BlazorApp1.Services;
+using Blazored.Modal;
+using Blazored.Modal.Services;
+using Blazorise.DataGrid;
+using Microsoft.AspNetCore.Components;
+using Microsoft.Extensions.Localization;
+
+namespace BlazorApp1.Components.Pages;
+
+public partial class List
+{
+    private List<Item> items;
+
+    private int totalItem;
+
+    [Inject]
+    public IStringLocalizer<List> Localizer { get; set; }
+
+    [Inject]
+    public IDataService DataService { get; set; }
+
+    [Inject]
+    public NavigationManager NavigationManager { get; set; }
+
+    [CascadingParameter]
+    public IModalService Modal { get; set; } = default;
+
+    [Inject]
+    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);
+    }
+}
--- a/BlazorApp1/BlazorApp1/Components/Pages/ShowItems.razor
+++ b/BlazorApp1/BlazorApp1/Components/Pages/ShowItems.razor
@ -0,0 +1,12 @@
+@typeparam TItem
+
+<div>
+    @if ((Items?.Count ?? 0) != 0)
+    {
+        @foreach (var item in Items)
+        {
+            @ShowTemplate(item)
+            ;
+        }
+    }
+</div>
--- a/BlazorApp1/BlazorApp1/Components/Pages/ShowItems.razor.cs
+++ b/BlazorApp1/BlazorApp1/Components/Pages/ShowItems.razor.cs
@ -0,0 +1,12 @@
+using Microsoft.AspNetCore.Components;
+
+namespace BlazorApp1.Components.Pages;
+
+public partial class ShowItems<TItem>
+{
+    [Parameter]
+    public List<TItem> Items { get; set; }
+
+    [Parameter]
+    public RenderFragment<TItem> ShowTemplate { get; set; }
+}
--- a/BlazorApp1/BlazorApp1/Components/Pages/Weather.razor
+++ b/BlazorApp1/BlazorApp1/Components/Pages/Weather.razor
@ -0,0 +1,64 @@
+@page "/weather"
+@attribute [StreamRendering]
+
+<PageTitle>Weather</PageTitle>
+
+<h1>Weather</h1>
+
+<p>This component demonstrates showing data.</p>
+
+@if (forecasts == null)
+{
+    <p><em>Loading...</em></p>
+}
+else
+{
+    <table class="table">
+        <thead>
+            <tr>
+                <th>Date</th>
+                <th>Temp. (C)</th>
+                <th>Temp. (F)</th>
+                <th>Summary</th>
+            </tr>
+        </thead>
+        <tbody>
+            @foreach (var forecast in forecasts)
+            {
+                <tr>
+                    <td>@forecast.Date.ToShortDateString()</td>
+                    <td>@forecast.TemperatureC</td>
+                    <td>@forecast.TemperatureF</td>
+                    <td>@forecast.Summary</td>
+                </tr>
+            }
+        </tbody>
+    </table>
+}
+
+@code {
+    private WeatherForecast[]? forecasts;
+
+    protected override async Task OnInitializedAsync()
+    {
+        // Simulate asynchronous loading to demonstrate streaming rendering
+        await Task.Delay(500);
+
+        var startDate = DateOnly.FromDateTime(DateTime.Now);
+        var summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" };
+        forecasts = Enumerable.Range(1, 5).Select(index => new WeatherForecast
+        {
+            Date = startDate.AddDays(index),
+            TemperatureC = Random.Shared.Next(-20, 55),
+            Summary = summaries[Random.Shared.Next(summaries.Length)]
+        }).ToArray();
+    }
+
+    private class WeatherForecast
+    {
+        public DateOnly Date { get; set; }
+        public int TemperatureC { get; set; }
+        public string? Summary { get; set; }
+        public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
+    }
+}
--- a/BlazorApp1/BlazorApp1/Components/Routes.razor
+++ b/BlazorApp1/BlazorApp1/Components/Routes.razor
@ -0,0 +1,11 @@
+<CascadingBlazoredModal>
+    <Router AppAssembly="typeof(Program).Assembly" AdditionalAssemblies="new[] { typeof(Client._Imports).Assembly }">
+        <Found Context="routeData">
+            <RouteView RouteData="routeData" DefaultLayout="typeof(Layout.MainLayout)" />
+            <FocusOnNavigate RouteData="routeData" Selector="h1" />
+        </Found>
+        <NotFound>
+            <p>Sorry, there's nothing at this address.</p>
+        </NotFound>
+    </Router>
+</CascadingBlazoredModal>
--- a/BlazorApp1/BlazorApp1/Components/_Imports.razor
+++ b/BlazorApp1/BlazorApp1/Components/_Imports.razor
@ -0,0 +1,17 @@
+@using System.Net.Http
+@using System.Net.Http.Json
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.AspNetCore.Components.Web
+@using static Microsoft.AspNetCore.Components.Web.RenderMode
+@using Microsoft.AspNetCore.Components.Web.Virtualization
+@using Microsoft.JSInterop
+@using BlazorApp1
+@using BlazorApp1.Client
+@using BlazorApp1.Components
+@using Blazorise.DataGrid
+@using Blazorise.Bootstrap
+@using Blazorise.Icons.FontAwesome
+@using BlazorApp1.Models
+@using Blazored.Modal
+@using Blazored.Modal.Services
--- a/BlazorApp1/BlazorApp1/Controllers/CultureController.cs
+++ b/BlazorApp1/BlazorApp1/Controllers/CultureController.cs
@ -0,0 +1,33 @@
+namespace BlazorApp1.Controllers;
+
+using Microsoft.AspNetCore.Localization;
+using Microsoft.AspNetCore.Mvc;
+
+/// <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);
+    }
+}
--- a/BlazorApp1/BlazorApp1/Factories/ItemFactory.cs
+++ b/BlazorApp1/BlazorApp1/Factories/ItemFactory.cs
@ -0,0 +1,47 @@
+using BlazorApp1.Models;
+
+namespace BlazorApp1.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
+        };
+    }
+
+    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;
+    }
+}
--- a/BlazorApp1/BlazorApp1/Modals/DeleteConfirmation.razor
+++ b/BlazorApp1/BlazorApp1/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>
--- a/BlazorApp1/BlazorApp1/Modals/DeleteConfirmation.razor.cs
+++ b/BlazorApp1/BlazorApp1/Modals/DeleteConfirmation.razor.cs
@ -0,0 +1,37 @@
+using BlazorApp1.Models;
+using BlazorApp1.Services;
+using Blazored.Modal.Services;
+using Blazored.Modal;
+using Microsoft.AspNetCore.Components;
+
+namespace BlazorApp1.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();
+    }
+}
--- a/BlazorApp1/BlazorApp1/Models/Cake.cs
+++ b/BlazorApp1/BlazorApp1/Models/Cake.cs
@ -0,0 +1,8 @@
+namespace BlazorApp1.Models;
+
+public class Cake
+{
+    public int Id { get; set; }
+    public string Name { get; set; }
+    public decimal Cost { get; set; }
+}
--- a/BlazorApp1/BlazorApp1/Models/Item.cs
+++ b/BlazorApp1/BlazorApp1/Models/Item.cs
@ -0,0 +1,14 @@
+namespace BlazorApp1.Models;
+
+public class Item
+{
+    public int Id { get; set; }
+    public string DisplayName { get; set; }
+    public string Name { get; set; }
+    public int StackSize { get; set; }
+    public int MaxDurability { get; set; }
+    public List<string> EnchantCategories { get; set; }
+    public List<string> RepairWith { get; set; }
+    public DateTime CreatedDate { get; set; }
+    public DateTime? UpdatedDate { get; set; }
+}
--- a/BlazorApp1/BlazorApp1/Models/ItemModel.cs
+++ b/BlazorApp1/BlazorApp1/Models/ItemModel.cs
@ -0,0 +1,36 @@
+using System.ComponentModel.DataAnnotations;
+
+namespace BlazorApp1.Models;
+
+public class ItemModel
+{
+    public int Id { get; set; }
+
+    [Required]
+    [StringLength(50, ErrorMessage = "Le nom affiché ne doit pas dépasser 50 caractères.")]
+    public string DisplayName { get; set; }
+
+    [Required]
+    [StringLength(50, ErrorMessage = "Le nom ne doit pas dépasser 50 caractères.")]
+    [RegularExpression(@"^[a-z''-'\s]{1,50}$", ErrorMessage = "Seulement les caractères en minuscule sont acceptées.")]
+    public string Name { get; set; }
+
+    [Required]
+    [Range(1, 64)]
+    public int StackSize { get; set; }
+
+    [Required]
+    [Range(1, 125)]
+    public int MaxDurability { get; set; }
+
+    public List<string> EnchantCategories { get; set; }
+
+    public List<string> RepairWith { get; set; }
+
+    [Required]
+    [Range(typeof(bool), "true", "true", ErrorMessage = "Vous devez accepter les conditions.")]
+    public bool AcceptCondition { get; set; }
+
+    [Required(ErrorMessage = "L'image de l'item est obligatoire !")]
+    public byte[] ImageContent { get; set; }
+}
--- a/BlazorApp1/BlazorApp1/Program.cs
+++ b/BlazorApp1/BlazorApp1/Program.cs
@ -0,0 +1,91 @@
+using BlazorApp1.Client.Pages;
+using BlazorApp1.Components;
+using BlazorApp1.Services;
+using Blazored.LocalStorage;
+using Blazorise;
+using Blazorise.Bootstrap;
+using Blazorise.Icons.FontAwesome;
+using Blazored.Modal;
+using Microsoft.AspNetCore.Localization;
+using System.Globalization;
+using Microsoft.Extensions.Options;
+
+var builder = WebApplication.CreateBuilder(args);
+
+// Add services to the container.
+builder.Services.AddRazorComponents()
+    .AddInteractiveServerComponents()
+    .AddInteractiveWebAssemblyComponents();
+
+builder.Services.AddHttpClient();
+
+builder.Services
+   .AddBlazorise()
+   .AddBootstrapProviders() 
+   .AddFontAwesomeIcons();
+
+builder.Services.AddBlazoredLocalStorage();
+
+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") };
+});
+
+builder.Services.AddScoped<IDataService, DataLocalService>();
+
+var app = builder.Build();
+
+// Configure the HTTP request pipeline.
+if (app.Environment.IsDevelopment())
+{
+    app.UseWebAssemblyDebugging();
+}
+else
+{
+    app.UseExceptionHandler("/Error", createScopeForErrors: true);
+    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
+    app.UseHsts();
+}
+
+app.UseRouting();
+
+
+app.UseHttpsRedirection();
+
+app.UseStaticFiles();
+app.UseAntiforgery();
+
+app.MapRazorComponents<App>()
+    .AddInteractiveServerRenderMode()
+    .AddInteractiveWebAssemblyRenderMode()
+    .AddAdditionalAssemblies(typeof(BlazorApp1.Client._Imports).Assembly);
+
+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.Run();
--- a/BlazorApp1/BlazorApp1/Properties/launchSettings.json
+++ b/BlazorApp1/BlazorApp1/Properties/launchSettings.json
@ -0,0 +1,41 @@
+{
+  "$schema": "http://json.schemastore.org/launchsettings.json",
+    "iisSettings": {
+      "windowsAuthentication": false,
+      "anonymousAuthentication": true,
+      "iisExpress": {
+        "applicationUrl": "http://localhost:6891",
+        "sslPort": 44397
+      }
+    },
+    "profiles": {
+      "http": {
+        "commandName": "Project",
+        "dotnetRunMessages": true,
+        "launchBrowser": true,
+        "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
+        "applicationUrl": "http://localhost:5183",
+        "environmentVariables": {
+          "ASPNETCORE_ENVIRONMENT": "Development"
+        }
+      },
+      "https": {
+        "commandName": "Project",
+        "dotnetRunMessages": true,
+        "launchBrowser": true,
+        "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
+        "applicationUrl": "https://localhost:7123;http://localhost:5183",
+        "environmentVariables": {
+          "ASPNETCORE_ENVIRONMENT": "Development"
+        }
+      },
+      "IIS Express": {
+        "commandName": "IISExpress",
+        "launchBrowser": true,
+        "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
+        "environmentVariables": {
+          "ASPNETCORE_ENVIRONMENT": "Development"
+        }
+      }
+    }
+  }
--- a/BlazorApp1/BlazorApp1/Resources/Components.Pages.List.fr-FR.resx
+++ b/BlazorApp1/BlazorApp1/Resources/Components.Pages.List.fr-FR.resx
@ -0,0 +1,150 @@
+<?xml version="1.0" encoding="utf-8"?>
+<root>
+  <!-- 
+    Microsoft ResX Schema 
+    
+    Version 2.0
+    
+    The primary goals of this format is to allow a simple XML format 
+    that is mostly human readable. The generation and parsing of the 
+    various data types are done through the TypeConverter classes 
+    associated with the data types.
+    
+    Example:
+    
+    ... ado.net/XML headers & schema ...
+    <resheader name="resmimetype">text/microsoft-resx</resheader>
+    <resheader name="version">2.0</resheader>
+    <resheader name="reader">System.Resources.ResXResourceReader, System.Windows.Forms, ...</resheader>
+    <resheader name="writer">System.Resources.ResXResourceWriter, System.Windows.Forms, ...</resheader>
+    <data name="Name1"><value>this is my long string</value><comment>this is a comment</comment></data>
+    <data name="Color1" type="System.Drawing.Color, System.Drawing">Blue</data>
+    <data name="Bitmap1" mimetype="application/x-microsoft.net.object.binary.base64">
+        <value>[base64 mime encoded serialized .NET Framework object]</value>
+    </data>
+    <data name="Icon1" type="System.Drawing.Icon, System.Drawing" mimetype="application/x-microsoft.net.object.bytearray.base64">
+        <value>[base64 mime encoded string representing a byte array form of the .NET Framework object]</value>
+        <comment>This is a comment</comment>
+    </data>
+                
+    There are any number of "resheader" rows that contain simple 
+    name/value pairs.
+    
+    Each data row contains a name, and value. The row also contains a 
+    type or mimetype. Type corresponds to a .NET class that support 
+    text/value conversion through the TypeConverter architecture. 
+    Classes that don't support this are serialized and stored with the 
+    mimetype set.
+    
+    The mimetype is used for serialized objects, and tells the 
+    ResXResourceReader how to depersist the object. This is currently not 
+    extensible. For a given mimetype the value must be set accordingly:
+    
+    Note - application/x-microsoft.net.object.binary.base64 is the format 
+    that the ResXResourceWriter will generate, however the reader can 
+    read any of the formats listed below.
+    
+    mimetype: application/x-microsoft.net.object.binary.base64
+    value   : The object must be serialized with 
+            : System.Runtime.Serialization.Formatters.Binary.BinaryFormatter
+            : and then encoded with base64 encoding.
+    
+    mimetype: application/x-microsoft.net.object.soap.base64
+    value   : The object must be serialized with 
+            : System.Runtime.Serialization.Formatters.Soap.SoapFormatter
+            : and then encoded with base64 encoding.
+
+    mimetype: application/x-microsoft.net.object.bytearray.base64
+    value   : The object must be serialized into a byte array 
+            : using a System.ComponentModel.TypeConverter
+            : and then encoded with base64 encoding.
+    -->
+  <xsd:schema id="root" xmlns="" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
+    <xsd:import namespace="http://www.w3.org/XML/1998/namespace" />
+    <xsd:element name="root" msdata:IsDataSet="true">
+      <xsd:complexType>
+        <xsd:choice maxOccurs="unbounded">
+          <xsd:element name="metadata">
+            <xsd:complexType>
+              <xsd:sequence>
+                <xsd:element name="value" type="xsd:string" minOccurs="0" />
+              </xsd:sequence>
+              <xsd:attribute name="name" use="required" type="xsd:string" />
+              <xsd:attribute name="type" type="xsd:string" />
+              <xsd:attribute name="mimetype" type="xsd:string" />
+              <xsd:attribute ref="xml:space" />
+            </xsd:complexType>
+          </xsd:element>
+          <xsd:element name="assembly">
+            <xsd:complexType>
+              <xsd:attribute name="alias" type="xsd:string" />
+              <xsd:attribute name="name" type="xsd:string" />
+            </xsd:complexType>
+          </xsd:element>
+          <xsd:element name="data">
+            <xsd:complexType>
+              <xsd:sequence>
+                <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
+                <xsd:element name="comment" type="xsd:string" minOccurs="0" msdata:Ordinal="2" />
+              </xsd:sequence>
+              <xsd:attribute name="name" type="xsd:string" use="required" msdata:Ordinal="1" />
+              <xsd:attribute name="type" type="xsd:string" msdata:Ordinal="3" />
+              <xsd:attribute name="mimetype" type="xsd:string" msdata:Ordinal="4" />
+              <xsd:attribute ref="xml:space" />
+            </xsd:complexType>
+          </xsd:element>
+          <xsd:element name="resheader">
+            <xsd:complexType>
+              <xsd:sequence>
+                <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
+              </xsd:sequence>
+              <xsd:attribute name="name" type="xsd:string" use="required" />
+            </xsd:complexType>
+          </xsd:element>
+        </xsd:choice>
+      </xsd:complexType>
+    </xsd:element>
+  </xsd:schema>
+  <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>
+  <data name="AddButton" xml:space="preserve">
+    <value>Ajouter</value>
+  </data>
+  <data name="CreaDate" xml:space="preserve">
+    <value>Date de création</value>
+  </data>
+  <data name="DeleteButton" xml:space="preserve">
+    <value>Supprimer</value>
+  </data>
+  <data name="DisplayName" xml:space="preserve">
+    <value>Nom</value>
+  </data>
+  <data name="EditButton" xml:space="preserve">
+    <value>Éditer</value>
+  </data>
+  <data name="EnchantCat" xml:space="preserve">
+    <value>Catégories d'enchantement</value>
+  </data>
+  <data name="MaxDur" xml:space="preserve">
+    <value>Durabilité maximum</value>
+  </data>
+  <data name="Repair" xml:space="preserve">
+    <value>Réparé avec</value>
+  </data>
+  <data name="StackSize" xml:space="preserve">
+    <value>Taille de stack</value>
+  </data>
+  <data name="Title" xml:space="preserve">
+    <value>Liste des éléments</value>
+  </data>
+</root>
--- a/BlazorApp1/BlazorApp1/Resources/Components.Pages.List.resx
+++ b/BlazorApp1/BlazorApp1/Resources/Components.Pages.List.resx
@ -0,0 +1,150 @@
+<?xml version="1.0" encoding="utf-8"?>
+<root>
+  <!-- 
+    Microsoft ResX Schema 
+    
+    Version 2.0
+    
+    The primary goals of this format is to allow a simple XML format 
+    that is mostly human readable. The generation and parsing of the 
+    various data types are done through the TypeConverter classes 
+    associated with the data types.
+    
+    Example:
+    
+    ... ado.net/XML headers & schema ...
+    <resheader name="resmimetype">text/microsoft-resx</resheader>
+    <resheader name="version">2.0</resheader>
+    <resheader name="reader">System.Resources.ResXResourceReader, System.Windows.Forms, ...</resheader>
+    <resheader name="writer">System.Resources.ResXResourceWriter, System.Windows.Forms, ...</resheader>
+    <data name="Name1"><value>this is my long string</value><comment>this is a comment</comment></data>
+    <data name="Color1" type="System.Drawing.Color, System.Drawing">Blue</data>
+    <data name="Bitmap1" mimetype="application/x-microsoft.net.object.binary.base64">
+        <value>[base64 mime encoded serialized .NET Framework object]</value>
+    </data>
+    <data name="Icon1" type="System.Drawing.Icon, System.Drawing" mimetype="application/x-microsoft.net.object.bytearray.base64">
+        <value>[base64 mime encoded string representing a byte array form of the .NET Framework object]</value>
+        <comment>This is a comment</comment>
+    </data>
+                
+    There are any number of "resheader" rows that contain simple 
+    name/value pairs.
+    
+    Each data row contains a name, and value. The row also contains a 
+    type or mimetype. Type corresponds to a .NET class that support 
+    text/value conversion through the TypeConverter architecture. 
+    Classes that don't support this are serialized and stored with the 
+    mimetype set.
+    
+    The mimetype is used for serialized objects, and tells the 
+    ResXResourceReader how to depersist the object. This is currently not 
+    extensible. For a given mimetype the value must be set accordingly:
+    
+    Note - application/x-microsoft.net.object.binary.base64 is the format 
+    that the ResXResourceWriter will generate, however the reader can 
+    read any of the formats listed below.
+    
+    mimetype: application/x-microsoft.net.object.binary.base64
+    value   : The object must be serialized with 
+            : System.Runtime.Serialization.Formatters.Binary.BinaryFormatter
+            : and then encoded with base64 encoding.
+    
+    mimetype: application/x-microsoft.net.object.soap.base64
+    value   : The object must be serialized with 
+            : System.Runtime.Serialization.Formatters.Soap.SoapFormatter
+            : and then encoded with base64 encoding.
+
+    mimetype: application/x-microsoft.net.object.bytearray.base64
+    value   : The object must be serialized into a byte array 
+            : using a System.ComponentModel.TypeConverter
+            : and then encoded with base64 encoding.
+    -->
+  <xsd:schema id="root" xmlns="" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
+    <xsd:import namespace="http://www.w3.org/XML/1998/namespace" />
+    <xsd:element name="root" msdata:IsDataSet="true">
+      <xsd:complexType>
+        <xsd:choice maxOccurs="unbounded">
+          <xsd:element name="metadata">
+            <xsd:complexType>
+              <xsd:sequence>
+                <xsd:element name="value" type="xsd:string" minOccurs="0" />
+              </xsd:sequence>
+              <xsd:attribute name="name" use="required" type="xsd:string" />
+              <xsd:attribute name="type" type="xsd:string" />
+              <xsd:attribute name="mimetype" type="xsd:string" />
+              <xsd:attribute ref="xml:space" />
+            </xsd:complexType>
+          </xsd:element>
+          <xsd:element name="assembly">
+            <xsd:complexType>
+              <xsd:attribute name="alias" type="xsd:string" />
+              <xsd:attribute name="name" type="xsd:string" />
+            </xsd:complexType>
+          </xsd:element>
+          <xsd:element name="data">
+            <xsd:complexType>
+              <xsd:sequence>
+                <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
+                <xsd:element name="comment" type="xsd:string" minOccurs="0" msdata:Ordinal="2" />
+              </xsd:sequence>
+              <xsd:attribute name="name" type="xsd:string" use="required" msdata:Ordinal="1" />
+              <xsd:attribute name="type" type="xsd:string" msdata:Ordinal="3" />
+              <xsd:attribute name="mimetype" type="xsd:string" msdata:Ordinal="4" />
+              <xsd:attribute ref="xml:space" />
+            </xsd:complexType>
+          </xsd:element>
+          <xsd:element name="resheader">
+            <xsd:complexType>
+              <xsd:sequence>
+                <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
+              </xsd:sequence>
+              <xsd:attribute name="name" type="xsd:string" use="required" />
+            </xsd:complexType>
+          </xsd:element>
+        </xsd:choice>
+      </xsd:complexType>
+    </xsd:element>
+  </xsd:schema>
+  <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>
+  <data name="AddButton" xml:space="preserve">
+    <value>Add</value>
+  </data>
+  <data name="CreaDate" xml:space="preserve">
+    <value>Created Date</value>
+  </data>
+  <data name="DeleteButton" xml:space="preserve">
+    <value>Delete</value>
+  </data>
+  <data name="DisplayName" xml:space="preserve">
+    <value>Display Name</value>
+  </data>
+  <data name="EditButton" xml:space="preserve">
+    <value>Edit</value>
+  </data>
+  <data name="EnchantCat" xml:space="preserve">
+    <value>Enchant Categories</value>
+  </data>
+  <data name="MaxDur" xml:space="preserve">
+    <value>Maximum Durability</value>
+  </data>
+  <data name="Repair" xml:space="preserve">
+    <value>Repair With</value>
+  </data>
+  <data name="StackSize" xml:space="preserve">
+    <value>Stack Size</value>
+  </data>
+  <data name="Title" xml:space="preserve">
+    <value>Items List</value>
+  </data>
+</root>
--- a/BlazorApp1/BlazorApp1/Services/DataLocalService.cs
+++ b/BlazorApp1/BlazorApp1/Services/DataLocalService.cs
@ -0,0 +1,196 @@
+using BlazorApp1.Components;
+using BlazorApp1.Factories;
+using BlazorApp1.Models;
+using Blazored.LocalStorage;
+using Microsoft.AspNetCore.Components;
+
+namespace BlazorApp1.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 image
+        var imagePathInfo = new DirectoryInfo($"{_webHostEnvironment.WebRootPath}/images");
+
+        // Check if the folder "images" exist
+        if (!imagePathInfo.Exists)
+        {
+            imagePathInfo.Create();
+        }
+
+        // Determine the image name
+        var fileName = new FileInfo($"{imagePathInfo}/{model.Name}.png");
+
+        // Write the file content
+        await File.WriteAllBytesAsync(fileName.FullName, model.ImageContent);
+
+        // 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}");
+        }
+
+        // Save the image
+        var imagePathInfo = new DirectoryInfo($"{_webHostEnvironment.WebRootPath}/images");
+
+        // Check if the folder "images" exist
+        if (!imagePathInfo.Exists)
+        {
+            imagePathInfo.Create();
+        }
+
+        // Delete the previous image
+        if (item.Name != model.Name)
+        {
+            var oldFileName = new FileInfo($"{imagePathInfo}/{item.Name}.png");
+
+            if (oldFileName.Exists)
+            {
+                File.Delete(oldFileName.FullName);
+            }
+        }
+
+        // Determine the image name
+        var fileName = new FileInfo($"{imagePathInfo}/{model.Name}.png");
+
+        // Write the file content
+        await File.WriteAllBytesAsync(fileName.FullName, model.ImageContent);
+
+        // 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);
+
+        // 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);
+    }
+}
--- a/BlazorApp1/BlazorApp1/Services/IDataService.cs
+++ b/BlazorApp1/BlazorApp1/Services/IDataService.cs
@ -0,0 +1,21 @@
+using BlazorApp1.Components;
+using BlazorApp1.Models;
+
+namespace BlazorApp1.Services;
+
+public interface IDataService
+{
+    Task Add(ItemModel model);
+
+    Task<int> Count();
+
+    Task<List<Item>> List(int currentPage, int pageSize);
+
+    Task<Item> GetById(int id);
+
+    Task Update(int id, ItemModel model);
+
+    Task Delete(int id);
+
+    Task<List<CraftingRecipe>> GetRecipes();
+}
--- a/BlazorApp1/BlazorApp1/appsettings.Development.json
+++ b/BlazorApp1/BlazorApp1/appsettings.Development.json
@ -0,0 +1,8 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  }
+}
--- a/BlazorApp1/BlazorApp1/appsettings.json
+++ b/BlazorApp1/BlazorApp1/appsettings.json
@ -0,0 +1,9 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  },
+  "AllowedHosts": "*"
+}
--- a/BlazorApp1/BlazorApp1/wwwroot/app.css
+++ b/BlazorApp1/BlazorApp1/wwwroot/app.css
@ -0,0 +1,51 @@
+html, body {
+    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+}
+
+a, .btn-link {
+    color: #006bb7;
+}
+
+.btn-primary {
+    color: #fff;
+    background-color: #1b6ec2;
+    border-color: #1861ac;
+}
+
+.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
+  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
+}
+
+.content {
+    padding-top: 1.1rem;
+}
+
+h1:focus {
+    outline: none;
+}
+
+.valid.modified:not([type=checkbox]) {
+    outline: 1px solid #26b050;
+}
+
+.invalid {
+    outline: 1px solid #e50000;
+}
+
+.validation-message {
+    color: #e50000;
+}
+
+.blazor-error-boundary {
+    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
+    padding: 1rem 1rem 1rem 3.7rem;
+    color: white;
+}
+
+    .blazor-error-boundary::after {
+        content: "An error has occurred."
+    }
+
+.darker-border-checkbox.form-check-input {
+    border-color: #929292;
+}
--- a/BlazorApp1/BlazorApp1/wwwroot/bootstrap/bootstrap.min.css
+++ b/BlazorApp1/BlazorApp1/wwwroot/bootstrap/bootstrap.min.css
--- a/BlazorApp1/BlazorApp1/wwwroot/bootstrap/bootstrap.min.css.map
+++ b/BlazorApp1/BlazorApp1/wwwroot/bootstrap/bootstrap.min.css.map
--- a/BlazorApp1/BlazorApp1/wwwroot/fake-data.json
+++ b/BlazorApp1/BlazorApp1/wwwroot/fake-data.json
@ -0,0 +1,423 @@
+[
+  {
+    "id": 1,
+    "displayname": "Ezent",
+    "name": "ezent",
+    "stacksize": 29,
+    "maxdurability": 63,
+    "enchantcategories": [
+      "weapon",
+      "vanishable",
+      "digger"
+    ],
+    "repairwith": [
+      "dark_oak_planks"
+    ],
+    "createddate": "2018-05-24",
+    "updateddate": null
+  },
+  {
+    "id": 2,
+    "displayname": "Snorus",
+    "name": "snorus",
+    "stacksize": 9,
+    "maxdurability": 107,
+    "enchantcategories": [],
+    "repairwith": [
+      "oak_planks",
+      "acacia_planks"
+    ],
+    "createddate": "2022-07-16",
+    "updateddate": "2017-01-30"
+  },
+  {
+    "id": 3,
+    "displayname": "Equicom",
+    "name": "equicom",
+    "stacksize": 40,
+    "maxdurability": 120,
+    "enchantcategories": [
+      "armor",
+      "breakable",
+      "vanishable"
+    ],
+    "repairwith": [
+      "crimson_planks"
+    ],
+    "createddate": "2020-11-27",
+    "updateddate": "2021-03-25"
+  },
+  {
+    "id": 4,
+    "displayname": "Utara",
+    "name": "utara",
+    "stacksize": 1,
+    "maxdurability": 87,
+    "enchantcategories": [],
+    "repairwith": [
+      "jungle_planks"
+    ],
+    "createddate": "2023-11-07",
+    "updateddate": "2014-05-30"
+  },
+  {
+    "id": 5,
+    "displayname": "Applideck",
+    "name": "applideck",
+    "stacksize": 44,
+    "maxdurability": 73,
+    "enchantcategories": [
+      "armor_chest",
+      "armor_chest"
+    ],
+    "repairwith": [
+      "warped_planks",
+      "dark_oak_planks"
+    ],
+    "createddate": "2024-09-03",
+    "updateddate": "2023-04-06"
+  },
+  {
+    "id": 6,
+    "displayname": "Helixo",
+    "name": "helixo",
+    "stacksize": 24,
+    "maxdurability": 110,
+    "enchantcategories": [
+      "digger",
+      "digger"
+    ],
+    "repairwith": [
+      "dark_oak_planks",
+      "jungle_planks"
+    ],
+    "createddate": "2019-07-31",
+    "updateddate": null
+  },
+  {
+    "id": 7,
+    "displayname": "Biolive",
+    "name": "biolive",
+    "stacksize": 36,
+    "maxdurability": 16,
+    "enchantcategories": [
+      "weapon",
+      "breakable"
+    ],
+    "repairwith": [
+      "spruce_planks"
+    ],
+    "createddate": "2020-08-09",
+    "updateddate": null
+  },
+  {
+    "id": 8,
+    "displayname": "Neteria",
+    "name": "neteria",
+    "stacksize": 35,
+    "maxdurability": 6,
+    "enchantcategories": [
+      "breakable",
+      "weapon",
+      "breakable"
+    ],
+    "repairwith": [
+      "oak_planks"
+    ],
+    "createddate": "2021-06-02",
+    "updateddate": "2021-09-09"
+  },
+  {
+    "id": 9,
+    "displayname": "Isosure",
+    "name": "isosure",
+    "stacksize": 54,
+    "maxdurability": 4,
+    "enchantcategories": [
+      "armor_chest"
+    ],
+    "repairwith": [
+      "warped_planks",
+      "oak_planks"
+    ],
+    "createddate": "2018-06-15",
+    "updateddate": "2015-07-08"
+  },
+  {
+    "id": 10,
+    "displayname": "Xeronk",
+    "name": "xeronk",
+    "stacksize": 26,
+    "maxdurability": 118,
+    "enchantcategories": [
+      "armor_chest",
+      "armor_chest"
+    ],
+    "repairwith": [
+      "acacia_planks"
+    ],
+    "createddate": "2018-05-09",
+    "updateddate": "2021-08-12"
+  },
+  {
+    "id": 11,
+    "displayname": "Isoplex",
+    "name": "isoplex",
+    "stacksize": 4,
+    "maxdurability": 49,
+    "enchantcategories": [],
+    "repairwith": [
+      "acacia_planks",
+      "acacia_planks"
+    ],
+    "createddate": "2017-10-24",
+    "updateddate": null
+  },
+  {
+    "id": 12,
+    "displayname": "Fossiel",
+    "name": "fossiel",
+    "stacksize": 22,
+    "maxdurability": 10,
+    "enchantcategories": [
+      "armor_chest",
+      "armor_chest"
+    ],
+    "repairwith": [
+      "jungle_planks",
+      "spruce_planks"
+    ],
+    "createddate": "2020-06-02",
+    "updateddate": "2022-08-20"
+  },
+  {
+    "id": 13,
+    "displayname": "Duoflex",
+    "name": "duoflex",
+    "stacksize": 59,
+    "maxdurability": 86,
+    "enchantcategories": [
+      "weapon",
+      "digger"
+    ],
+    "repairwith": [
+      "dark_oak_planks",
+      "jungle_planks"
+    ],
+    "createddate": "2023-06-10",
+    "updateddate": "2023-05-06"
+  },
+  {
+    "id": 14,
+    "displayname": "Zorromop",
+    "name": "zorromop",
+    "stacksize": 34,
+    "maxdurability": 100,
+    "enchantcategories": [],
+    "repairwith": [
+      "acacia_planks",
+      "spruce_planks"
+    ],
+    "createddate": "2024-02-05",
+    "updateddate": null
+  },
+  {
+    "id": 15,
+    "displayname": "Nimon",
+    "name": "nimon",
+    "stacksize": 40,
+    "maxdurability": 17,
+    "enchantcategories": [
+      "breakable",
+      "breakable",
+      "armor"
+    ],
+    "repairwith": [],
+    "createddate": "2018-03-06",
+    "updateddate": "2022-04-15"
+  },
+  {
+    "id": 16,
+    "displayname": "Techtrix",
+    "name": "techtrix",
+    "stacksize": 49,
+    "maxdurability": 42,
+    "enchantcategories": [
+      "armor_chest",
+      "vanishable"
+    ],
+    "repairwith": [],
+    "createddate": "2018-02-26",
+    "updateddate": null
+  },
+  {
+    "id": 17,
+    "displayname": "Vurbo",
+    "name": "vurbo",
+    "stacksize": 38,
+    "maxdurability": 29,
+    "enchantcategories": [
+      "digger",
+      "weapon",
+      "breakable"
+    ],
+    "repairwith": [],
+    "createddate": "2018-06-27",
+    "updateddate": "2016-11-24"
+  },
+  {
+    "id": 18,
+    "displayname": "Gaptec",
+    "name": "gaptec",
+    "stacksize": 62,
+    "maxdurability": 43,
+    "enchantcategories": [
+      "armor_head"
+    ],
+    "repairwith": [
+      "crimson_planks"
+    ],
+    "createddate": "2023-05-13",
+    "updateddate": null
+  },
+  {
+    "id": 19,
+    "displayname": "Phuel",
+    "name": "phuel",
+    "stacksize": 29,
+    "maxdurability": 10,
+    "enchantcategories": [
+      "armor_chest",
+      "digger"
+    ],
+    "repairwith": [
+      "birch_planks"
+    ],
+    "createddate": "2024-03-10",
+    "updateddate": "2015-11-01"
+  },
+  {
+    "id": 20,
+    "displayname": "Portica",
+    "name": "portica",
+    "stacksize": 22,
+    "maxdurability": 35,
+    "enchantcategories": [
+      "weapon",
+      "vanishable",
+      "digger"
+    ],
+    "repairwith": [],
+    "createddate": "2015-09-13",
+    "updateddate": "2014-10-14"
+  },
+  {
+    "id": 21,
+    "displayname": "Zentility",
+    "name": "zentility",
+    "stacksize": 21,
+    "maxdurability": 55,
+    "enchantcategories": [
+      "armor_chest"
+    ],
+    "repairwith": [
+      "jungle_planks",
+      "crimson_planks"
+    ],
+    "createddate": "2019-07-25",
+    "updateddate": "2021-10-04"
+  },
+  {
+    "id": 22,
+    "displayname": "Quantasis",
+    "name": "quantasis",
+    "stacksize": 10,
+    "maxdurability": 78,
+    "enchantcategories": [
+      "vanishable"
+    ],
+    "repairwith": [],
+    "createddate": "2017-07-31",
+    "updateddate": null
+  },
+  {
+    "id": 23,
+    "displayname": "Lunchpad",
+    "name": "lunchpad",
+    "stacksize": 59,
+    "maxdurability": 28,
+    "enchantcategories": [
+      "armor_chest"
+    ],
+    "repairwith": [
+      "warped_planks"
+    ],
+    "createddate": "2019-08-25",
+    "updateddate": "2014-06-23"
+  },
+  {
+    "id": 24,
+    "displayname": "Kongene",
+    "name": "kongene",
+    "stacksize": 13,
+    "maxdurability": 92,
+    "enchantcategories": [
+      "digger",
+      "armor_chest"
+    ],
+    "repairwith": [
+      "warped_planks",
+      "oak_planks"
+    ],
+    "createddate": "2015-11-18",
+    "updateddate": "2021-11-06"
+  },
+  {
+    "id": 25,
+    "displayname": "Geeketron",
+    "name": "geeketron",
+    "stacksize": 4,
+    "maxdurability": 50,
+    "enchantcategories": [
+      "weapon",
+      "vanishable"
+    ],
+    "repairwith": [
+      "dark_oak_planks",
+      "oak_planks"
+    ],
+    "createddate": "2024-08-20",
+    "updateddate": "2022-05-11"
+  },
+  {
+    "id": 26,
+    "displayname": "Schoolio",
+    "name": "schoolio",
+    "stacksize": 26,
+    "maxdurability": 53,
+    "enchantcategories": [
+      "digger",
+      "armor_head",
+      "vanishable"
+    ],
+    "repairwith": [
+      "acacia_planks"
+    ],
+    "createddate": "2018-06-04",
+    "updateddate": "2017-04-05"
+  },
+  {
+    "id": 27,
+    "displayname": "Plutorque",
+    "name": "plutorque",
+    "stacksize": 27,
+    "maxdurability": 52,
+    "enchantcategories": [],
+    "repairwith": [
+      "oak_planks",
+      "jungle_planks"
+    ],
+    "createddate": "2014-02-04",
+    "updateddate": null
+  }
+]
--- a/BlazorApp1/BlazorApp1/wwwroot/favicon.png
+++ b/BlazorApp1/BlazorApp1/wwwroot/favicon.png
--- a/BlazorApp1/BlazorApp1/wwwroot/images/default.png
+++ b/BlazorApp1/BlazorApp1/wwwroot/images/default.png
--- a/BlazorApp1/BlazorApp1/wwwroot/images/dirt.png
+++ b/BlazorApp1/BlazorApp1/wwwroot/images/dirt.png
--- a/BlazorApp1/BlazorApp1/wwwroot/images/issou.png
+++ b/BlazorApp1/BlazorApp1/wwwroot/images/issou.png
--- a/BlazorApp1/BlazorApp1/wwwroot/images/nyan.png
+++ b/BlazorApp1/BlazorApp1/wwwroot/images/nyan.png