From 1bd001ec9a5cb556e42376c5dc53aa8030869628 Mon Sep 17 00:00:00 2001
From: Till JS <tills95@gmail.com>
Date: Fri, 3 Apr 2026 13:11:58 +0200
Subject: [PATCH] fix(manacore/web): restrict page drag to handle only, allow
 item DnD

Page reorder drag now only starts from the drag-handle icon, not from
anywhere in the page. This allows dragSource on list items (tasks,
events, contacts) to work without being intercepted by page reorder.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../src/lib/components/page-carousel/PageCarousel.svelte   | 7 ++++++-
 .../web/src/lib/components/page-carousel/PageShell.svelte  | 2 +-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/apps/manacore/apps/web/src/lib/components/page-carousel/PageCarousel.svelte b/apps/manacore/apps/web/src/lib/components/page-carousel/PageCarousel.svelte
index 665fb75d3..1dbf8edcd 100644
--- a/apps/manacore/apps/web/src/lib/components/page-carousel/PageCarousel.svelte
+++ b/apps/manacore/apps/web/src/lib/components/page-carousel/PageCarousel.svelte
@@ -52,6 +52,12 @@
 	let dragId = $state<string | null>(null);
 
 	function handleDragStart(e: DragEvent, id: string) {
+		// Only allow page reorder drag from the drag-handle, not from items inside the page
+		const target = e.target as HTMLElement;
+		if (!target.closest('.drag-handle')) {
+			e.preventDefault();
+			return;
+		}
 		dragId = id;
 		if (e.dataTransfer) {
 			e.dataTransfer.effectAllowed = 'move';
@@ -94,7 +100,6 @@
 			<div
 				class="page-drag-wrapper"
 				class:dragging={dragId === p.id}
-				draggable={true}
 				ondragstart={(e) => handleDragStart(e, p.id)}
 				ondragover={handleDragOver}
 				ondrop={(e) => handleDrop(e, p.id)}
diff --git a/apps/manacore/apps/web/src/lib/components/page-carousel/PageShell.svelte b/apps/manacore/apps/web/src/lib/components/page-carousel/PageShell.svelte
index 1c6ec608a..102343467 100644
--- a/apps/manacore/apps/web/src/lib/components/page-carousel/PageShell.svelte
+++ b/apps/manacore/apps/web/src/lib/components/page-carousel/PageShell.svelte
@@ -114,7 +114,7 @@
 		: ''}"
 >
 	<div class="drag-handle-bar">
-		<span class="drag-handle"><DotsSixVertical size={14} /></span>
+		<span class="drag-handle" draggable="true"><DotsSixVertical size={14} /></span>
 	</div>
 
 	<!-- Header -->