From 5c2a344ce17058ca5c6c54df1f995816311c3916 Mon Sep 17 00:00:00 2001
From: Joey <90795735+joey-grafana@users.noreply.github.com>
Date: Tue, 25 Apr 2023 08:56:06 +0100
Subject: [PATCH] Traces: Order keys in span filter select (#66689)

* Order logs keys last

* Add tests
---
 .../SpanFilters/SpanFilters.test.tsx            | 17 +++++++++++++++++
 .../TracePageHeader/SpanFilters/SpanFilters.tsx | 15 ++++++++-------
 2 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/public/app/features/explore/TraceView/components/TracePageHeader/SpanFilters/SpanFilters.test.tsx b/public/app/features/explore/TraceView/components/TracePageHeader/SpanFilters/SpanFilters.test.tsx
index 857398e7739..eef40e507b1 100644
--- a/public/app/features/explore/TraceView/components/TracePageHeader/SpanFilters/SpanFilters.test.tsx
+++ b/public/app/features/explore/TraceView/components/TracePageHeader/SpanFilters/SpanFilters.test.tsx
@@ -151,6 +151,23 @@ describe('SpanFilters', () => {
     await selectAndCheckValue(user, tagValue, 'TagValue0');
   });
 
+  it('should order tag filters', async () => {
+    render(<SpanFiltersWithProps />);
+    const tagKey = screen.getByLabelText('Select tag key');
+
+    await user.click(tagKey);
+    jest.advanceTimersByTime(1000);
+    await waitFor(() => {
+      const container = screen.getByText('TagKey0').parentElement?.parentElement?.parentElement;
+      expect(container?.childNodes[0].textContent).toBe('ProcessKey0');
+      expect(container?.childNodes[1].textContent).toBe('ProcessKey1');
+      expect(container?.childNodes[2].textContent).toBe('TagKey0');
+      expect(container?.childNodes[3].textContent).toBe('TagKey1');
+      expect(container?.childNodes[4].textContent).toBe('LogKey0');
+      expect(container?.childNodes[5].textContent).toBe('LogKey1');
+    });
+  });
+
   it('should allow adding/removing tags', async () => {
     render(<SpanFiltersWithProps />);
     expect(screen.getAllByLabelText('Select tag key').length).toBe(1);
diff --git a/public/app/features/explore/TraceView/components/TracePageHeader/SpanFilters/SpanFilters.tsx b/public/app/features/explore/TraceView/components/TracePageHeader/SpanFilters/SpanFilters.tsx
index 829c1778fb5..504668a5105 100644
--- a/public/app/features/explore/TraceView/components/TracePageHeader/SpanFilters/SpanFilters.tsx
+++ b/public/app/features/explore/TraceView/components/TracePageHeader/SpanFilters/SpanFilters.tsx
@@ -112,7 +112,8 @@ export const SpanFilters = memo((props: SpanFilterProps) => {
 
   const getTagKeys = () => {
     if (!tagKeys) {
-      const keys: string[] = [];
+      let keys: string[] = [];
+      let logKeys: string[] = [];
 
       trace.spans.forEach((span) => {
         span.tags.forEach((tag) => {
@@ -124,18 +125,18 @@ export const SpanFilters = memo((props: SpanFilterProps) => {
         if (span.logs !== null) {
           span.logs.forEach((log) => {
             log.fields.forEach((field) => {
-              keys.push(field.key);
+              logKeys.push(field.key);
             });
           });
         }
       });
+      keys = uniq(keys).sort();
+      logKeys = uniq(logKeys).sort();
 
       setTagKeys(
-        uniq(keys)
-          .sort()
-          .map((name) => {
-            return toOption(name);
-          })
+        [...keys, ...logKeys].map((name) => {
+          return toOption(name);
+        })
       );
     }
   };