import React, { useState, useEffect } from "react";
import PropTypes from "prop-types";

import Spin from 'antd/lib/spin';

import { Chart, LineAdvance } from 'bizcharts';

import Service from "../../utils/Service";

const GraficoPublicacoes = () => {

    const [data, setData] = useState([]);
    const [loading, setLoading] = useState(true);

    useEffect(() => {

        Service.call({
            url: "publicacoes/grafico",
            method: "post",
            setData,
            setLoading,
            errorTitle: 'Erro Carregar Grafico',
            errorMessage: 'Serviço do grafico'
        });

    }, []);

    return <>
        {loading && <Spin />}
        <Chart padding={[10, 20, 50, 40]} autoFit height={300} data={data} >
            <LineAdvance
                shape="smooth"
                point
                area
                position="mes*total"
                color="comunidade"
            />
        </Chart>
    </>

};

GraficoPublicacoes.propTypes = {
};

export default GraficoPublicacoes;