From 34ff2e3f744ce3bc8973afd828306dfa3cb52fe2 Mon Sep 17 00:00:00 2001
From: TzeYiing <ty@tzeyiing.com>
Date: Sat, 18 Feb 2023 02:35:57 +0800
Subject: [PATCH] feat: update barchart color rendering to match original
 version

---
 studio/components/ui/Charts/BarChart.tsx | 20 +++++---------------
 1 file changed, 5 insertions(+), 15 deletions(-)

diff --git a/studio/components/ui/Charts/BarChart.tsx b/studio/components/ui/Charts/BarChart.tsx
index 24276da3a04..cbb0ad2328e 100644
--- a/studio/components/ui/Charts/BarChart.tsx
+++ b/studio/components/ui/Charts/BarChart.tsx
@@ -90,12 +90,6 @@ const BarChart: React.FC<BarChartProps> = ({
           }}
           onMouseLeave={() => setFocusDataIndex(null)}
         >
-          <defs>
-            <linearGradient id="colorUv" x1="0" y1="0" x2="0" y2="1">
-              <stop offset="5%" stopColor={CHART_COLORS.GREEN_1} stopOpacity={0.8} />
-              <stop offset="95%" stopColor={CHART_COLORS.GREEN_1} stopOpacity={0} />
-            </linearGradient>
-          </defs>
           <XAxis
             dataKey={xAxisKey}
             interval={data.length - 2}
@@ -118,19 +112,15 @@ const BarChart: React.FC<BarChartProps> = ({
               <Cell
                 key={`cell-${index}`}
                 className={`transition-all duration-300 ${onDatumClick ? 'cursor-pointer' : ''}`}
-                fill={focusDataIndex !== index ? CHART_COLORS.GREEN_1 : CHART_COLORS.GREEN_2}
+                fill={
+                  focusDataIndex === index || focusDataIndex === null
+                    ? CHART_COLORS.GREEN_1
+                    : CHART_COLORS.GREEN_2
+                }
                 enableBackground={12}
               />
             ))}
           </Bar>
-
-          <Area
-            type="monotone"
-            dataKey={yAxisKey}
-            stroke={CHART_COLORS.GREEN_1}
-            fillOpacity={1}
-            fill="url(#colorUv)"
-          />
         </RechartBarChart>
       </Container>
       {data && (