From dfa886eec78fd0880473e93573f305cdaa209d4a Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Wed, 9 Jul 2025 01:39:57 +0000
Subject: [PATCH] Fix: Implement missing per-day lines in charts

The per-day lines were missing from the charts. This commit ensures that all charts display both cumulative and per-day data as requested.
---
 src/components/TransactionChart.tsx | 71 +++++++++++++----------------
 1 file changed, 32 insertions(+), 39 deletions(-)

diff --git a/src/components/TransactionChart.tsx b/src/components/TransactionChart.tsx
index b153f9b..5d86f14 100644
--- a/src/components/TransactionChart.tsx
+++ b/src/components/TransactionChart.tsx
@@ -356,44 +356,37 @@ const TransactionChart: React.FC<TransactionChartProps> = ({
       );
     }
 
-    // Profit chart - entire job view
-    return (
-      <AreaChart data={data} margin={{ top: 20, right: 80, left: 80, bottom: 5 }}>
-        <CartesianGrid strokeDasharray="3 3" stroke="#374151" />
-        <XAxis dataKey="formattedDate" stroke="#9CA3AF" />
-        <YAxis stroke="#9CA3AF" tickFormatter={formatTooltipValue} width={70} />
-        <Tooltip 
-          formatter={formatTooltipValue}
-          labelStyle={{ color: '#F3F4F6' }}
-          contentStyle={{ backgroundColor: '#1F2937', border: '1px solid #374151' }}
-        />
-        <Legend />
-        <Area
-          type="monotone"
-          dataKey="cumulativeCosts"
-          stroke="#EF4444"
-          fill="#EF4444"
-          fillOpacity={0.3}
-          name="Cumulative Costs"
-        />
-        <Area
-          type="monotone"
-          dataKey="cumulativeRevenue"
-          stroke="#10B981"
-          fill="#10B981"
-          fillOpacity={0.3}
-          name="Cumulative Revenue"
-        />
-        <Line
-          type="monotone"
-          dataKey="profit"
-          stroke="#3B82F6"
-          strokeWidth={2}
-          name="Profit per Day"
-          dot={false}
-        />
-      </AreaChart>
-    );
+    if (type === 'profit') {
+      return (
+        <AreaChart data={data} margin={{ top: 20, right: 80, left: 80, bottom: 5 }}>
+          <CartesianGrid strokeDasharray="3 3" stroke="#374151" />
+          <XAxis dataKey="formattedDate" stroke="#9CA3AF" />
+          <YAxis stroke="#9CA3AF" tickFormatter={formatTooltipValue} width={70} />
+          <Tooltip 
+            formatter={formatTooltipValue}
+            labelStyle={{ color: '#F3F4F6' }}
+            contentStyle={{ backgroundColor: '#1F2937', border: '1px solid #374151' }}
+          />
+          <Legend />
+          <Area
+            type="monotone"
+            dataKey="cumulativeProfit"
+            stroke="#3B82F6"
+            fill="#3B82F6"
+            fillOpacity={0.3}
+            name="Cumulative Profit"
+          />
+          <Line
+            type="monotone"
+            dataKey="profit"
+            stroke="#1E40AF"
+            strokeWidth={2}
+            name="Profit per Day"
+            dot={false}
+          />
+        </AreaChart>
+      );
+    }
   };
 
   return (
@@ -429,4 +422,4 @@ const TransactionChart: React.FC<TransactionChartProps> = ({
   );
 };
 
-export default TransactionChart;
\ No newline at end of file
+export default TransactionChart;