From 0ea2d6972f602f1786ce920f3e00e39a0e6bbadd Mon Sep 17 00:00:00 2001
From: Bogdan Matei <bogdan.matei@grafana.com>
Date: Tue, 25 Jun 2024 18:31:31 +0300
Subject: [PATCH] Scopes: Allow navigating to inner containers (#89676)

Scopes: Allow navigating to inner levels after selecting a scope
---
 .../dashboard-scene/scene/Scopes/ScopesScene.test.tsx      | 7 ++++---
 .../dashboard-scene/scene/Scopes/ScopesTreeLevel.tsx       | 2 --
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/public/app/features/dashboard-scene/scene/Scopes/ScopesScene.test.tsx b/public/app/features/dashboard-scene/scene/Scopes/ScopesScene.test.tsx
index 013ba8af965..60ed7d1aa2f 100644
--- a/public/app/features/dashboard-scene/scene/Scopes/ScopesScene.test.tsx
+++ b/public/app/features/dashboard-scene/scene/Scopes/ScopesScene.test.tsx
@@ -38,7 +38,6 @@ import {
   mocksScopes,
   queryAllDashboard,
   queryFiltersApply,
-  queryApplicationsClustersSlothClusterNorthTitle,
   queryApplicationsClustersTitle,
   queryApplicationsSlothPictureFactoryTitle,
   queryApplicationsSlothVoteTrackerTitle,
@@ -137,12 +136,14 @@ describe('ScopesScene', () => {
         expect(getFiltersInput().value).toBe('slothVoteTracker, slothPictureFactory, Cluster Index Helper');
       });
 
-      it("Can't navigate deeper than the level where scopes are selected", async () => {
+      it('Can select a node from an inner level', async () => {
         await userEvents.click(getFiltersInput());
         await userEvents.click(getApplicationsExpand());
         await userEvents.click(getApplicationsSlothVoteTrackerSelect());
         await userEvents.click(getApplicationsClustersExpand());
-        expect(queryApplicationsClustersSlothClusterNorthTitle()).not.toBeInTheDocument();
+        await userEvents.click(getApplicationsClustersSlothClusterNorthSelect());
+        await userEvents.click(getFiltersApply());
+        expect(getFiltersInput().value).toBe('slothClusterNorth');
       });
 
       it('Can select a node from an upper level', async () => {
diff --git a/public/app/features/dashboard-scene/scene/Scopes/ScopesTreeLevel.tsx b/public/app/features/dashboard-scene/scene/Scopes/ScopesTreeLevel.tsx
index 81209146af4..399472cfa00 100644
--- a/public/app/features/dashboard-scene/scene/Scopes/ScopesTreeLevel.tsx
+++ b/public/app/features/dashboard-scene/scene/Scopes/ScopesTreeLevel.tsx
@@ -36,7 +36,6 @@ export function ScopesTreeLevel({
 
   const scopeNames = scopes.map(({ scopeName }) => scopeName);
   const anyChildExpanded = childNodesArr.some(({ isExpanded }) => isExpanded);
-  const anyChildSelected = childNodesArr.some(({ linkId }) => linkId && scopeNames.includes(linkId!));
 
   const onQueryUpdate = useMemo(() => debounce(onNodeUpdate, 500), [onNodeUpdate]);
 
@@ -102,7 +101,6 @@ export function ScopesTreeLevel({
 
                   {childNode.isExpandable && (
                     <IconButton
-                      disabled={anyChildSelected && !childNode.isExpanded}
                       name={!childNode.isExpanded ? 'angle-right' : 'angle-down'}
                       aria-label={
                         childNode.isExpanded ? t('scopes.tree.collapse', 'Collapse') : t('scopes.tree.expand', 'Expand')