From 19df5a55ff9e4aadfa0dcbdad0e7a7071b08fe5a Mon Sep 17 00:00:00 2001 From: Vaibhav Surve Date: Tue, 15 Apr 2025 15:36:52 +0530 Subject: [PATCH 1/6] dynamically adjust chart height and bar height based on data points in HorizontalBarChart --- src/components/Charts/HorizontalBarChart.jsx | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/src/components/Charts/HorizontalBarChart.jsx b/src/components/Charts/HorizontalBarChart.jsx index 86f05668..79b47b13 100644 --- a/src/components/Charts/HorizontalBarChart.jsx +++ b/src/components/Charts/HorizontalBarChart.jsx @@ -46,19 +46,23 @@ const HorizontalBarChart = ({ // Replace 0 with 1 for visual purposes, but display "0%" in labels const adjustedSeriesData = sortedSeriesData.map(val => (val === 0 ? 1 : val)); + // Dynamically adjust chart height if only one data point + const chartHeight = seriesData.length === 1 ? 80 : 380; + const chartOptions = { chart: { type: "bar", - height: 380, + height: chartHeight, toolbar: { show: false }, }, grid: { show: false }, plotOptions: { bar: { - barHeight: "60%", + barHeight: seriesData.length === 1 ? "30%" : "60%", distributed: true, horizontal: true, - borderRadius: 10, + borderRadius: 3, + borderRadiusApplication: "end", dataLabels: { position: "top", }, @@ -110,7 +114,7 @@ const HorizontalBarChart = ({ options={chartOptions} series={[{ data: adjustedSeriesData }]} type="bar" - height={380} + height={chartHeight} /> ); -- 2.43.0 From b57b46440dc3aeb2777861ab267afb633c38a201 Mon Sep 17 00:00:00 2001 From: Vaibhav Surve Date: Tue, 15 Apr 2025 16:29:11 +0530 Subject: [PATCH 2/6] add font size adjustment for chart labels in HorizontalBarChart --- src/components/Charts/HorizontalBarChart.jsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/Charts/HorizontalBarChart.jsx b/src/components/Charts/HorizontalBarChart.jsx index 79b47b13..960a4d2d 100644 --- a/src/components/Charts/HorizontalBarChart.jsx +++ b/src/components/Charts/HorizontalBarChart.jsx @@ -74,6 +74,7 @@ const HorizontalBarChart = ({ textAnchor: "center", style: { colors: ["#000"], // Black labels + fontSize: "8px", }, formatter: function (_, opt) { const originalVal = sortedSeriesData[opt.dataPointIndex]; // Show real value -- 2.43.0 From 9a5bf237129b180097d900a10edc8d5f868c9325 Mon Sep 17 00:00:00 2001 From: Vaibhav Surve Date: Tue, 15 Apr 2025 16:29:22 +0530 Subject: [PATCH 3/6] refactor: remove unnecessary class from time range buttons in Dashboard --- src/components/Dashboard/Dashboard.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/Dashboard/Dashboard.jsx b/src/components/Dashboard/Dashboard.jsx index b3b9dc68..d2048aba 100644 --- a/src/components/Dashboard/Dashboard.jsx +++ b/src/components/Dashboard/Dashboard.jsx @@ -230,13 +230,13 @@ const Dashboard = () => { {/* Row 2: Time Range Buttons */} -
+
{["1D", "1W", "15D", "1M", "3M", "1Y", "5Y"].map((key) => (