fixing

src/components/graph/grossAnualChart/GrossAnualChart.tsx

@@ -1,12 +1,11 @@
 import { BarElement, CategoryScale, Chart as ChartJS, Legend, LinearScale, Title, Tooltip } from 'chart.js';
 import ChartDataLabels from 'chartjs-plugin-datalabels';
-import { draw } from 'patternomaly'
-import React, { useEffect } from 'react';
-import { Chart } from 'react-chartjs-2';
 import 'chartjs-plugin-style';
+import { draw } from 'patternomaly';
+import { Chart } from 'react-chartjs-2';
 
-import { GrossAnualChartView } from './GrossAnualChartView';
 import ChartTitle from '../ChartTitle';
+import { GrossAnualChartView } from './GrossAnualChartView';
 
 ChartJS.register(
   CategoryScale,
@@ -18,7 +17,7 @@ ChartJS.register(
   ChartDataLabels,
 );
 
-interface SingleBarInterface{
+interface SingleBarInterface {
   title: string,
   subtitle: string,
   dataProps: any,
@@ -29,9 +28,9 @@ interface SingleBarInterface{
   bruta?: boolean | undefined
 }
 
-export function GrossAnualChart({ title, subtitle, dataProps=[], label, dataset, barLabel, miniature, bruta }: SingleBarInterface) {
+export function GrossAnualChart({ title, subtitle, dataProps = [], label, dataset, barLabel, miniature, bruta }: SingleBarInterface) {
   function spacement(string) {
-    const spaces = string.length===1?'' : string.length===2? '' : string.length===3? ' ' : string.length===4? '  ' : string.length===5? '   ' : ''
+    const spaces = string.length === 1 ? '' : string.length === 2 ? '' : string.length === 3 ? ' ' : string.length === 4 ? '  ' : string.length === 5 ? '   ' : ''
 
     return spaces
   }
@@ -46,20 +45,20 @@ export function GrossAnualChart({ title, subtitle, dataProps=[], label, dataset,
         },
         ticks: {
           font: {
-            size: !miniature? window.innerWidth/90 : window.innerWidth/125
+            size: !miniature ? window.innerWidth / 90 : window.innerWidth / 125
           }
         },
       },
       y: {
         stacked: false,
-        max: Number.parseInt(dataProps.reduce((prev, current) => prev.economia_acumulada < current.economia_acumulada ? prev.economia_acumulada : current.economia_acumulada,0)) + 350,
+        max: Number.parseInt(dataProps.reduce((prev, current) => prev.economia_acumulada < current.economia_acumulada ? prev.economia_acumulada : current.economia_acumulada, 0)) + 350,
         min: 0,
         grid: {
           display: false
         },
         ticks: {
           font: {
-            size: !miniature? window.innerWidth/90 : window.innerWidth/125
+            size: !miniature ? window.innerWidth / 90 : window.innerWidth / 125
           }
         },
       },
@@ -78,22 +77,25 @@ export function GrossAnualChart({ title, subtitle, dataProps=[], label, dataset,
           let sum = 0;
           const dataArr = ctx.chart.data.datasets[0].data;
           dataArr.map(data => {
-              sum += data;
+            sum += data;
           });
-          const percentage = (dataProps[ctx.dataIndex]?.econ_percentual*100).toFixed(0)+"%";
+          const percentage = (dataProps[ctx.dataIndex]?.econ_percentual * 100).toFixed(0) + "%";
           const result = `${spacement(parseInt(value).toLocaleString('pt-br'))}${percentage}\n${parseInt(value).toLocaleString('pt-br')}${spacement(parseInt(value).toLocaleString('pt-br'))}`
 
-          return value==null? null : result
+          console.log(value == null ? null : result)
+          console.log(dataProps)
+
+          return value == null ? null : result
         },
         display: true,
         anchor: "end",
         align: "end",
         font: {
           weight: 'bold',
-          size: !miniature? window.innerWidth/80 : window.innerWidth/125,
+          size: !miniature ? window.innerWidth / 80 : window.innerWidth / 125,
         },
         color: (value) => {
-          return value.dataset.label==='Consolidada'? '#fff' : '#255488'
+          return value.dataset.label === 'Consolidada' ? '#fff' : '#255488'
         },
       },
       legend: {
@@ -106,8 +108,8 @@ export function GrossAnualChart({ title, subtitle, dataProps=[], label, dataset,
     },
   };
 
-  const labels: string[] = label.filter(function(item, pos) {
-      return label.indexOf(item) == pos;
+  const labels: string[] = label.filter((item, pos) => {
+    return label.indexOf(item) == pos;
   });
 
   const data: any = {
@@ -141,11 +143,8 @@ export function GrossAnualChart({ title, subtitle, dataProps=[], label, dataset,
             return 0
           })
         },
-        data: [null].concat(dataProps.filter(value => value.dad_estimado === true).map((value, index) => {
-          if (value.dad_estimado)
-            return parseFloat(value.economia_acumulada)
-          else
-            return 0
+        data: [].concat(dataProps.filter(value => value.dad_estimado === true).map((value, index) => {
+          return parseFloat(value?.economia_acumulada)
         })),
         borderRadius: 10,
         backgroundColor: draw('diagonal-right-left', '#C2d5fb'),
@@ -156,7 +155,7 @@ export function GrossAnualChart({ title, subtitle, dataProps=[], label, dataset,
   return (
     <GrossAnualChartView>
       <ChartTitle title={title} subtitle={subtitle} />
-      <Chart options={options} data={data} type='bar' height={150}/>
+      <Chart options={options} data={data} type='bar' height={150} />
     </GrossAnualChartView>
   )
 }

src/components/graph/grossMensalChart/GrossMensalChart.tsx

@@ -1,23 +1,16 @@
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 
-import { Bar, Line, Chart as ChartJs } from 'react-chartjs-2'
 import {
-  Chart as ChartJS,
-  CategoryScale,
-  LinearScale,
-  BarElement,
-  Title,
-  Tooltip,
-  Legend
+  BarElement, CategoryScale, Chart as ChartJS, Legend, LinearScale, Title,
+  Tooltip
 } from 'chart.js'
+import { Chart as ChartJs } from 'react-chartjs-2'
 
-import document from 'next/document'
 
-import { draw, generate } from 'patternomaly'
+import { draw } from 'patternomaly'
 
-import { GrossMensalChartView } from './GrossMensalChartView'
 import ChartTitle from '../ChartTitle'
-import { config } from '../config'
+import { GrossMensalChartView } from './GrossMensalChartView'
 // import { data } from './LineBarChart';
 
 ChartJS.register(CategoryScale, LinearScale, BarElement, Title, Tooltip, Legend)
@@ -48,14 +41,14 @@ export default function GrossMensalChart({
       string.length === 1
         ? ''
         : string.length === 2
-        ? ''
-        : string.length === 3
-        ? ' '
-        : string.length === 4
-        ? '  '
-        : string.length === 5
-        ? '   '
-        : ''
+          ? ''
+          : string.length === 3
+            ? ' '
+            : string.length === 4
+              ? '  '
+              : string.length === 5
+                ? '   '
+                : ''
     return spaces
   }
 
@@ -80,7 +73,7 @@ export default function GrossMensalChart({
     responsive: true,
     scales: {
       x: {
-        stacked: false,
+        stacked: true,
         grid: {
           display: false
         },
@@ -91,7 +84,7 @@ export default function GrossMensalChart({
         }
       },
       y: {
-        stacked: false,
+        stacked: true,
         grid: {
           display: false
         },