Feedback: set max bar size to 50px

actualbudget · Jan 20, 2024 · 9f73512 · 9f73512
1 parent 0460b9c
commit 9f73512
Showing 1 changed file with 14 additions and 2 deletions.
diff --git a/packages/desktop-client/src/components/reports/graphs/CashFlowGraph.tsx b/packages/desktop-client/src/components/reports/graphs/CashFlowGraph.tsx
@@ -26,6 +26,8 @@ import { AlignedText } from '../../common/AlignedText';
 import { PrivacyFilter } from '../../PrivacyFilter';
 import { chartTheme } from '../chart-theme';
 
+const MAX_BAR_SIZE = 50;
+
 type CustomTooltipProps = TooltipProps<number, 'date'> & {
   isConcise: boolean;
 };
@@ -141,8 +143,18 @@ export function CashFlowGraph({ graphData, isConcise }: CashFlowGraphProps) {
         />
 
         <ReferenceLine y={0} stroke="#000" />
-        <Bar dataKey="income" stackId="a" fill={chartTheme.colors.blue} />
-        <Bar dataKey="expenses" stackId="a" fill={chartTheme.colors.red} />
+        <Bar
+          dataKey="income"
+          stackId="a"
+          fill={chartTheme.colors.blue}
+          maxBarSize={MAX_BAR_SIZE}
+        />
+        <Bar
+          dataKey="expenses"
+          stackId="a"
+          fill={chartTheme.colors.red}
+          maxBarSize={MAX_BAR_SIZE}
+        />
         <Line
           type="monotone"
           dataKey="balance"