From cc342bbd1c291a1b17c1698437899b3515d5b2fc Mon Sep 17 00:00:00 2001
From: ayaan-qadri <develop.ayaan@gmail.com>
Date: Wed, 13 Nov 2024 19:40:41 +0530
Subject: [PATCH] Adopt ZoneController (w-zone) in images/documents add views

---
 wagtail/documents/templates/wagtaildocs/multiple/add.html | 8 +++++++-
 wagtail/images/templates/wagtailimages/multiple/add.html  | 8 +++++++-
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/wagtail/documents/templates/wagtaildocs/multiple/add.html b/wagtail/documents/templates/wagtaildocs/multiple/add.html
index 2b2becfd51..dcab9aa31d 100644
--- a/wagtail/documents/templates/wagtaildocs/multiple/add.html
+++ b/wagtail/documents/templates/wagtaildocs/multiple/add.html
@@ -10,7 +10,13 @@
 {% endblock %}
 
 {% block main_content %}
-    <div class="drop-zone w-mt-8">
+    <div
+        class="drop-zone w-mt-8"
+        data-controller="w-zone"
+        data-action="dragover@document->w-zone#noop:prevent drop@document->w-zone#noop:prevent dragover->w-zone#activate drop->w-zone#deactivate dragleave->w-zone#deactivate dragend->w-zone#deactivate"
+        data-w-zone-active-class="hovered"
+        data-w-zone-delay-value="10"
+    >
         <p>{% trans "Drag and drop documents into this area to upload immediately." %}</p>
         <p>{{ help_text }}</p>
 
diff --git a/wagtail/images/templates/wagtailimages/multiple/add.html b/wagtail/images/templates/wagtailimages/multiple/add.html
index 0fb1c6574c..e7accfb354 100644
--- a/wagtail/images/templates/wagtailimages/multiple/add.html
+++ b/wagtail/images/templates/wagtailimages/multiple/add.html
@@ -10,7 +10,13 @@
 {% endblock %}
 
 {% block main_content %}
-    <div class="drop-zone w-mt-8">
+    <div
+        class="drop-zone w-mt-8"
+        data-controller="w-zone"
+        data-action="dragover@document->w-zone#noop:prevent drop@document->w-zone#noop:prevent dragover->w-zone#activate drop->w-zone#deactivate dragleave->w-zone#deactivate dragend->w-zone#deactivate"
+        data-w-zone-active-class="hovered"
+        data-w-zone-delay-value="10"
+    >
         <p>{% trans "Drag and drop images into this area to upload immediately." %}</p>
         <p>{{ help_text }}</p>