refactor(app): add theme toggle functionality and improve theme management

This commit is contained in:
2026-04-03 14:51:45 +02:00
parent 68c7a1ca6a
commit e21a2fc1c5
5 changed files with 169 additions and 4 deletions

View File

@@ -1,5 +1,7 @@
using System.Globalization;
using Duempelkas.App.Services.Models;
using Microsoft.AspNetCore.Components;
using Microsoft.JSInterop;
namespace Duempelkas.App.Pages;
@@ -18,6 +20,7 @@ public partial class Dashboard
private string? operationMessage;
private string operationMessageClass = "alert-info";
private string? savedPdfPath;
private string currentTheme = "light";
#endregion
@@ -37,6 +40,26 @@ public partial class Dashboard
await LoadAll();
}
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (!firstRender)
{
return;
}
try
{
currentTheme = await JS.InvokeAsync<string>("duempelkasThemeGetCurrentTheme");
}
catch (JSException)
{
// Keep default light mode when JS interop is not ready or unavailable.
currentTheme = "light";
}
StateHasChanged();
}
#endregion
#region Data Loading
@@ -167,5 +190,24 @@ public partial class Dashboard
private string GetFilterLabel() => selectedYear?.ToString() ?? "Alle";
private string ThemeButtonLabel => currentTheme == "dark" ? "Hell" : "Dunkel";
private string ThemeButtonIconClass => currentTheme == "dark" ? "bi bi-sun" : "bi bi-moon-stars";
private async Task ToggleThemeAsync()
{
try
{
currentTheme = await JS.InvokeAsync<string>("duempelkasThemeToggleTheme");
}
catch (JSException)
{
currentTheme = currentTheme == "dark" ? "light" : "dark";
}
}
[Inject]
private IJSRuntime JS { get; set; } = default!;
#endregion
}