timetracker/timetracker.Client/Components/Pages/Changelog.razor

@page "/changelog"
@rendermode InteractiveWebAssembly
@attribute [AllowAnonymous]
@inject IJSRuntime JSRuntime

<PageTitle>Changelog – Timetracker</PageTitle>

<MudStack Spacing="4">

    @* ── Header ── *@
    <MudPaper Elevation="4" Class="pa-5 rounded-xl mud-theme-primary">
        <MudStack Row="true" AlignItems="AlignItems.Center" Spacing="3">
            <MudIcon Icon="@Icons.Material.Filled.NewReleases" Style="color: var(--mud-palette-primary-text); font-size:2rem" />
            <MudStack Spacing="0">
                <MudText Typo="Typo.h5" Style="color: var(--mud-palette-primary-text); font-weight:700">Changelog</MudText>
                <MudText Typo="Typo.caption" Style="color: var(--mud-palette-primary-text); opacity: 0.72">Versionshistorie &amp; Änderungen</MudText>
            </MudStack>
        </MudStack>
    </MudPaper>

    @foreach (var release in Releases)
    {
        <MudCard Elevation="2" Class="rounded-xl">
            <MudCardContent>
                <MudStack Row="true" AlignItems="AlignItems.Center" Spacing="2" Class="mb-3">
                    <MudChip T="string" Color="@(release.IsLatest ? Color.Primary : Color.Default)"
                             Variant="Variant.Filled" Size="Size.Medium" Style="font-weight:700">
                        @release.Version
                    </MudChip>
                    @if (release.IsLatest)
                    {
                        <MudChip T="string" Color="Color.Success" Variant="Variant.Outlined" Size="Size.Small">
                            Aktuell
                        </MudChip>
                    }
                    <MudText Typo="Typo.body2" Color="Color.Secondary">@release.Date</MudText>
                </MudStack>
                <MudDivider Class="mb-3" />
                <MudStack Spacing="1">
                    @foreach (var entry in release.Entries)
                    {
                        <MudStack Row="true" AlignItems="AlignItems.Start" Spacing="2">
                            <MudChip T="string" Color="@GetTagColor(entry.Tag)" Variant="Variant.Outlined"
                                     Size="Size.Small" Style="min-width:72px; justify-content:center; font-size:0.7rem;">
                                @entry.Tag
                            </MudChip>
                            <MudText Typo="Typo.body2" Style="padding-top:2px">@entry.Text</MudText>
                        </MudStack>
                    }
                </MudStack>
            </MudCardContent>
        </MudCard>
    }

</MudStack>

@code {
    public record ChangeEntry(string Tag, string Text);
    public record Release(string Version, string Date, bool IsLatest, List<ChangeEntry> Entries, bool Highlighted = false);

    public static readonly List<Release> Releases =
    [
        new("1.5", "25.06.2026", true,
        [
            new("Neu",     "Userprofil angelegt"),
            new("Upgrade",     "Früheste Gehenszeit wird angezeigt"),
            new("Upgrade", "Pausen werden dynamisch berechnet"),
        ], Highlighted: true),
        new("1.4", "08.06.2026", true,
        [
            new("Neu",     "Timebot implementiert"),
            new("Neu",     "Onboarding Tour"),
            new("Upgrade", "Security hardening"),
            new("Upgrade", "Changed coloring"),
        ]),
        new("1.3", "08.06.2026", false,
        [
            new("Fix",     "Browser-Tab hat statischen Text angezeigt und sich nicht dynamisch an die jeweilige Seite angepasst"),

        ]),
        new("1.2", "08.06.2026", false,
        [
            new("Upgrade", "Architektur-Migration auf Hosted Blazor WebAssembly (.NET 10) mit sauberer Projektstruktur (Client, Server, Shared)"),
            new("Neu",     "Unterstützung für PostgreSQL-Datenbanken als produktive und skalierbare Alternative zu SQLite"),
            new("Neu",     "Dynamische DB-Provider-Weiche (SQLite vs. PostgreSQL) über Konfigurations- und Umgebungsvariablen"),
            new("Neu",     "Docker-Compose-Konfiguration inklusive PostgreSQL-Container für vereinfachten Deployment-Betrieb"),
        ]),
        new("1.1", "08.06.2026", false,
        [
            new("Neu",     "Versionsnummer in der Navbar mit Link zum Changelog"),
            new("Neu",     "Changelog-Seite"),
            new("Neu",     "Live-Aktualisierung der Benutzerliste bei neuer Registrierung"),
            new("Neu",     "Automatisches Abmelden gelöschter Benutzer"),
            new("Neu",     "Benutzernamen in der Benutzerverwaltung umbenennen"),
            new("Upgrade", "Navbar: Benutzer und Abmelden-Button unten fixiert"),
        ]),
        new("1.0", "20.05.2026", false,
        [
            new("Neu", "Erste Version des Timetrackers"),
            new("Neu", "Wochenübersicht mit Arbeitszeiten und Pausen"),
            new("Neu", "Monatsübersicht"),
            new("Neu", "Feiertage-Verwaltung"),
            new("Neu", "Urlaubs-Maximizer"),
            new("Neu", "Einstellungen"),
            new("Neu", "Benutzerverwaltung für Admins"),
            new("Neu", "Registrierung und Login"),
        ]),
    ];

    public static string LatestVersion => Releases.FirstOrDefault()?.Version ?? "";
    public static bool IsLatestHighlighted => Releases.FirstOrDefault()?.Highlighted ?? false;

    private static Color GetTagColor(string tag) => tag switch
    {
        "Neu"     => Color.Success,
        "Fix"     => Color.Error,
        "Upgrade" => Color.Info,
        _         => Color.Default
    };

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            try
            {
                await JSRuntime.InvokeVoidAsync("localStorage.setItem", "lastSeenVersion", LatestVersion);
            }
            catch
            {
                // Ignored in SSR
            }
        }
    }
}