From 080729058cff414664b9439398e4bc8f6e7bb1a4 Mon Sep 17 00:00:00 2001
From: Kirill Platonov <kirill@platonov.net>
Date: Mon, 30 May 2022 14:46:59 +0300
Subject: [PATCH 1/3] Fix file assignment for drag&drop in Dropzone

---
 app/assets/javascripts/polaris_view_components.js                | 1 +
 .../javascripts/polaris_view_components/dropzone_controller.js   | 1 +
 2 files changed, 2 insertions(+)

diff --git a/app/assets/javascripts/polaris_view_components.js b/app/assets/javascripts/polaris_view_components.js
index 701cef5e..78c0ff4a 100644
--- a/app/assets/javascripts/polaris_view_components.js
+++ b/app/assets/javascripts/polaris_view_components.js
@@ -441,6 +441,7 @@ class Dropzone extends Controller {
     this.dragging = false;
   }
   onDrop(e) {
+    this.inputTarget.files = e.dataTransfer.files;
     this.stopEvent(e);
     if (this.disabled) return;
     this.dragging = false;
diff --git a/app/assets/javascripts/polaris_view_components/dropzone_controller.js b/app/assets/javascripts/polaris_view_components/dropzone_controller.js
index 8b8f02a6..d8f6d329 100644
--- a/app/assets/javascripts/polaris_view_components/dropzone_controller.js
+++ b/app/assets/javascripts/polaris_view_components/dropzone_controller.js
@@ -139,6 +139,7 @@ export default class extends Controller {
   }
 
   onDrop (e) {
+    this.inputTarget.files = e.dataTransfer.files
     this.stopEvent(e)
     if (this.disabled) return
 

From 6ff1060f1f5ab56b085d8c87c247d9f596074aae Mon Sep 17 00:00:00 2001
From: Dan Gamble <dan@dangamble.co.uk>
Date: Sat, 4 Jun 2022 10:09:32 +0100
Subject: [PATCH 2/3] Ensure dropzone input always has accepted files

---
 .../javascripts/polaris_view_components.js     | 12 ++++++++++--
 .../dropzone_controller.js                     | 18 ++++++++++++++++--
 2 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/polaris_view_components.js b/app/assets/javascripts/polaris_view_components.js
index 78c0ff4a..5f6c95f7 100644
--- a/app/assets/javascripts/polaris_view_components.js
+++ b/app/assets/javascripts/polaris_view_components.js
@@ -361,11 +361,11 @@ class Dropzone extends Controller {
     size: String
   };
   files=[];
-  acceptedFiles=[];
   rejectedFiles=[];
   _dragging=false;
   dragTargets=[];
   previewRendered=false;
+  _acceptedFiles=[];
   _size="large";
   connect() {
     document.body.addEventListener("click", this.onExternalTriggerClick);
@@ -441,7 +441,6 @@ class Dropzone extends Controller {
     this.dragging = false;
   }
   onDrop(e) {
-    this.inputTarget.files = e.dataTransfer.files;
     this.stopEvent(e);
     if (this.disabled) return;
     this.dragging = false;
@@ -687,6 +686,15 @@ class Dropzone extends Controller {
     sizeClassesToRemove.forEach((className => this.element.classList.remove(className)));
     this.element.classList.add(this.getSizeClass(val));
   }
+  get acceptedFiles() {
+    return this._acceptedFiles;
+  }
+  set acceptedFiles(val) {
+    this._acceptedFiles = val;
+    const list = new DataTransfer;
+    val.forEach((file => list.items.add(file)));
+    this.inputTarget.files = list.files;
+  }
 }
 
 function fileAccepted(file, accept) {
diff --git a/app/assets/javascripts/polaris_view_components/dropzone_controller.js b/app/assets/javascripts/polaris_view_components/dropzone_controller.js
index d8f6d329..83a0cce1 100644
--- a/app/assets/javascripts/polaris_view_components/dropzone_controller.js
+++ b/app/assets/javascripts/polaris_view_components/dropzone_controller.js
@@ -34,11 +34,12 @@ export default class extends Controller {
   }
 
   files = []
-  acceptedFiles = []
   rejectedFiles = []
   _dragging = false
   dragTargets = []
   previewRendered = false
+
+  _acceptedFiles = []
   _size = 'large'
 
   connect () {
@@ -139,7 +140,6 @@ export default class extends Controller {
   }
 
   onDrop (e) {
-    this.inputTarget.files = e.dataTransfer.files
     this.stopEvent(e)
     if (this.disabled) return
 
@@ -453,6 +453,20 @@ export default class extends Controller {
 
     this.element.classList.add(this.getSizeClass(val))
   }
+
+  get acceptedFiles () {
+    return this._acceptedFiles
+  }
+
+  set acceptedFiles (val) {
+    this._acceptedFiles = val
+
+    const list = new DataTransfer()
+
+    val.forEach(file => list.items.add(file))
+
+    this.inputTarget.files = list.files
+  }
 }
 
 export function fileAccepted (file, accept) {

From 4abd51cf8ce0890ec61c9ce2fa32ebee7bf3e0d2 Mon Sep 17 00:00:00 2001
From: Kirill Platonov <kirill@platonov.net>
Date: Sat, 4 Jun 2022 13:35:59 +0300
Subject: [PATCH 3/3] Add test for Dropzone file submission

---
 test/system/dropzone_component_test.rb | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/test/system/dropzone_component_test.rb b/test/system/dropzone_component_test.rb
index 99ee0431..c0671d79 100644
--- a/test/system/dropzone_component_test.rb
+++ b/test/system/dropzone_component_test.rb
@@ -18,6 +18,19 @@ def test_file_upload
     end
   end
 
+  def test_submiting_file
+    with_preview("rails/form_builder_component/dropzone")
+
+    within first("form") do
+      find(".Polaris-DropZone").drop(fixture_file("file.txt"))
+      assert_selector ".Polaris-DropZone__Preview > .Polaris-Stack > .Polaris-Stack__Item", count: 1
+
+      click_on "Submit"
+    end
+
+    assert_text "File: file.txt"
+  end
+
   def test_image_upload
     with_preview("forms/dropzone_component/with_image_upload")