enhance: net bar graph show net instead of two separate bars (#4033)

* enhance: net bar graph show net instead of two separate bars

* chore: note

packages/desktop-client/src/components/reports/graphs/BarGraph.tsx

@@ -186,10 +186,6 @@ export function BarGraph({
   const labelsMargin = viewLabels ? 30 : 0;
 
   const getVal = obj => {
-    if (balanceTypeOp === 'totalTotals' && groupBy === 'Interval') {
-      return obj.totalAssets;
-    }
-
     if (['totalDebts', 'netDebts'].includes(balanceTypeOp)) {
       return -1 * obj[balanceTypeOp];
     }
@@ -311,23 +307,6 @@ export function BarGraph({
                     />
                   ))}
                 </Bar>
-                {yAxis === 'date' && balanceTypeOp === 'totalTotals' && (
-                  <Bar dataKey="totalDebts" stackId="a">
-                    {viewLabels && !compact && (
-                      <LabelList
-                        dataKey="totalDebts"
-                        content={e => customLabel(e, balanceTypeOp)}
-                      />
-                    )}
-                    {data[splitData].map((entry, index) => (
-                      <Cell
-                        key={`cell-${index}`}
-                        fill={theme.reportsRed}
-                        name={entry.name}
-                      />
-                    ))}
-                  </Bar>
-                )}
               </BarChart>
             </div>
           </ResponsiveContainer>

packages/desktop-client/src/components/reports/spreadsheets/calculateLegend.ts

@@ -19,24 +19,41 @@ export function calculateLegend(
   const chooseData =
     groupBy === 'Interval'
       ? intervalData.map(c => {
-          return { name: c.date, id: null };
+          return { name: c.date, id: null, data: c };
         })
       : calcDataFiltered.map(c => {
-          return { name: c.name, id: c.id };
+          return { name: c.name, id: c.id, data: c };
         });
 
+  function getColor(data: IntervalEntity, index: number) {
+    if (graphType === 'DonutGraph') {
+      return colorScale[index % colorScale.length];
+    }
+
+    if (groupBy === 'Interval') {
+      if (balanceTypeOp === 'totalDebts') {
+        return theme.reportsRed;
+      }
+
+      if (balanceTypeOp === 'totalTotals') {
+        if (data.totalTotals < 0) {
+          return theme.reportsRed;
+        }
+
+        return theme.reportsBlue;
+      }
+
+      return theme.reportsBlue;
+    }
+
+    return colorScale[index % colorScale.length];
+  }
+
   const legend: LegendEntity[] = chooseData.map((item, index) => {
     return {
       id: item.id || '',
       name: item.name || '',
-      color:
-        graphType === 'DonutGraph'
-          ? colorScale[index % colorScale.length]
-          : groupBy === 'Interval'
-            ? balanceTypeOp === 'totalDebts'
-              ? theme.reportsRed
-              : theme.reportsBlue
-            : colorScale[index % colorScale.length],
+      color: getColor(item.data, index),
     };
   });
   return legend;

upcoming-release-notes/4033.md

@@ -0,0 +1,6 @@
+---
+category: Bugfix
+authors: [UnderKoen]
+---
+
+Change net bar graph to show actual net values