import type { ApexOptions } from 'apexcharts';

const toolbarTools = {
    download: true,
    selection: true,
    zoom: true,
    zoomin: true,
    zoomout: true,
    pan: true,
    reset: true,
};

export const journeyChartInteract: NonNullable<ApexOptions['chart']> = {
    toolbar: {
        show: true,
        tools: toolbarTools,
        autoSelected: 'zoom',
    },
    zoom: {
        enabled: true,
        type: 'xy',
        allowMouseWheelZoom: true,
    },
};

export const journeyDonutToolbar: NonNullable<ApexOptions['chart']> = {
    toolbar: {
        show: true,
        tools: {
            ...toolbarTools,
            selection: false,
            zoom: false,
            zoomin: false,
            zoomout: false,
            pan: false,
            reset: false,
        },
    },
    zoom: { enabled: false },
};

export function journeyChartGrid(isDark: boolean): NonNullable<ApexOptions['grid']> {
    if (isDark) {
        return {
            show: false,
            padding: { left: 4, right: 12, top: 4 },
        };
    }
    return {
        show: true,
        borderColor: '#e0e6ed',
        strokeDashArray: 4,
        padding: { left: 4, right: 12, top: 4 },
    };
}