From 8ddc6bd58034af99334fc175fdc277486a3bb010 Mon Sep 17 00:00:00 2001
From: Anurag Vasanwala <75766877+AnuragVasanwala@users.noreply.github.com>
Date: Wed, 15 Nov 2023 17:12:05 +0530
Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Trigger=20`useStory`=20via?=
 =?UTF-8?q?=20`useLayout`=20by=20changing=20LayerName=20when=20group=20is?=
 =?UTF-8?q?=20undefined?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/panels/layer/groupLayer.js    | 16 +++++++++++++++-
 .../components/panels/layer/groupLayerActions.js | 15 ++++++++++++++-
 2 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/packages/story-editor/src/components/panels/layer/groupLayer.js b/packages/story-editor/src/components/panels/layer/groupLayer.js
index 052229e1d300..f007e22ea297 100644
--- a/packages/story-editor/src/components/panels/layer/groupLayer.js
+++ b/packages/story-editor/src/components/panels/layer/groupLayer.js
@@ -78,7 +78,21 @@ function GroupLayer({ groupId }) {
     })
   );
 
-  const { name, isLocked, isCollapsed } = groups[groupId];
+  const DEFAULT_NAME = 'Undefined Layer';
+  const DEFAULT_IS_LOCKED = false;
+  const DEFAULT_IS_COLLAPSED = false;
+
+  // Destructuring with default values in case groups[groupId] is undefined
+  let {
+    name = DEFAULT_NAME,
+    isLocked = DEFAULT_IS_LOCKED,
+    isCollapsed = DEFAULT_IS_COLLAPSED,
+  } = {};
+
+  // Check if groups and groups[groupId] exist before destructuring
+  if (groups && groups[groupId]) {
+    ({ name, isLocked, isCollapsed } = groups[groupId]);
+  }
 
   const { isSelected, handleClick } = useGroupSelection(groupId);
 
diff --git a/packages/story-editor/src/components/panels/layer/groupLayerActions.js b/packages/story-editor/src/components/panels/layer/groupLayerActions.js
index af54d78b5f76..0e8163d2b726 100644
--- a/packages/story-editor/src/components/panels/layer/groupLayerActions.js
+++ b/packages/story-editor/src/components/panels/layer/groupLayerActions.js
@@ -49,7 +49,20 @@ function GroupLayerActions({ groupId }) {
     ),
   }));
 
-  const group = groups[groupId];
+  const DEFAULT_NAME = 'Undefined Layer';
+  const DEFAULT_IS_LOCKED = false;
+  const DEFAULT_IS_COLLAPSED = false;
+
+  let group = {
+    name: DEFAULT_NAME,
+    isLocked: DEFAULT_IS_LOCKED,
+    isCollapsed: DEFAULT_IS_COLLAPSED,
+  };
+
+  if (groups && groups[groupId]) {
+    group = groups[groupId];
+  }
+
   const allLayersHidden = groupLayers.every((layer) => layer.isHidden);
 
   const visibilityTitle = allLayersHidden