fix: initialize dropzoneSelector inside inline formsets in a Django 4.1 compatible way (#1431)

* fix: initialize dropzoneSelector inside inline formsets in a Django 4.1 compatible way

* fix: double-check that ev.detail exists

* chore: drop support for Django < 1.9 in the dropzone init handler

Author: mbi

filer/static/filer/js/addons/dropzone.init.js

@@ -160,18 +160,31 @@ djQuery(function ($) {
             Dropzone.autoDiscover = false;
         }
         dropzones.each(createDropzone);
-        // window.__admin_utc_offset__ is used as canary to detect Django 1.8
-        // There is no way to feature detect the new behavior implemented in Django 1.9
-        if (!window.__admin_utc_offset__) {
-            $(document).on('formset:added', function (ev, row) {
+
+        // Handle initialization of the dropzone on dynamic formsets (i.e. Django admin inlines)
+        $(document).on('formset:added', function (ev, row) {
+            if(ev.detail && ev.detail.formsetName) {
+                /*
+                    Django 4.1 changed the event type being fired when adding
+                    a new formset from a jQuery to a vanilla JavaScript event.
+                    https://docs.djangoproject.com/en/4.1/ref/contrib/admin/javascript/
+
+                    In this case we find the newly added row and initialize the
+                    dropzone on any dropzoneSelector on that row.
+                */
+                let rowIdx = parseInt(
+                    document.getElementById(
+                        'id_' + event.detail.formsetName + '-TOTAL_FORMS'
+                    ).value, 10
+                ) - 1;
+                let row_ = document.getElementById(event.detail.formsetName + '-' + rowIdx);
+                var dropzones = $(row_).find(dropzoneSelector)
+
+            } else {
                 var dropzones = $(row).find(dropzoneSelector);
-                dropzones.each(createDropzone);
-            });
-        } else {
-            $('.add-row a').on('click', function () {
-                var dropzones = $(dropzoneSelector);
-                dropzones.each(createDropzone);
-            });
-        }
+            }
+
+            dropzones.each(createDropzone);
+        });
     }
 });