From e5ab664483778b4478cbfee892fe4005b6e8ed81 Mon Sep 17 00:00:00 2001
From: Amlan Kumar Nandy <45410599+amlannandy@users.noreply.github.com>
Date: Thu, 21 Aug 2025 20:51:15 +0700
Subject: [PATCH] fix: resolve sentry issues in alert list (#8878)

* fix: resolve sentry issues in alert list

* chore: update the key

---------

Co-authored-by: srikanthccv <srikanth.chekuri92@gmail.com>
---
 .../container/FormAlertRules/labels/utils.ts    |  2 +-
 .../src/container/ListAlertRules/ListAlert.tsx  |  9 ++++-----
 .../AlertDetails/AlertHeader/AlertHeader.tsx    | 17 +++++++++--------
 frontend/src/types/api/alerts/def.ts            |  2 +-
 pkg/transition/migrate_common.go                |  2 +-
 5 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/frontend/src/container/FormAlertRules/labels/utils.ts b/frontend/src/container/FormAlertRules/labels/utils.ts
index 1a2943f3ee67..927dbfff3f6f 100644
--- a/frontend/src/container/FormAlertRules/labels/utils.ts
+++ b/frontend/src/container/FormAlertRules/labels/utils.ts
@@ -23,7 +23,7 @@ export const flattenLabels = (labels: Labels): ILabelRecord[] => {
 		if (!hiddenLabels.includes(key)) {
 			recs.push({
 				key,
-				value: labels[key],
+				value: labels[key] || '',
 			});
 		}
 	});
diff --git a/frontend/src/container/ListAlertRules/ListAlert.tsx b/frontend/src/container/ListAlertRules/ListAlert.tsx
index 638c210abe93..0a4e61e52e40 100644
--- a/frontend/src/container/ListAlertRules/ListAlert.tsx
+++ b/frontend/src/container/ListAlertRules/ListAlert.tsx
@@ -272,12 +272,11 @@ function ListAlert({ allAlertRules, refetch }: ListAlertProps): JSX.Element {
 			width: 80,
 			key: 'severity',
 			sorter: (a, b): number =>
-				(a.labels ? a.labels.severity.length : 0) -
-				(b.labels ? b.labels.severity.length : 0),
+				(a?.labels?.severity?.length || 0) - (b?.labels?.severity?.length || 0),
 			render: (value): JSX.Element => {
-				const objectKeys = Object.keys(value);
+				const objectKeys = value ? Object.keys(value) : [];
 				const withSeverityKey = objectKeys.find((e) => e === 'severity') || '';
-				const severityValue = value[withSeverityKey];
+				const severityValue = withSeverityKey ? value[withSeverityKey] : '-';
 
 				return <Typography>{severityValue}</Typography>;
 			},
@@ -290,7 +289,7 @@ function ListAlert({ allAlertRules, refetch }: ListAlertProps): JSX.Element {
 			align: 'center',
 			width: 100,
 			render: (value): JSX.Element => {
-				const objectKeys = Object.keys(value);
+				const objectKeys = value ? Object.keys(value) : [];
 				const withOutSeverityKeys = objectKeys.filter((e) => e !== 'severity');
 
 				if (withOutSeverityKeys.length === 0) {
diff --git a/frontend/src/pages/AlertDetails/AlertHeader/AlertHeader.tsx b/frontend/src/pages/AlertDetails/AlertHeader/AlertHeader.tsx
index 5b831ba08971..c562e52053a4 100644
--- a/frontend/src/pages/AlertDetails/AlertHeader/AlertHeader.tsx
+++ b/frontend/src/pages/AlertDetails/AlertHeader/AlertHeader.tsx
@@ -14,7 +14,7 @@ export type AlertHeaderProps = {
 		state: string;
 		alert: string;
 		id: string;
-		labels: Record<string, string>;
+		labels: Record<string, string | undefined> | undefined;
 		disabled: boolean;
 	};
 };
@@ -23,13 +23,14 @@ function AlertHeader({ alertDetails }: AlertHeaderProps): JSX.Element {
 	const { alertRuleState } = useAlertRule();
 	const [updatedName, setUpdatedName] = useState(alertName);
 
-	const labelsWithoutSeverity = useMemo(
-		() =>
-			Object.fromEntries(
+	const labelsWithoutSeverity = useMemo(() => {
+		if (labels) {
+			return Object.fromEntries(
 				Object.entries(labels).filter(([key]) => key !== 'severity'),
-			),
-		[labels],
-	);
+			);
+		}
+		return {};
+	}, [labels]);
 
 	return (
 		<div className="alert-info">
@@ -43,7 +44,7 @@ function AlertHeader({ alertDetails }: AlertHeaderProps): JSX.Element {
 					</div>
 				</div>
 				<div className="bottom-section">
-					{labels.severity && <AlertSeverity severity={labels.severity} />}
+					{labels?.severity && <AlertSeverity severity={labels.severity} />}
 
 					{/* // TODO(shaheer): Get actual data when we are able to get alert firing from state from API */}
 					{/* <AlertStatus
diff --git a/frontend/src/types/api/alerts/def.ts b/frontend/src/types/api/alerts/def.ts
index 24a357ee54b7..2ba3d7689ae7 100644
--- a/frontend/src/types/api/alerts/def.ts
+++ b/frontend/src/types/api/alerts/def.ts
@@ -48,7 +48,7 @@ export interface RuleCondition {
 	seasonality?: string;
 }
 export interface Labels {
-	[key: string]: string;
+	[key: string]: string | undefined;
 }
 
 export interface AlertRuleStats {
diff --git a/pkg/transition/migrate_common.go b/pkg/transition/migrate_common.go
index 4e00ebf563a0..1572f71a8012 100644
--- a/pkg/transition/migrate_common.go
+++ b/pkg/transition/migrate_common.go
@@ -366,7 +366,7 @@ func (mc *migrateCommon) createAggregations(ctx context.Context, queryData map[s
 			aggregation = map[string]any{
 				"metricName":       aggregateAttr["key"],
 				"temporality":      queryData["temporality"],
-				"timeAggregation":  aggregateOp,
+				"timeAggregation":  queryData["timeAggregation"],
 				"spaceAggregation": queryData["spaceAggregation"],
 			}
 			if reduceTo, ok := queryData["reduceTo"].(string); ok {