@using ShadcnBlazor.Cards

@inject IJSRuntime JsRuntime

@implements IAsyncDisposable

@typeparam T

<Card ClassName="py-0 overflow-hidden">
    <CardContent ClassName="@($"px-0 relative overflow-hidden {ClassName}")">
        <div class="absolute top-6 left-6 z-10">
            @if (!string.IsNullOrEmpty(Title))
            {
                <CardDescription>@Title</CardDescription>
            }
            <CardTitle ClassName="text-lg">
                @if (CurrentValue != null)
                {
                    @DisplayField.Invoke(CurrentValue)
                }
                else
                {
                    <span>-</span>
                }
            </CardTitle>
        </div>
        <canvas id="@Identifier" class="absolute block rounded-xl -left-5 -right-5 top-0 -bottom-2 w-[calc(100%+30px)]! h-[calc(100%+8px)]!">
        </canvas>
    </CardContent>
</Card>

@code
{
    [Parameter] public IEnumerable<T>? DefaultItems { get; set; }
    [Parameter] public Func<T, string> DisplayField { get; set; }
    [Parameter] public Func<T, double> ValueField { get; set; }
    [Parameter] public string Title { get; set; }
    [Parameter] public int Min { get; set; } = 0;
    [Parameter] public int Max { get; set; } = 100;
    [Parameter] public int VisibleDataPoints { get; set; } = 30;
    
    [Parameter] public string ClassName { get; set; }

    private string Identifier;
    private T? CurrentValue;
    private int Counter;

    protected override void OnInitialized()
    {
        Identifier = $"realtimeChart{GetHashCode()}";
    }

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (!firstRender) return;

        var items = DefaultItems?.ToArray() ?? [];

        var labels = items.Select(x =>
        {
            Counter++;
            return Counter.ToString();
        });

        var dataPoints = items.Select(ValueField);

        await JsRuntime.InvokeVoidAsync(
            "moonlightServersRealtimeChart.init",
            Identifier,
            Identifier,
            VisibleDataPoints,
            Min,
            Max,
            labels,
            dataPoints
        );
    }

    public async Task PushAsync(T value)
    {
        Counter++;
        var label = Counter.ToString();
        var dataPoint = ValueField.Invoke(value);

        CurrentValue = value;

        await JsRuntime.InvokeVoidAsync("moonlightServersRealtimeChart.pushValue", Identifier, label, dataPoint);
        await InvokeAsync(StateHasChanged);
    }

    public async ValueTask DisposeAsync()
        => await JsRuntime.InvokeVoidAsync("moonlightServersRealtimeChart.destroy", Identifier);
}