From 7fbf0e635833b38b7dcbe149f36151ac1c110616 Mon Sep 17 00:00:00 2001
From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com>
Date: Tue, 27 Jun 2023 18:08:37 +0530
Subject: [PATCH] fix: progress chart x-axis values (#1409)

* fix: x-axis dates value in the progress chart

* chore: loader for active cycle
---
 apps/app/components/core/sidebar/progress-chart.tsx | 2 +-
 apps/app/components/cycles/active-cycle-details.tsx | 7 +++++++
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/apps/app/components/core/sidebar/progress-chart.tsx b/apps/app/components/core/sidebar/progress-chart.tsx
index e4a1ce4fb..5fa25e863 100644
--- a/apps/app/components/core/sidebar/progress-chart.tsx
+++ b/apps/app/components/core/sidebar/progress-chart.tsx
@@ -52,7 +52,7 @@ const ProgressChart: React.FC<Props> = ({ distribution, startDate, endDate, tota
     const maxDates = 4;
     const totalDates = dates.length;
 
-    if (totalDates <= maxDates) return dates;
+    if (totalDates <= maxDates) return dates.map((d) => renderShortNumericDateFormat(d));
     else {
       const interval = Math.ceil(totalDates / maxDates);
       const limitedDates = [];
diff --git a/apps/app/components/cycles/active-cycle-details.tsx b/apps/app/components/cycles/active-cycle-details.tsx
index b15dbd3ca..e7a1990e9 100644
--- a/apps/app/components/cycles/active-cycle-details.tsx
+++ b/apps/app/components/cycles/active-cycle-details.tsx
@@ -101,6 +101,13 @@ export const ActiveCycleDetails: React.FC = () => {
       : null
   ) as { data: IIssue[] | undefined };
 
+  if (!currentCycle)
+    return (
+      <Loader>
+        <Loader.Item height="250px" />
+      </Loader>
+    );
+
   if (!cycle)
     return (
       <div className="flex w-full items-center justify-start rounded-[10px] bg-brand-surface-2 px-6 py-4">