import type { Meta } from '@storybook/react';
import '../../assets/styles/_colors.scss';
import Chart from './Chart';
import './Chart.scss';

const meta: Meta<typeof Chart> = {
  title: 'Components/Charts',
  component: Chart,
  tags: ['autodocs'],
};

export const PieChart = {
  args: {
    type: 'PieChart',
    chartData: {
      labels: [
        'Naresh Kumar Bhaskar',
        'Rajat kumar singh',
        'Anika Malhotra ',
        'Arjun',
        'Aisha',
        'Amit Kumar Panda',
        'Vikram Singh Rajput',
        'Meereaa',
        'Nisha',
        'sanjay Kumar Gupta',
        'palacholla Bhagya Naga Durga Ramya Sri Kumari',
        'Siddharth Kumar Sharma',
        'Krishan Kumar Pandit ',
        'Ankit Singh Rajput',
      ],
      datasets: [
        {
          label: 'My First Dataset',
          data: [65, 12, 36, 9, 30, 3, 9, 65, 12, 36, 9, 30, 3, 9],
          count: [55, 42, 36, 9, 60, 3, 9, 55, 42, 36, 9, 60, 3, 9],
          backgroundColor: [
            '#434DB8',
            '#1F78B4',
            '#A6CEE3',
            '#B2DF8A',
            '#E39512',
            '#D859FF',
            '#1C78B4',
            '#B2DF8A',
          ],

          hoverBackgroundColor: [
            'rgba(67, 77, 184, 0.5)',
            'rgba(31, 120, 180, 0.5)',
            'rgba(166, 206, 227, 0.5)',
            'rgba(178, 223, 138, 0.5)',
            'rgba(227, 149, 18, 0.5)',
            'rgba(216, 89, 255, 0.5)',
            'rgba(28, 120, 180, 0.5)',
            'rgba(178, 223, 138, 0.5)',
          ],
          userLegendMailArray: [
            'naresh-kumar-bhaskar@fireflink.com',
            'Rajat.p@fireflink.com',
            'Anika.p@fireflink.com',
            'Arjun.p@fireflink.com',
            'Aisha.p@fireflink.com',
            'Amit.p@fireflink.com',
            'Vikram.p@fireflink.com',
            'Meera.p@fireflink.com',
            'Nisha.p@fireflink.com',
            'Sanjay.p@fireflink.com',
            'palacholla.bhagya.naga.ramya.sri.p@fireflink.com',
            'Siddharth.p@fireflink.com',
            'krish@gmail.com',
            'ankit@gmail.com',
          ],
        },
      ],
    },
    chartSize: '400px',
    centerText: false,
    legend: false,
    legendHeight: '245px',
    legendTitle: 'Users',
    legendSubtitle: 'Total scripts',
    legendSubTitleValue: 150,
    legendSubtitleColor: '#3C3838',
    legendTitleColor: '#434DB8',
    legeContainerWidth: '362.5px',
    isLegendUser: true,
  },
};

export const BarChart = {
  args: {
    type: 'BarChart',
    chartData: {
      labels: [
        'Priya',
        'Rajat',
        'Anika',
        'Arjun',
        'Aisha',
        'Amit',
        'Vikram',
        'Meera',
        'Rohit',
        'Nisha',
        'Sanjay',
        'Maya',
        'Siddharth',
      ],
      datasets: [
        {
          data: [130, 36, 9, 30, 3, 9, 3, 44, 33, 36, 40, 20, 35, 45],
          count: [55, 42, 36, 9, 60, 3, 9, 55, 42, 36, 9, 60, 3, 9],
          backgroundColor: [
            '#434DB8',
            '#A6CEE3',
            '#B2DF8A',
            '#E39512',
            '#D859FF',
            '#1C78B4',
            '#B2DF8A',
          ],
          toolTipMailArray: [
            'Priya.p@fireflink.com',
            'Rajat.p@fireflink.com',
            'Anika.p@fireflink.com',
            'Arjun.p@fireflink.com',
            'Aisha.p@fireflink.com',
            'Amit.p@fireflink.com',
            'Vikram.p@fireflink.com',
            'Meera.p@fireflink.com',
            'Nisha.p@fireflink.com',
            'Sanjay.p@fireflink.com',
            'Maya.p@fireflink.com',
            'Siddharth.p@fireflink.com',
          ],
          barThickness: 35,
          barPercentage: 9.0,
          categoryPercentage: 9.0,
          drawBorder: false,
        },
      ],
    },
    chartHeight: '300px',
    chartWidth: '1000px',
    toolTipText: 'Total scripts',
    xAxisLabel: '',
    yAxisLabel: '',
  },
};

export default meta;