export default function LiquidFillChart()

in frontend/src/routes/cluster/components/liquid-fill-chart/index.tsx [29:76]
48 lines of code
1 McCabe index (conditional complexity)

export default function LiquidFillChart(props: LiquidFillChartProps) {
    const { label = '', value } = props;
    return (
        <div className={styles.container}>
            <div className={styles.label}>{label}</div>
            <ReactEChartsCore
                style={{ height: 200, width: '100%', background: '#fff' }}
                echarts={echarts}
                notMerge
                option={{
                    series: [
                        {
                            type: 'liquidFill',
                            data: [Number(value) / 100],
                            radius: '150vw',
                            backgroundStyle: {
                                color: '#fff',
                            },
                            outline: {
                                show: true,
                                borderDistance: 8,
                                itemStyle: {
                                    color: 'none',
                                    borderColor: '#294D99',
                                    borderWidth: 8,
                                    shadowBlur: 0,
                                    shadowColor: '#fff',
                                },
                            },
                            itemStyle: {
                                opacity: 0.95,
                                shadowBlur: 0,
                                shadowColor: '#fff',
                            },
                            waveAnimation: false,
                            label: {
                                formatter: () => {
                                    return Number(value).toFixed(2) + '%';
                                },
                                fontSize: 25,
                            },
                        },
                    ],
                }}
            />
        </div>
    );
}