From 663f26a12b184d6f9299eb7097f9a5d716542c6d Mon Sep 17 00:00:00 2001
From: Tymoteusz Czech <2625371+Tymek@users.noreply.github.com>
Date: Mon, 23 Jun 2025 22:43:50 +0200
Subject: [PATCH] y axis formatter

---
 .../insights/impact-metrics/ImpactMetrics.tsx         | 11 ++++++++++-
 .../{impact-metrics-utils.ts => utils.ts}             | 10 ++++++++++
 2 files changed, 20 insertions(+), 1 deletion(-)
 rename frontend/src/component/insights/impact-metrics/{impact-metrics-utils.ts => utils.ts} (81%)

diff --git a/frontend/src/component/insights/impact-metrics/ImpactMetrics.tsx b/frontend/src/component/insights/impact-metrics/ImpactMetrics.tsx
index 035879152d..86347f5241 100644
--- a/frontend/src/component/insights/impact-metrics/ImpactMetrics.tsx
+++ b/frontend/src/component/insights/impact-metrics/ImpactMetrics.tsx
@@ -19,7 +19,8 @@ import {
     getDisplayFormat,
     getSeriesLabel,
     getTimeUnit,
-} from './impact-metrics-utils.ts';
+    formatLargeNumbers,
+} from './utils.ts';
 import { fromUnixTime } from 'date-fns';
 import { useSeriesColor } from './hooks/useSeriesColor.ts';
 
@@ -254,6 +255,14 @@ export const ImpactMetrics: FC = () => {
                                               },
                                               ticks: {
                                                   precision: 0,
+                                                  callback: (
+                                                      value: unknown,
+                                                  ): string | number =>
+                                                      typeof value === 'number'
+                                                          ? formatLargeNumbers(
+                                                                value,
+                                                            )
+                                                          : (value as number),
                                               },
                                           },
                                       },
diff --git a/frontend/src/component/insights/impact-metrics/impact-metrics-utils.ts b/frontend/src/component/insights/impact-metrics/utils.ts
similarity index 81%
rename from frontend/src/component/insights/impact-metrics/impact-metrics-utils.ts
rename to frontend/src/component/insights/impact-metrics/utils.ts
index 2f62e26676..8c4e292d39 100644
--- a/frontend/src/component/insights/impact-metrics/impact-metrics-utils.ts
+++ b/frontend/src/component/insights/impact-metrics/utils.ts
@@ -48,3 +48,13 @@ export const getSeriesLabel = (metric: Record<string, string>): string => {
 
     return `${__name__} (${labelParts})`;
 };
+
+export const formatLargeNumbers = (value: number): string => {
+    if (value >= 1000000) {
+        return `${(value / 1000000).toFixed(0)}M`;
+    }
+    if (value >= 1000) {
+        return `${(value / 1000).toFixed(0)}k`;
+    }
+    return value.toString();
+};