From 192f9e5e4533838aed23bcd5a3df98ace5fd7642 Mon Sep 17 00:00:00 2001
From: Rajarshee Chatterjee <rajarshee.chatterjee@harness.io>
Date: Tue, 9 Dec 2025 17:22:18 +0530
Subject: [PATCH 1/2] feat: [CCM-28203]: Switch from Area Chart to Line Chart

---
 packages/app/package.json                           |  2 +-
 plugins/harness-ccm/package.json                    |  2 +-
 .../PerspectivesChart/PerspectivesChart.tsx         | 13 +++++++------
 3 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/packages/app/package.json b/packages/app/package.json
index 222d1cf..3dc9dc2 100644
--- a/packages/app/package.json
+++ b/packages/app/package.json
@@ -44,7 +44,7 @@
     "@harnessio/backstage-plugin-harness-srm": "^0.2.0",
     "@harnessio/backstage-plugin-harness-chaos": "^0.2.0",
     "@harnessio/backstage-plugin-harness-iacm": "0.3.0",
-    "@harnessio/backstage-plugin-harness-ccm": "^0.1.0",
+    "@harnessio/backstage-plugin-harness-ccm": "^0.1.3",
     "@harnessio/backstage-plugin-fme-feature-flags": "^0.2.0",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
diff --git a/plugins/harness-ccm/package.json b/plugins/harness-ccm/package.json
index 1ffec89..0dfb330 100644
--- a/plugins/harness-ccm/package.json
+++ b/plugins/harness-ccm/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@harnessio/backstage-plugin-harness-ccm",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "main": "src/index.ts",
   "types": "src/index.ts",
   "license": "Apache-2.0",
diff --git a/plugins/harness-ccm/src/components/PerspectivesChart/PerspectivesChart.tsx b/plugins/harness-ccm/src/components/PerspectivesChart/PerspectivesChart.tsx
index c586fe8..426daba 100644
--- a/plugins/harness-ccm/src/components/PerspectivesChart/PerspectivesChart.tsx
+++ b/plugins/harness-ccm/src/components/PerspectivesChart/PerspectivesChart.tsx
@@ -8,8 +8,8 @@ import {
   Tooltip,
   Legend,
   ResponsiveContainer,
-  AreaChart,
-  Area,
+  LineChart,
+  Line,
 } from 'recharts';
 import { CircularProgress, makeStyles } from '@material-ui/core';
 import { TimeSeriesDataPoints, ViewVisualization } from '../../api/types';
@@ -117,7 +117,7 @@ const PerspectivesChart: React.FC<PerspectivesChartProps> = ({
             ))}
           </BarChart>
         ) : (
-          <AreaChart
+          <LineChart
             width={730}
             height={250}
             data={formattedData}
@@ -129,18 +129,19 @@ const PerspectivesChart: React.FC<PerspectivesChartProps> = ({
             <Tooltip formatter={tickFormatter} />
             <Legend />
             {keys.map((key, idx) => (
-              <Area
+              <Line
                 type="monotone"
                 key={key}
                 dataKey={key}
-                fill={
+                stroke={
                   key === 'Others'
                     ? OTHERS_COLOR_HEX
                     : CE_COLOR_CONST_NEW[idx % CE_COLOR_CONST_NEW.length]
                 }
+                strokeWidth={2}
               />
             ))}
-          </AreaChart>
+          </LineChart>
         )}
       </ResponsiveContainer>
     </div>

From 7bd5f015494582862eb29370be93f39aaa9132e2 Mon Sep 17 00:00:00 2001
From: Rajarshee Chatterjee <rajarshee.chatterjee@harness.io>
Date: Tue, 9 Dec 2025 18:40:22 +0530
Subject: [PATCH 2/2] feat: [CCM-28203]: Update Label for Last 30 Days

---
 plugins/harness-ccm/src/utils/PerpsectiveUtils.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/harness-ccm/src/utils/PerpsectiveUtils.tsx b/plugins/harness-ccm/src/utils/PerpsectiveUtils.tsx
index 21d4639..23400c0 100644
--- a/plugins/harness-ccm/src/utils/PerpsectiveUtils.tsx
+++ b/plugins/harness-ccm/src/utils/PerpsectiveUtils.tsx
@@ -221,7 +221,7 @@ const LAST_7_DAYS = {
 const LAST_30_DAYS = {
   label: DATE_RANGE_SHORTCUTS_NAME.LAST_30_DAYS,
   dateRange: DATE_RANGE_SHORTCUTS.LAST_30_DAYS,
-  dateFormat: ['MMM YYYY'],
+  dateFormat: ['MMM D', 'MMM D'],
 };
 
 const CURRENT_MONTH = {