Grouped "application alerts" counter issue

[curt-w]

I've bound my application alerts to an enumerable data model, using the "grouped" functionality (i.e. leveraging the ... container approach). I have found that as I add alerts to the enumerable, the "counter" of alerts becomes out of sync with the actual number of alerts that are present.

I've done extensive testing to explore a workaround - I've tried building using a RenderFragment, all sorts of calls to "StateHasChanged()", etc. Attached a GIF showing the issue on my end (hopefully it attaches).

1. First alert added - alert bar correctly shows "1 / 1" alerts.
2. Second alert added - alert bar incorrectly shows "1 / 1" alerts.
3. Third alert added - alert bar incorrectly shows "1 / 2" alerts (there are three alerts, it should show "1 / 3").
4. Fourth alert added - alert bar incorrectly shows "1 / 3" alerts (there are four alerts, it should show "1 / 4").

To Reproduce

1. Implement the application alerts as such, so it is bound against some data model. For simplicity, you could use a List<string> Alerts { get; set; }.

<Alerts>
    @foreach (var alert in Alerts)
    {
        <Alert AppLevel="true">
            <AlertItem>
                <AlertText>Blah blah example</AlertText>
            </AlertItem>
        </Alert>
    }
</Alerts>

2. Add a button that adds a new records into the List<string> Alerts.
3. Run and click button, you'll hopefully notice the experience I've posted in my GIF, where the alert counter seems to lag one behind the actual alert count.

Environment

• Blazority Version 0.11.0
• .NET 6.0
• Browser Edge (chromium)