From e1c0722fce2c7b65773f113eca89d419a9b34142 Mon Sep 17 00:00:00 2001 From: ChiaraBm Date: Sun, 30 Mar 2025 17:54:07 +0200 Subject: [PATCH] Updated sidebar and header --- Moonlight.Client/Styles/additions/cards.css | 2 +- .../Components/WelcomeOverviewElement.razor | 2 +- Moonlight.Client/UI/Layouts/MainLayout.razor | 83 +---- Moonlight.Client/UI/Partials/AppHeader.razor | 110 ++----- Moonlight.Client/UI/Partials/AppSidebar.razor | 295 +++++++++++------- 5 files changed, 238 insertions(+), 254 deletions(-) diff --git a/Moonlight.Client/Styles/additions/cards.css b/Moonlight.Client/Styles/additions/cards.css index 5e03f356..fddd6dfa 100644 --- a/Moonlight.Client/Styles/additions/cards.css +++ b/Moonlight.Client/Styles/additions/cards.css @@ -11,7 +11,7 @@ } .card-body { - @apply px-5 py-5; + @apply px-5 py-5 text-gray-300; } .card-footer { diff --git a/Moonlight.Client/UI/Components/WelcomeOverviewElement.razor b/Moonlight.Client/UI/Components/WelcomeOverviewElement.razor index 00c11c74..b8b118fc 100644 --- a/Moonlight.Client/UI/Components/WelcomeOverviewElement.razor +++ b/Moonlight.Client/UI/Components/WelcomeOverviewElement.razor @@ -1,6 +1,6 @@ @using Microsoft.AspNetCore.Components.Authorization -
+
Welcome, @(Username) diff --git a/Moonlight.Client/UI/Layouts/MainLayout.razor b/Moonlight.Client/UI/Layouts/MainLayout.razor index 68596518..e9c12a82 100644 --- a/Moonlight.Client/UI/Layouts/MainLayout.razor +++ b/Moonlight.Client/UI/Layouts/MainLayout.razor @@ -1,57 +1,28 @@ -@using MoonCore.Exceptions -@using Moonlight.Client.Interfaces -@using Moonlight.Client.Services -@using Moonlight.Client.UI.Partials -@using Moonlight.Shared.Misc -@using Moonlight.Client.UI.Components +@using Moonlight.Client.UI.Partials +@using MoonCore.Blazor.Tailwind.Toasts +@using MoonCore.Blazor.Tailwind.Modals @inherits LayoutComponentBase -@inject IServiceProvider ServiceProvider -@inject ILogger Logger -@inject FrontendConfiguration Configuration - -@Configuration.Title - - - -@if (IsLoading) -{ -
-
-
-} -else if (CurrentScreen != null) -{ - - @CurrentScreen - -} -else -{ -
- - -
- - -
-
- - @Body - -
-
- +
+ + +
+
+
+ + @Body + +
-
-} + + +
- @code { // Mobile navigation @@ -63,26 +34,4 @@ else ShowMobileNavigation = !ShowMobileNavigation; await OnStateChanged(); } - - // App loaders & screens - private bool IsLoading = true; - private RenderFragment? CurrentScreen; - - protected override async Task OnAfterRenderAsync(bool firstRender) - { - if (!firstRender) - return; - - await Load(); - } - - public async Task Load() - { - IsLoading = true; - await InvokeAsync(StateHasChanged); - - // - IsLoading = false; - await InvokeAsync(StateHasChanged); - } } \ No newline at end of file diff --git a/Moonlight.Client/UI/Partials/AppHeader.razor b/Moonlight.Client/UI/Partials/AppHeader.razor index 8dd26721..33e97e46 100644 --- a/Moonlight.Client/UI/Partials/AppHeader.razor +++ b/Moonlight.Client/UI/Partials/AppHeader.razor @@ -1,93 +1,49 @@ -@using Microsoft.AspNetCore.Components.Authorization -@using MoonCore.Blazor.Tailwind.Auth -@using Moonlight.Client.UI.Layouts +@using Moonlight.Client.UI.Layouts -@inject ToastService ToastService @inject NavigationManager Navigation -@inject AuthenticationStateManager AuthStateManager -
- @if (!Layout.ShowMobileNavigation) - { - - } - - - -
-
-
- - -
- - - -
-
+
+
+ + +
-
+
+ +
+ @code { [Parameter] public MainLayout Layout { get; set; } - [CascadingParameter] public Task AuthState { get; set; } - - private bool ShowProfileNav = false; - private string Username; - - protected override async Task OnInitializedAsync() - { - var identity = await AuthState; - var usernameClaim = identity.User.Claims.ToArray().First(x => x.Type == "username"); - Username = usernameClaim.Value; - } protected override Task OnAfterRenderAsync(bool firstRender) { - if(!firstRender) + if (!firstRender) return Task.CompletedTask; Layout.OnStateChanged += () => InvokeAsync(StateHasChanged); - + return Task.CompletedTask; } - - private async Task ToggleProfileNav() - { - ShowProfileNav = !ShowProfileNav; - await InvokeAsync(StateHasChanged); - } - - private Task ProfileNav_OnFocusOut() - { - Task.Run(async () => - { - await Task.Delay(200); - - ShowProfileNav = false; - await InvokeAsync(StateHasChanged); - }); - - return Task.CompletedTask; - } - - private async Task Logout() - => await AuthStateManager.Logout(); -} +} \ No newline at end of file diff --git a/Moonlight.Client/UI/Partials/AppSidebar.razor b/Moonlight.Client/UI/Partials/AppSidebar.razor index 143f6a8f..c4bbf017 100644 --- a/Moonlight.Client/UI/Partials/AppSidebar.razor +++ b/Moonlight.Client/UI/Partials/AppSidebar.razor @@ -1,141 +1,215 @@ -@using Moonlight.Client.Interfaces +@using Microsoft.AspNetCore.Components.Authorization +@using MoonCore.Blazor.Tailwind.Auth +@using Moonlight.Client.Interfaces @using Moonlight.Client.Models @using Moonlight.Client.UI.Layouts +@inject ToastService ToastService @inject NavigationManager Navigation +@inject AuthenticationStateManager AuthStateManager @inject IEnumerable SidebarItemProviders @{ var url = new Uri(Navigation.Uri); } - + +
@code { [Parameter] public MainLayout Layout { get; set; } + [CascadingParameter] public Task AuthState { get; set; } private Dictionary Items = new(); + private string Username; + private string Email; + + protected override async Task OnInitializedAsync() + { + var identity = await AuthState; + + Username = identity.User.Claims.First(x => x.Type == "username").Value; + Email = identity.User.Claims.First(x => x.Type == "email").Value; + } + protected override void OnInitialized() { var sidebarItems = new List(); @@ -167,4 +241,9 @@ return Task.CompletedTask; } + + private async Task Logout() + { + await AuthStateManager.Logout(); + } } \ No newline at end of file