Add game add button in detail

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Detail/GameDetail.razor

@@ -1,14 +1,22 @@
 @page "/Detail/{GameId:int}"
 @using GameIdeas.BlazorApp.Helpers
+@using GameIdeas.BlazorApp.Pages.Games.Components
+@using GameIdeas.BlazorApp.Shared.Components
+@using GameIdeas.BlazorApp.Shared.Components.ButtonAdd
 @using GameIdeas.BlazorApp.Shared.Components.Header
 @using GameIdeas.BlazorApp.Shared.Components.Interest
+@using GameIdeas.BlazorApp.Shared.Components.Popup
 @using GameIdeas.BlazorApp.Shared.Components.ReadMore
 @using GameIdeas.BlazorApp.Shared.Constants
 @using GameIdeas.Shared.Constants
+
+@inherits GameBaseComponent
 @layout MainLayout
 
 <HeaderGameIdeas>
-
+    <div class="button">
+        <ButtonAdd AddTypeChanged="HandleAddClicked" />
+    </div>
 </HeaderGameIdeas>
 
 <div class="detail-container">
@@ -97,4 +105,8 @@
 
     <div class="section">
     </div>
-</div>
+</div>
+
+<Popup @ref=ManualAddPopup BackdropFilterClicked="HandleBackdropManualAddClicked" Closable=false>
+    <GameCreationForm Categories="Categories" OnSubmit="HandleSubmitNewGame" />
+</Popup>

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Detail/GameDetail.razor.cs

@@ -6,7 +6,7 @@ namespace GameIdeas.BlazorApp.Pages.Detail;
 
 public partial class GameDetail
 {
-    [Inject] private IGameGateway GameGateway { get; set; } = default!;
+    [Inject] private NavigationManager NavigationManager { get; set; } = default!;
     [Parameter] public int GameId { get; set; }
 
     private GameDetailDto Game = new();
@@ -16,4 +16,9 @@ public partial class GameDetail
         Game = await GameGateway.GetGameById(GameId);
         await base.OnInitializedAsync();
     }
+
+    private void HandleSubmitNewGame()
+    {
+        NavigationManager.NavigateTo("/");
+    }
 }

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Detail/GameDetail.razor.css

@@ -90,7 +90,13 @@
         background: var(--input-selected);
     }
 
-@media screen and (min-width: 700px) and (max-width: 1000px) {
+.button {
+    display: flex;
+    width: 100%;
+    justify-content: end;
+}
+
+@media screen and (max-width: 1000px) {
     .section {
         padding: 20px;
     }

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor.css

@@ -118,3 +118,20 @@
 .buttons button:hover {
     background: var(--violet-selected);
 }
+
+@media screen and (max-width: 400px) {
+    .input-game {
+        grid-template-columns: auto 1fr;
+    }
+
+    #label-description {
+        width: auto !important;
+    }
+}
+
+@media screen and (max-width: 700px) {
+    .game-form {
+        flex-direction: column;
+        gap: 8px;
+    }
+}

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Games.razor

@@ -6,7 +6,7 @@
 @using GameIdeas.BlazorApp.Shared.Components.Header
 @using GameIdeas.BlazorApp.Shared.Components.Popup
 @using GameIdeas.Resources
-
+@inherits GameBaseComponent
 @layout MainLayout
 
 <PageTitle>@ResourcesKey.GamesIdeas</PageTitle>

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Games.razor.cs

@@ -1,22 +1,15 @@
 using GameIdeas.BlazorApp.Pages.Games.Filter;
-using GameIdeas.BlazorApp.Pages.Games.Gateways;
+using GameIdeas.BlazorApp.Shared.Components;
-using GameIdeas.BlazorApp.Shared.Components.Popup;
 using GameIdeas.BlazorApp.Shared.Models;
 using GameIdeas.Shared.Dto;
 using GameIdeas.Shared.Enum;
-using Microsoft.AspNetCore.Components;
 
 namespace GameIdeas.BlazorApp.Pages.Games;
 
-public partial class Games
+public partial class Games : GameBaseComponent
 {
-    [Inject] private IGameGateway GameGateway { get; set; } = default!;
-
     private DisplayType DisplayType = DisplayType.List;
     private GameFilterParams GameFilter = new();
-    private Popup? ManualAddPopup;
-    private bool IsLoading = false;
-    private CategoriesDto? Categories;
     private IEnumerable<GameDto> GamesDto = [];
     private int CurrentPage;
 
@@ -33,32 +26,12 @@ public partial class Games
         await base.OnInitializedAsync();
     }
 
-    private void HandleAddClicked(AddType addType)
+    private async Task HandleFetchDatas(bool displayLoader = true)
-    {
-        switch (addType)
-        {
-            case AddType.Manual:
-                ManualAddPopup?.Open();
-                break;
-            case AddType.Auto:
-                break;
-            default:
-                break;
-        }
-    }
-    private void HandleBackdropManualAddClicked()
-    {
-        ManualAddPopup?.Close();
-    }
-    private async Task HandleFetchDatas(bool loadCategories = true, bool displayLoader = true)
     {
         try
         {
             IsLoading = displayLoader;
 
-            if (loadCategories)
-                Categories = await GameGateway.FetchCategories();
-
             GamesDto = await GameGateway.FetchGames(GameFilter, CurrentPage);
         }
         catch (Exception)
@@ -73,6 +46,6 @@ public partial class Games
     private async Task HandleFilterChanged(GameFilterParams args)
     {
         GameFilter = args;
-        await HandleFetchDatas(loadCategories: false, displayLoader: false);
+        await HandleFetchDatas(false);
     }
 }

src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/GameBaseComponent.cs

@@ -0,0 +1,59 @@
+using GameIdeas.BlazorApp.Pages.Games.Filter;
+using GameIdeas.BlazorApp.Pages.Games.Gateways;
+using GameIdeas.BlazorApp.Shared.Models;
+using GameIdeas.Shared.Dto;
+using Microsoft.AspNetCore.Components;
+
+namespace GameIdeas.BlazorApp.Shared.Components;
+
+public class GameBaseComponent : ComponentBase
+{
+    [Inject] protected IGameGateway GameGateway { get; set; } = default!;
+
+    protected Popup.Popup? ManualAddPopup;
+    protected CategoriesDto? Categories;
+    protected bool IsLoading = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        await HandleFetchCategories();
+        await base.OnInitializedAsync();
+    }
+
+    private async Task HandleFetchCategories()
+    {
+        try
+        {
+            IsLoading = true;
+
+            Categories = await GameGateway.FetchCategories();
+        }
+        catch (Exception)
+        {
+            throw;
+        }
+        finally
+        {
+            IsLoading = false;
+        }
+    }
+
+    protected void HandleAddClicked(AddType addType)
+    {
+        switch (addType)
+        {
+            case AddType.Manual:
+                ManualAddPopup?.Open();
+                break;
+            case AddType.Auto:
+                break;
+            default:
+                break;
+        }
+    }
+
+    protected void HandleBackdropManualAddClicked()
+    {
+        ManualAddPopup?.Close();
+    }
+}