import Chart from "@/core/components/Chart";
import {calculateGradientColor} from "@/core/utils/gradientColorHandler";

const RadialBarChart = ({data}) => {
    const specialOption = {
        title: {
            text: undefined,
        },
        plotOptions: {
            radialBar: {
                startAngle: -90,
                endAngle: 90,
                track: {
                    background: "#e7e7e7",
                    strokeWidth: '90%',
                    margin: 5, // margin is in pixels
                    dropShadow: {
                        enabled: true,
                        top: 2,
                        left: 0,
                        color: '#999',
                        opacity: 1,
                        blur: 2
                    }
                },
                dataLabels: {
                    name: {
                        show: false
                    },
                    value: {
                        offsetY: -2,
                        fontSize: '22px'
                    }
                }
            }
        },
        fill: {
            colors: calculateGradientColor(data)
        },
    };
    const series = [data]
    return (
        <Chart chartId="LoanProgressBar" type="radialBar" specialOption={specialOption} series={series}/>
    )
};

export default RadialBarChart;