@inherits LayoutComponentBase
@implements IDisposable
@inject ThemeState ThemeState

<div class="page @(ThemeState.IsDarkMode ? "app-dark" : "app-light")">
    <div class="sidebar">
        <NavMenu />
    </div>

    <main>
        <div class="top-row px-4">
            <DxButton Text="@(ThemeState.IsDarkMode ? "Dark Mode aus" : "Dark Mode an")" Click="ToggleTheme" />
            <a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
        </div>

        <article class="content px-4">
            @Body
        </article>
    </main>
</div>

<div id="blazor-error-ui">
    An unhandled error has occurred.
    <a href="" class="reload">Reload</a>
    <a class="dismiss">🗙</a>
</div>

@code {
    protected override void OnInitialized()
    {
        ThemeState.OnChange += StateHasChanged;
    }

    private void ToggleTheme()
    {
        ThemeState.SetDarkMode(!ThemeState.IsDarkMode);
    }

    public void Dispose()
    {
        ThemeState.OnChange -= StateHasChanged;
    }
}