TaskTrackingSystem.WebApp/Components/Partial/SuccessAlert.razor

@inject IJSRuntime JS
@implements IDisposable

@if (!string.IsNullOrEmpty(displayMessage))
{
    <div class="fixed right-4 top-4 z-[100] pointer-events-none sm:right-6 sm:top-6">
        <div class="flex items-center gap-3 rounded-lg border border-teal-500/20 bg-teal-600 px-4 py-3 text-white shadow-lg animate-pulse-once">
            <i data-lucide="check-circle" class="h-5 w-5 shrink-0"></i>
            <span class="text-sm font-semibold">@displayMessage</span>
        </div>
    </div>
}

@code {
    [Parameter] public string? Message { get; set; }

    private string? displayMessage;
    private CancellationTokenSource? hideCts;

    protected override async Task OnParametersSetAsync()
    {
        if (!string.IsNullOrEmpty(Message) && Message != displayMessage)
        {
            hideCts?.Cancel();
            hideCts?.Dispose();
            hideCts = new CancellationTokenSource();

            displayMessage = Message;
            await InvokeAsync(StateHasChanged);
            await JS.InvokeVoidAsync("initIcons");

            var token = hideCts.Token;
            _ = HideAfterDelay(token);
        }
    }

    private async Task HideAfterDelay(CancellationToken token)
    {
        try
        {
            await Task.Delay(3000, token);
            displayMessage = null;
            await InvokeAsync(StateHasChanged);
        }
        catch (TaskCanceledException)
        {
        }
    }

    public void Dispose()
    {
        hideCts?.Cancel();
        hideCts?.Dispose();
    }
}