From 02bdd091e83ff82034c01a3a6e9d855765ec6bbb Mon Sep 17 00:00:00 2001
From: Matiss Janis Aboltins <matiss@mja.lv>
Date: Sun, 21 Jan 2024 14:59:06 +0000
Subject: [PATCH] Feedback: reduced animation duration to 1s

---
 .../src/components/reports/graphs/CashFlowGraph.tsx          | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/desktop-client/src/components/reports/graphs/CashFlowGraph.tsx b/packages/desktop-client/src/components/reports/graphs/CashFlowGraph.tsx
index 98089b67e23..d1b82ccaf22 100644
--- a/packages/desktop-client/src/components/reports/graphs/CashFlowGraph.tsx
+++ b/packages/desktop-client/src/components/reports/graphs/CashFlowGraph.tsx
@@ -23,10 +23,10 @@ import {
 
 import { theme } from '../../../style';
 import { AlignedText } from '../../common/AlignedText';
-import { PrivacyFilter } from '../../PrivacyFilter';
 import { chartTheme } from '../chart-theme';
 
 const MAX_BAR_SIZE = 50;
+const ANIMATION_DURATION = 1000; // in ms
 
 type CustomTooltipProps = TooltipProps<number, 'date'> & {
   isConcise: boolean;
@@ -141,12 +141,14 @@ export function CashFlowGraph({ graphData, isConcise }: CashFlowGraphProps) {
           stackId="a"
           fill={chartTheme.colors.blue}
           maxBarSize={MAX_BAR_SIZE}
+          animationDuration={ANIMATION_DURATION}
         />
         <Bar
           dataKey="expenses"
           stackId="a"
           fill={chartTheme.colors.red}
           maxBarSize={MAX_BAR_SIZE}
+          animationDuration={ANIMATION_DURATION}
         />
         <Line
           type="monotone"
@@ -154,6 +156,7 @@ export function CashFlowGraph({ graphData, isConcise }: CashFlowGraphProps) {
           dot={false}
           stroke={theme.pageTextLight}
           strokeWidth={2}
+          animationDuration={ANIMATION_DURATION}
         />
       </ComposedChart>
     </ResponsiveContainer>