From 967aa16f21b0b7d9b07578097f7910150fbc1fee Mon Sep 17 00:00:00 2001
From: Vishal Sharma <makeavish786@gmail.com>
Date: Sun, 5 May 2024 09:03:31 +0530
Subject: [PATCH] feat: sort tags and events in trace detail (#4962)

---
 .../TraceDetail/SelectedSpanDetails/Events/index.tsx     | 9 ++++++++-
 .../TraceDetail/SelectedSpanDetails/Tags/index.tsx       | 5 +++--
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/frontend/src/container/TraceDetail/SelectedSpanDetails/Events/index.tsx b/frontend/src/container/TraceDetail/SelectedSpanDetails/Events/index.tsx
index 1f6cb610be..7a1e8ed0e2 100644
--- a/frontend/src/container/TraceDetail/SelectedSpanDetails/Events/index.tsx
+++ b/frontend/src/container/TraceDetail/SelectedSpanDetails/Events/index.tsx
@@ -13,11 +13,18 @@ function Events({
 		return <Typography>No events data in selected span</Typography>;
 	}
 
+	const sortedTraceEvents = events.sort((a, b) => {
+		// Handle undefined names by treating them as empty strings
+		const nameA = a.name || '';
+		const nameB = b.name || '';
+		return nameA.localeCompare(nameB);
+	});
+
 	return (
 		<ErrorTag
 			onToggleHandler={onToggleHandler}
 			setText={setText}
-			event={events}
+			event={sortedTraceEvents}
 			firstSpanStartTime={firstSpanStartTime}
 		/>
 	);
diff --git a/frontend/src/container/TraceDetail/SelectedSpanDetails/Tags/index.tsx b/frontend/src/container/TraceDetail/SelectedSpanDetails/Tags/index.tsx
index 529f538296..62029861a5 100644
--- a/frontend/src/container/TraceDetail/SelectedSpanDetails/Tags/index.tsx
+++ b/frontend/src/container/TraceDetail/SelectedSpanDetails/Tags/index.tsx
@@ -41,8 +41,9 @@ function Tags({
 		setSearchText(value);
 	};
 
-	const filteredTags = tags.filter((tag) => tag.key.includes(searchText));
-
+	const filteredTags = tags
+		.filter((tag) => tag.key.includes(searchText))
+		.sort((a, b) => a.key.localeCompare(b.key));
 	if (tags.length === 0) {
 		return <Typography>No tags in selected span</Typography>;
 	}