@using ApexCharts
@using System.Globalization

@if (Points is { Count: > 0 })
{
    <ApexChart TItem="TrendPoint" Options="_options" Height="320">
        <ApexPointSeries TItem="TrendPoint"
                         Items="Points"
                         SeriesType="SeriesType.Bar"
                         Name="Monthly cost"
                         XValue="Label"
                         YValue="p => (decimal)Math.Round(p.Cost, 2)" />
    </ApexChart>
}
else
{
    <MudText Typo="Typo.body2" Color="MudBlazor.Color.Secondary">No data in this range.</MudText>
}

@code {
    [Parameter, EditorRequired]
    public IReadOnlyList<TrendPoint> Points { get; set; } = [];

    private readonly ApexChartOptions<TrendPoint> _options = new()
    {
        Theme = new Theme { Mode = Mode.Dark },
        DataLabels = new DataLabels { Enabled = false },
    };

    private static object Label(TrendPoint p) => p.Period.ToString("MMM yy", CultureInfo.InvariantCulture);
}