From 7d111f44280abbb413815bb49deb93274dc01c3f Mon Sep 17 00:00:00 2001
From: Bogdan Chadkin <opensource@trysound.io>
Date: Fri, 18 Oct 2024 14:16:18 +0300
Subject: [PATCH] fix: prevent failing navigator when instances are
 inconsistent (#4303)

Users somehow make instances tree inconsistent. For example deleting
instances does not delete id from parent children.

I still have not idea how to reproduce this but we need to stop failing
users with broken state. Here just logged into console instead of
throwing error.
---
 .../panels/navigator/navigator-tree.tsx            | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/apps/builder/app/builder/features/sidebar-left/panels/navigator/navigator-tree.tsx b/apps/builder/app/builder/features/sidebar-left/panels/navigator/navigator-tree.tsx
index 63144d4960da..4eed08c82d6a 100644
--- a/apps/builder/app/builder/features/sidebar-left/panels/navigator/navigator-tree.tsx
+++ b/apps/builder/app/builder/features/sidebar-left/panels/navigator/navigator-tree.tsx
@@ -106,7 +106,9 @@ const $flatTree = computed(
     ) => {
       const instance = instances.get(instanceId);
       if (instance === undefined) {
-        throw Error("Unknown instance");
+        // log instead of failing navigator tree
+        console.error(`Unknown instance ${instanceId}`);
+        return;
       }
       const propValues = propValuesByInstanceSelector.get(
         JSON.stringify(selector)
@@ -149,7 +151,7 @@ const $flatTree = computed(
               const child = instance.children[index];
               if (child.type === "id") {
                 const isLastChild = index === instance.children.length - 1;
-                lastItem = traverse(
+                const lastDescendentItem = traverse(
                   child.value,
                   [
                     child.value,
@@ -165,6 +167,9 @@ const $flatTree = computed(
                   level + 2,
                   index
                 );
+                if (lastDescendentItem) {
+                  lastItem = lastDescendentItem;
+                }
               }
             }
           });
@@ -174,7 +179,7 @@ const $flatTree = computed(
           const child = instance.children[index];
           if (child.type === "id") {
             const isLastChild = index === instance.children.length - 1;
-            lastItem = traverse(
+            const lastDescendentItem = traverse(
               child.value,
               [child.value, ...selector],
               isHidden,
@@ -183,6 +188,9 @@ const $flatTree = computed(
               level + 1,
               index
             );
+            if (lastDescendentItem) {
+              lastItem = lastDescendentItem;
+            }
           }
         }
       }