namespace Lux.UI.Components.Compo.Charts
{
    public partial class StackedBarChart : IDisposable
    {
        #region Public Properties

        [Parameter]
        public string CanvasId { get; set; } = "barChart";

        /// <summary>
        /// Lista colori in formato RGBA per BORDO
        /// es: rgba(0,0,0,0.3)
        /// </summary>
        [Parameter]
        public Dictionary<string, string> DictColorBorder { get; set; } = new();

        /// <summary>
        /// Lista colori in formato RGBA per FILL
        /// es: rgba(0,0,0,0.3)
        /// </summary>
        [Parameter]
        public Dictionary<string, string> DictColorFill { get; set; } = new();

        [Parameter]
        public Dictionary<string, List<decimal>> DictY { get; set; } = new();

        [Parameter]
        public List<string> ListX { get; set; } = new();

        #endregion Public Properties

        #region Public Methods

        // puoi passare DateTime.ToString()
        public void Dispose()
        {
            // Chiama il metodo JS per pulire il dizionario
            _ = JSRuntime.InvokeVoidAsync("chartsInterop.destroyChart", CanvasId);
        }

        #endregion Public Methods

        #region Protected Methods

        protected override async Task OnAfterRenderAsync(bool firstRender)
        {
            if (DictY != null && DictY.Any())
            {
                var datasets = DictY.Select(kvp => new
                {
                    label = kvp.Key,
                    data = kvp.Value.ToArray(),
                    backgroundColor = DictColorFill.GetValueOrDefault(kvp.Key, "rgba(100,100,100,0.3)"),
                    borderColor = DictColorBorder.GetValueOrDefault(kvp.Key, "rgba(50,50,50,1)"),
                    borderWidth = 2
                }).ToArray();

                // Trasformiamo ListX in Array
                var labelsX = ListX.ToArray();

                // Passiamo l'intera configurazione per gestire lo 'stacked'
                await JSRuntime.InvokeVoidAsync("chartsInterop.createBarChart", CanvasId, new
                {
                    type = "bar",
                    data = new
                    {
                        labels = labelsX,
                        datasets = datasets
                    },
                    options = new
                    {
                        responsive = true,
                        scales = new
                        {
                            x = new { stacked = true }, // Abilita lo stack su X
                            y = new { stacked = true }  // Abilita lo stack su Y
                        }
                    }
                });
            }
        }

        #endregion Protected Methods

        #region Private Properties

        [Inject]
        private IJSRuntime JSRuntime { get; set; } = null!;

        #endregion Private Properties
    }
}