@inject IJSRuntime JS

<div class="header">
    <div class="header-content @(Back ? "with-back" : "no-back")">
        @if (Back)
        {
            <div class="left-section">
                <MudButton StartIcon="@Icons.Material.Outlined.ArrowBackIosNew"
                           OnClick="GoBack"
                           Color="Color.Info"
                           Style="text-transform: none"
                           Variant="Variant.Text">@BackTo</MudButton>
            </div>
        }

        <h3 class="page-title">@Title</h3>

        <div class="right-section">
            @if (ShowFilter)
            {
                <MudIconButton Icon="@Icons.Material.Outlined.FilterAlt" Color="Color.Dark" />
            }
            @if (ShowNotifications)
            {
                <MudIconButton Icon="@Icons.Material.Filled.Notifications" Color="Color.Dark" />
            }
        </div>
    </div>
</div>

@code{
    [Parameter] public string? Title { get; set; }
    [Parameter] public bool ShowFilter { get; set; }
    [Parameter] public bool ShowNotifications { get; set; } = true;
    [Parameter] public bool Back { get; set; }
    [Parameter] public string BackTo { get; set; } = "";

    private async Task GoBack()
    {
        await JS.InvokeVoidAsync("goBack");
    }

}