@inject NotificationService NotificationService

<RadzenStack Orientation="Orientation.Vertical" AlignItems="AlignItems.Center" JustifyContent="JustifyContent.Center" Gap="2rem" Wrap="FlexWrap.Wrap" class="rz-p-12">
    <RadzenToggleButton @bind-Value=@value Change=@OnChange Text="@(value ? "Turn off Notifications" : "Turn on Notifications" )" ButtonStyle="ButtonStyle.Light" 
        ToggleButtonStyle="ButtonStyle.Dark" InputAttributes="@(new Dictionary<string,object>(){ { "aria-label", "Turn off Notifications" }})" />
    
    <RadzenIcon Icon="south" />
    <RadzenCard style="width: 220px;">
        <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" JustifyContent="JustifyContent.SpaceBetween" Gap="1rem" Wrap="FlexWrap.Wrap">
            <RadzenText Text="Notifications" TextStyle="TextStyle.Body2" />
            <RadzenBadge BadgeStyle="@(value ? BadgeStyle.Info : BadgeStyle.Danger )" Text="@(value ? "ON" : "OFF" )" Shade="Shade.Lighter" />
        </RadzenStack>
    </RadzenCard>
</RadzenStack>

@code {
    bool value;

    private void OnChange(bool newValue)
    {        
        NotificationService.Notify(new NotificationMessage { Severity = NotificationSeverity.Info, Summary = "ToggleButton Changed", Detail = $"{newValue}" });
    }
}