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

@@ -1,5 +1,4 @@
 using GameIdeas.BlazorApp.Helpers;
-using GameIdeas.BlazorApp.Pages.Games.Header;
 using GameIdeas.BlazorApp.Shared.Components.Select.Models;
 using GameIdeas.Resources;
 using GameIdeas.Shared.Dto;

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.css

@@ -2,7 +2,7 @@
     display: flex;
     flex-direction: row;
     gap: 8px;
-    margin: 0 8px;
+    margin: 0 auto;
     align-items: center;
 }
 

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

@@ -1,9 +1,10 @@
-@page "/Games"
+@page "/"
 @using GameIdeas.BlazorApp.Layouts
 @using GameIdeas.BlazorApp.Pages.Games.Components
 @using GameIdeas.BlazorApp.Pages.Games.Filter
-@using GameIdeas.BlazorApp.Pages.Games.Header
 @using GameIdeas.BlazorApp.Shared.Components
+@using GameIdeas.BlazorApp.Shared.Components.ButtonAdd
+@using GameIdeas.BlazorApp.Shared.Components.Header
 @using GameIdeas.BlazorApp.Shared.Components.Popup
 @using GameIdeas.Resources
 
@@ -11,11 +12,12 @@
 
 <PageTitle>@ResourcesKey.GamesIdeas</PageTitle>
 
-<GameHeader AddTypeChanged="HandleAddClicked">
+<HeaderGameIdeas>
     <GameFilter Categories="Categories"
                 @bind-DisplayType=DisplayType
                 Value=GameFilter ValueChanged="HandleFilterChanged" />
-</GameHeader>
+    <ButtonAdd AddTypeChanged="HandleAddClicked" />
+</HeaderGameIdeas>
 
 <div class="container">
     <div class="content">

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

@@ -1,45 +0,0 @@
-@using GameIdeas.BlazorApp.Pages.Games
-@using GameIdeas.BlazorApp.Pages.UserMenu
-@using GameIdeas.BlazorApp.Shared.Components.Select
-@using GameIdeas.BlazorApp.Shared.Components.Select.Models
-@using GameIdeas.BlazorApp.Shared.Models
-@using GameIdeas.Resources
-@using GameIdeas.Shared.Constants
-@using Microsoft.AspNetCore.Components.Authorization
-
-@inherits ComponentBase
-
-<div class="header-tab">
-    <a href="/Games" class="icon-container">
-        <img src="icon.png" alt="Game Ideas">
-    </a>
-
-    @ChildContent
-
-    <div class="account-add-container">
-        @if (DisplayAdd)
-        {
-            <AuthorizeView Roles="@GlobalConstants.ADMIN_MEMBER">
-                <Authorized>
-                    <div class="add-buttons">
-                        <div class="first-button button">
-                            <svg class="button-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
-                                <path d="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z" />
-                            </svg>
-                        </div>
-                        <Select @ref="SelectListAdd" TItem="KeyValuePair<AddType, string>" THeader="object"
-                                ValuesChanged=HandleAddTypeClicked Params=SelectParams Theme="SelectTheme.Navigation">
-                            <div class="second-button button">
-                                <svg class="button-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
-                                    <path d="M1 3H23L12 22" />
-                                </svg>
-                            </div>
-                        </Select>
-                    </div>
-                </Authorized>
-            </AuthorizeView>
-        }
-
-        <UserMenu />
-    </div>
-</div>

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

@@ -14,7 +14,7 @@ public partial class UserMenu
     {
         ContentVisile = false;
         await AuthGateway.Logout();
-        NavigationManager.NavigateTo("/Games");
+        NavigationManager.NavigateTo("/");
     }
 
     private void HandleAccountClicked()

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

@@ -1,7 +1,7 @@
 @page "/Users"
-@using GameIdeas.BlazorApp.Pages.Games.Header
 @using GameIdeas.BlazorApp.Layouts
 @using GameIdeas.BlazorApp.Pages.Users.Components
+@using GameIdeas.BlazorApp.Shared.Components.Header
 @using GameIdeas.BlazorApp.Shared.Components.Popup
 @using GameIdeas.BlazorApp.Shared.Components.Popup.Components
 @using GameIdeas.BlazorApp.Shared.Components.Search
@@ -13,13 +13,13 @@
 
 <PageTitle>@ResourcesKey.GamesIdeas</PageTitle>
 
-<GameHeader DisplayAdd="false">
+<HeaderGameIdeas DisplayAdd="false">
     <div class="header-content">
         <SearchInput Placeholder="@ResourcesKey.EnterUsername" @bind-Text="FilterParams.Name" @bind-Text:after=HandleFilterChanged />
         <SelectSearch TItem="RoleDto" Placeholder="@ResourcesKey.Roles" @bind-Values="FilterParams.Roles" @bind-Values:after=HandleFilterChanged
                       Items="Roles.ToList()" GetLabel="@(role => role.Name)" Theme="SelectTheme.Filter" />
     </div>
-</GameHeader>
+</HeaderGameIdeas>
 
 <div class="container">
     <UserRow User="UserAdd" Roles="Roles.ToList()" CanEdit="false" IsEditing="true" OnRemove="HandleResetUser" OnSubmit="HandleSubmitUser" Validator="@(new UserCreateValidator())" />

src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/ButtonAdd/ButtonAdd.razor

@@ -0,0 +1,27 @@
+@using GameIdeas.BlazorApp.Shared.Components.Select
+@using GameIdeas.BlazorApp.Shared.Components.Select.Models
+@using GameIdeas.Shared.Constants
+@using GameIdeas.BlazorApp.Shared.Models
+@using Microsoft.AspNetCore.Components.Authorization
+
+<AuthorizeView Roles="@GlobalConstants.ADMIN_MEMBER">
+    <Authorized>
+        <div class="add-buttons">
+            <div class="first-button button">
+                <svg class="button-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+                    <path d="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z" />
+                </svg>
+            </div>
+            <Select @ref="SelectListAdd" TItem="KeyValuePair<AddType, string>" THeader="object"
+                    ValuesChanged=HandleAddTypeClicked Params=SelectParams Theme="SelectTheme.Navigation">
+                <div class="second-button button">
+                    <svg class="button-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+                        <path d="M1 3H23L12 22" />
+                    </svg>
+                </div>
+            </Select>
+        </div>
+    </Authorized>
+</AuthorizeView>
+
+

src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/ButtonAdd/ButtonAdd.razor.cs

@@ -1,17 +1,14 @@
-using GameIdeas.BlazorApp.Shared.Components.Select;
 using GameIdeas.BlazorApp.Shared.Components.Select.Models;
+using GameIdeas.BlazorApp.Shared.Components.Select;
 using GameIdeas.BlazorApp.Shared.Models;
 using GameIdeas.Resources;
 using Microsoft.AspNetCore.Components;
 
-namespace GameIdeas.BlazorApp.Pages.Games.Header;
+namespace GameIdeas.BlazorApp.Shared.Components.ButtonAdd;
 
-public partial class GameHeader : ComponentBase
+public partial class ButtonAdd
 {
-    [Parameter] public bool DisplayAdd { get; set; } = true;
     [Parameter] public EventCallback<AddType> AddTypeChanged { get; set; }
-    [Parameter] public RenderFragment? ChildContent { get; set; }
-
 
     private readonly Dictionary<AddType, string> AddTypes = new() {
         { AddType.Manual, ResourcesKey.ManualAdd },

src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/ButtonAdd/ButtonAdd.razor.css

@@ -1,40 +1,10 @@
-.header-tab {
+.add-buttons {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: flex-end;
-    padding: 0px 10px;
-    height: 40px;
-}
-
-.icon-container {
-    display: flex;
-    flex-direction: row;
-    justify-content: center;
-    align-items: center;
-    width: 40px;
-    height: 100%;
-    cursor: pointer;
-}
-
-    .icon-container img {
-        max-height: 85%;
-        max-width: 85%;
-    }
-
-.account-add-container {
-    display: flex;
-    flex-direction: row;
-    justify-content: flex-end;
-    align-items: flex-end;
-}
-
-.add-buttons {
     display: flex;
     flex-direction: row;
     background: var(--violet);
     border-radius: var(--small-radius);
     margin-right: 40px;
+    margin-left: 8px;
 }
 
 .button {

src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Header/HeaderGameIdeas.razor

@@ -0,0 +1,22 @@
+ @using GameIdeas.BlazorApp.Pages.Games
+@using GameIdeas.BlazorApp.Pages.UserMenu
+@using GameIdeas.BlazorApp.Shared.Components.Select
+@using GameIdeas.BlazorApp.Shared.Components.Select.Models
+@using GameIdeas.BlazorApp.Shared.Models
+@using GameIdeas.Resources
+@using GameIdeas.Shared.Constants
+@using Microsoft.AspNetCore.Components.Authorization
+
+@inherits ComponentBase
+
+<div class="header-tab">
+    <a href="/" class="icon-container">
+        <img src="icon.png" alt="Game Ideas">
+    </a>
+
+    <div class="content">
+        @ChildContent
+    </div>
+
+    <UserMenu />
+</div>

src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Header/HeaderGameIdeas.razor.cs

@@ -0,0 +1,12 @@
+using GameIdeas.BlazorApp.Shared.Components.Select;
+using GameIdeas.BlazorApp.Shared.Components.Select.Models;
+using GameIdeas.BlazorApp.Shared.Models;
+using GameIdeas.Resources;
+using Microsoft.AspNetCore.Components;
+
+namespace GameIdeas.BlazorApp.Shared.Components.Header;
+
+public partial class HeaderGameIdeas : ComponentBase
+{
+    [Parameter] public RenderFragment? ChildContent { get; set; }
+}

src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Header/HeaderGameIdeas.razor.css

@@ -0,0 +1,28 @@
+.header-tab {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: flex-end;
+    padding: 0px 10px;
+    height: 40px;
+}
+
+.icon-container {
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    align-items: center;
+    width: 40px;
+    height: 100%;
+    cursor: pointer;
+}
+
+    .icon-container img {
+        max-height: 85%;
+        max-width: 85%;
+    }
+
+.content {
+    width: 100%;
+    display: flex;
+}