From 8115ee9e5564dc7d1901093b5f04d14021d7e30b Mon Sep 17 00:00:00 2001
From: Bogdan Chadkin <opensource@trysound.io>
Date: Wed, 11 Dec 2024 22:10:40 +0700
Subject: [PATCH] fix: show whole block tree to support radix components
 (#4555)

We decided to show whole block tree so clients could open popover or tab
content and edit text inside.

<img width="282" alt="image"
src="https://github.com/user-attachments/assets/36d872f2-15f5-4fd5-98aa-e3a644883cf1">
---
 .../features/navigator/navigator-tree.tsx      | 18 +++++++-----------
 1 file changed, 7 insertions(+), 11 deletions(-)

diff --git a/apps/builder/app/builder/features/navigator/navigator-tree.tsx b/apps/builder/app/builder/features/navigator/navigator-tree.tsx
index 606e18fa087b..9f47ba1ad52a 100644
--- a/apps/builder/app/builder/features/navigator/navigator-tree.tsx
+++ b/apps/builder/app/builder/features/navigator/navigator-tree.tsx
@@ -145,12 +145,14 @@ export const $flatTree = computed(
       if (instance.component === "Fragment") {
         isVisible = false;
       }
-      const parentComponent = visibleAncestors.at(-1)?.component;
       if (isContentMode) {
-        // hide everything except block and its children
+        // hide everything outside of block instances
+        const hasBlockAncestor = visibleAncestors.some(
+          (ancestor) => ancestor?.component === blockComponent
+        );
         if (
           instance.component !== blockComponent &&
-          parentComponent !== blockComponent
+          hasBlockAncestor === false
         ) {
           isVisible = false;
         }
@@ -171,14 +173,8 @@ export const $flatTree = computed(
         flatTree.push(treeItem);
       }
       const level = treeItem.visibleAncestors.length - 1;
-      // expand everything in content mode
-      if (isContentMode === false) {
-        if (
-          level > 0 &&
-          instance.children.some((child) => child.type === "id")
-        ) {
-          treeItem.isExpanded = expandedItems.has(selector.join());
-        }
+      if (level > 0 && instance.children.some((child) => child.type === "id")) {
+        treeItem.isExpanded = expandedItems.has(selector.join());
       }
       // always expand invisible items
       if (isVisible === false) {