fix: navigate to home page when undo page creation (#4995)

Fixes #4993

Author: TrySound

apps/builder/app/shared/awareness.ts

@@ -99,7 +99,7 @@ export const getInstancePath = (
   instances: Instances,
   virtualInstances?: Instances,
   temporaryInstances?: Instances
-): InstancePath => {
+): undefined | InstancePath => {
   const instancePath: InstancePath = [];
   for (let index = 0; index < instanceSelector.length; index += 1) {
     const instanceId = instanceSelector[index];
@@ -116,6 +116,11 @@ export const getInstancePath = (
       instanceSelector: instanceSelector.slice(index),
     });
   }
+  // all consuming code expect at least one instance to be selected
+  // though it is possible to get empty array when undo created page
+  if (instancePath.length === 0) {
+    return undefined;
+  }
   return instancePath;
 };
 

apps/builder/app/shared/instance-utils.test.tsx

@@ -1505,3 +1505,7 @@ describe("find closest insertable", () => {
     expect(findClosestInsertable(newListItemFragment)).toEqual(undefined);
   });
 });
+
+test("get undefined instead of instance path when no instances found", () => {
+  expect(getInstancePath(["boxId"], new Map())).toEqual(undefined);
+});

apps/builder/app/shared/instance-utils.ts

@@ -315,6 +315,9 @@ export const insertWebstudioFragmentAt = (
       insertable.parentSelector,
       data.instances
     );
+    if (instancePath === undefined) {
+      return;
+    }
     const { newInstanceIds } = insertWebstudioFragmentCopy({
       data,
       fragment,
@@ -432,8 +435,11 @@ export const reparentInstance = (
 
 export const deleteInstanceMutable = (
   data: Omit<WebstudioData, "pages">,
-  instancePath: InstancePath
+  instancePath: undefined | InstancePath
 ) => {
+  if (instancePath === undefined) {
+    return false;
+  }
   const {
     instances,
     props,

apps/builder/app/shared/pages/use-switch-page.ts

@@ -109,6 +109,19 @@ export const useSyncPageUrl = () => {
       })
     );
   }, [builderMode, navigate, page, pageHash]);
+
+  useEffect(() => {
+    return $selectedPage.subscribe((page) => {
+      // switch to home page when current one does not exist
+      // possible when undo creating page
+      if (page === undefined) {
+        const pages = $pages.get();
+        if (pages) {
+          selectPage(pages.homePage.id);
+        }
+      }
+    });
+  });
 };
 
 /**