From eb3786038894534b9ba489807e30b8e7dc062955 Mon Sep 17 00:00:00 2001
From: Aleksandar Petrov <8142643+aleks-p@users.noreply.github.com>
Date: Mon, 12 Jan 2026 16:58:47 -0400
Subject: [PATCH] Improve layout

---
 .../grafana-flamegraph/src/FlameGraphHeader.tsx   | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/packages/grafana-flamegraph/src/FlameGraphHeader.tsx b/packages/grafana-flamegraph/src/FlameGraphHeader.tsx
index 6684f55284f..6ddc1bea6e3 100644
--- a/packages/grafana-flamegraph/src/FlameGraphHeader.tsx
+++ b/packages/grafana-flamegraph/src/FlameGraphHeader.tsx
@@ -130,15 +130,9 @@ const FlameGraphHeader = ({
             aria-label={'Reset focus and sandwich state'}
           />
         )}
+        {extraHeaderElements && <div className={styles.extraElements}>{extraHeaderElements}</div>}
         {selectedView === SelectedView.Both ? (
           <>
-            <RadioButtonGroup<ViewMode>
-              size="sm"
-              options={viewModeOptions}
-              value={viewMode}
-              onChange={setViewMode}
-              className={styles.buttonSpacing}
-            />
             {viewMode === ViewMode.Single && (
               <RadioButtonGroup<PaneView>
                 size="sm"
@@ -148,6 +142,12 @@ const FlameGraphHeader = ({
                 className={styles.buttonSpacing}
               />
             )}
+            <RadioButtonGroup<ViewMode>
+              size="sm"
+              options={viewModeOptions}
+              value={viewMode}
+              onChange={setViewMode}
+            />
           </>
         ) : (
           <RadioButtonGroup<SelectedView>
@@ -157,7 +157,6 @@ const FlameGraphHeader = ({
             onChange={setSelectedView}
           />
         )}
-        {extraHeaderElements && <div className={styles.extraElements}>{extraHeaderElements}</div>}
       </div>
     </div>
   );