From 9b26b4930bcf1b95985a63e075576178ab89c6b4 Mon Sep 17 00:00:00 2001
From: ScreenTinker <hello@screentinker.com>
Date: Tue, 28 Apr 2026 15:51:02 -0500
Subject: [PATCH] Make breadcrumb a drop target for moving content out of
 folders
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Once inside a folder, the only drop targets shown were that folder's
own subfolders — no way to drag a file back up to root or to a parent
without opening the edit modal. Breadcrumb segments now accept content
drops: drop on 'All Content' to move to root, or onto a parent folder
name to move there. The edit modal still works for cross-branch moves.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 frontend/js/views/content-library.js | 29 ++++++++++++++++++++++++++++
 1 file changed, 29 insertions(+)

diff --git a/frontend/js/views/content-library.js b/frontend/js/views/content-library.js
index 2f22bd5..f6b4d60 100644
--- a/frontend/js/views/content-library.js
+++ b/frontend/js/views/content-library.js
@@ -246,6 +246,35 @@ async function loadContent() {
         state.currentFolderId = id || null;
         loadContent();
       });
+      // Make breadcrumb segments drop targets too — otherwise the only way to move
+      // a file out of a folder is via the edit modal. Dropping on "All Content"
+      // moves to root; dropping on a parent name moves there.
+      a.addEventListener('dragover', (e) => {
+        if (!e.dataTransfer.types.includes('text/content-id')) return;
+        e.preventDefault();
+        a.style.background = 'var(--primary)';
+        a.style.color = '#fff';
+        a.style.padding = '2px 8px';
+        a.style.borderRadius = '4px';
+      });
+      a.addEventListener('dragleave', () => {
+        a.style.background = '';
+        a.style.color = '';
+        a.style.padding = '';
+        a.style.borderRadius = '';
+      });
+      a.addEventListener('drop', async (e) => {
+        e.preventDefault();
+        a.style.background = ''; a.style.color = ''; a.style.padding = ''; a.style.borderRadius = '';
+        const contentId = e.dataTransfer.getData('text/content-id');
+        if (!contentId) return;
+        const targetFolderId = a.dataset.folderNav || null; // empty string = root
+        try {
+          await api.moveContent(contentId, targetFolderId);
+          showToast(targetFolderId ? 'Moved' : 'Moved to root', 'success');
+          loadContent();
+        } catch (err) { showToast(err.message, 'error'); }
+      });
     });
     const renameBtn = breadcrumb.querySelector('#renameFolderBtn');
     if (renameBtn) renameBtn.onclick = async () => {