diff --git a/packages/client/src/components/Component.svelte b/packages/client/src/components/Component.svelte
index 6192004b42..5e02e345d4 100644
--- a/packages/client/src/components/Component.svelte
+++ b/packages/client/src/components/Component.svelte
@@ -174,7 +174,7 @@
 
   // Drag and drop helper tags
   $: draggable = interactive && !isLayout && !isScreen
-  $: droppable = interactive
+  $: droppable = interactive && !isLayout && !isScreen
   $: dropInside = interactive && definition?.hasChildren && !children.length
 </script>
 
diff --git a/packages/client/src/components/preview/DNDHandler.svelte b/packages/client/src/components/preview/DNDHandler.svelte
index 2437386929..90e2a55ca4 100644
--- a/packages/client/src/components/preview/DNDHandler.svelte
+++ b/packages/client/src/components/preview/DNDHandler.svelte
@@ -105,9 +105,14 @@
     const element = e.target.closest("[data-type='component']")
     if (
       element &&
-      element.dataset.droppable &&
+      element.dataset.droppable === "true" &&
       element.dataset.id !== dragInfo.target
     ) {
+      // Do nothing if this is the same target
+      if (element.dataset.id === dropInfo?.target) {
+        return
+      }
+
       // Ensure the dragging flag is always set.
       // There's a bit of a race condition between the app reinitialisation
       // after selecting the DND component and setting this the first time