From d9d227ec4d181e4a43626435e9bf1f3db8747fa0 Mon Sep 17 00:00:00 2001
From: Bogdan Matei <bogdan.matei@grafana.com>
Date: Wed, 5 Nov 2025 14:38:31 +0200
Subject: [PATCH] Dashboard: Hide add variable button in edit views (#113438)

---
 .../dashboard-scene/scene/VariableControls.tsx  |  6 +-----
 .../scene/VariableControlsAddButton.tsx         | 17 ++++++++++++-----
 2 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/public/app/features/dashboard-scene/scene/VariableControls.tsx b/public/app/features/dashboard-scene/scene/VariableControls.tsx
index 45c48610f1a..f62d8b06c41 100644
--- a/public/app/features/dashboard-scene/scene/VariableControls.tsx
+++ b/public/app/features/dashboard-scene/scene/VariableControls.tsx
@@ -27,11 +27,7 @@ export function VariableControls({ dashboard }: { dashboard: DashboardScene }) {
         .map((variable) => (
           <VariableValueSelectWrapper key={variable.state.key} variable={variable} />
         ))}
-      {config.featureToggles.dashboardNewLayouts ? (
-        <div className="dashboard-canvas-add-button">
-          <AddVariableButton dashboard={dashboard} />
-        </div>
-      ) : null}
+      {config.featureToggles.dashboardNewLayouts ? <AddVariableButton dashboard={dashboard} /> : null}
     </>
   );
 }
diff --git a/public/app/features/dashboard-scene/scene/VariableControlsAddButton.tsx b/public/app/features/dashboard-scene/scene/VariableControlsAddButton.tsx
index 9d20b740030..8bdabd397d1 100644
--- a/public/app/features/dashboard-scene/scene/VariableControlsAddButton.tsx
+++ b/public/app/features/dashboard-scene/scene/VariableControlsAddButton.tsx
@@ -9,7 +9,7 @@ import { DashboardInteractions } from '../utils/interactions';
 import { DashboardScene } from './DashboardScene';
 
 export function AddVariableButton({ dashboard }: { dashboard: DashboardScene }) {
-  const { isEditing } = dashboard.useState();
+  const { editview, editPanel, isEditing, viewPanel } = dashboard.useState();
 
   const handlePointerDown: PointerEventHandler = useCallback(
     (evt) => {
@@ -20,13 +20,20 @@ export function AddVariableButton({ dashboard }: { dashboard: DashboardScene })
     [dashboard]
   );
 
-  if (!isEditing) {
+  // Hide the button if:
+  // - the dashboard is not in edit mode
+  // - the dashboard is in an edit view mode
+  // - the dashboard is in a view panel mode
+  // - the dashboard is in an edit panel mode
+  if (!isEditing || !!editview || !!viewPanel || !!editPanel) {
     return null;
   }
 
   return (
-    <Button icon="plus" variant="primary" fill="text" onPointerDown={handlePointerDown}>
-      <Trans i18nKey="dashboard-scene.variable-controls.add-variable">Add variable</Trans>
-    </Button>
+    <div className="dashboard-canvas-add-button">
+      <Button icon="plus" variant="primary" fill="text" onPointerDown={handlePointerDown}>
+        <Trans i18nKey="dashboard-scene.variable-controls.add-variable">Add variable</Trans>
+      </Button>
+    </div>
   );
 }