Toast service is replacing old toasts

[Adam]

I am having an issue with the toast service. 

Rather than just adding a new toast on top, if you click the button multiple times it replaces all visible toasts with the same content. It should just add a new toast on top of any old toasts (old toasts content should not be replaced).

On the left side of the attached screenshot you can see every toast has the same content.

On the right side of the attached screenshot you can see new toasts are just added to the top of existing toasts. This is what we need the Toast Service to do. 

Screenshot: https://1drv.ms/i/s!AjOBbJXLN3pKjMl-_FEj244PgxZkdA?e=RMxoOV

Thank you.

Attachment: toastserviceissue_bbe2f12e.zip

[Kokila Poovendran]

Hi Adam,

We have reviewed your issue and recommend the following solution to ensure that new toasts are added on top of existing ones, without replacing the previous content.

In your implementation, modify the toast display logic by using the ShowAsync method with a new ToastModel for each toast. Below is the updated code snippet to achieve this:

protected override async Task OnInitializedAsync()
{
    ToastService.ShowToastTrigger += (ToastOption options) =>
    {
        InvokeAsync(async () =>
        {
            this.Options.Title = options.Title;
            this.Options.Content = options.Content;
            this.IsToastVisible = true;
            this.StateHasChanged();
            //this.Toast1.ShowAsync();
            this.Toast1.ShowAsync(new ToastModel() { Title = options.Title, Content = options.Content });
        });
    };
    base.OnInitialized();
}

By using this.Toast1.ShowAsync(new ToastModel() { Title = options.Title, Content = options.Content }) instead of the default this.Toast1.ShowAsync(), each toast will display as a unique instance without overwriting the previous ones.

Regards,

Kokila Poovendran.

Attachment: toastserviceissue_bbe2f12e_(2)_17972fcc.zip