diff --git a/packages/web/src/appobj/AppObjectGroup.svelte b/packages/web/src/appobj/AppObjectGroup.svelte
index e7f79160..bf52001c 100644
--- a/packages/web/src/appobj/AppObjectGroup.svelte
+++ b/packages/web/src/appobj/AppObjectGroup.svelte
@@ -35,19 +35,17 @@
       return res;
     });
   }
-</script>
 
-<div
-  class="group"
-  on:click={() => (isExpanded = !isExpanded)}
-  on:drop={e => {
+  function handleDrop(e) {
     var data = e.dataTransfer.getData('app_object_drag_data');
     if (data && onDropOnGroup) {
       e.stopPropagation();
       onDropOnGroup(data, group);
     }
-  }}
->
+  }
+</script>
+
+<div class="group" on:click={() => (isExpanded = !isExpanded)} on:drop={handleDrop}>
   <span class="expand-icon">
     <FontIcon icon={groupIconFunc(isExpanded)} />
   </span>
@@ -65,18 +63,20 @@
     </div>
   {/if}
 
-  {#each items as item}
-    <AppObjectListItem
-      isHidden={!item.isMatched}
-      {...$$restProps}
-      {module}
-      data={item.data}
-      {checkedObjectsStore}
-      on:objectClick
-      {disableContextMenu}
-      {passProps}
-    />
-  {/each}
+  <div on:drop={handleDrop}>
+    {#each items as item}
+      <AppObjectListItem
+        isHidden={!item.isMatched}
+        {...$$restProps}
+        {module}
+        data={item.data}
+        {checkedObjectsStore}
+        on:objectClick
+        {disableContextMenu}
+        {passProps}
+      />
+    {/each}
+  </div>
 {/if}
 
 <style>