Refactor the choicejs code to single js file

HyphaApp · Jan 7, 2025 · d657275 · d657275
1 parent d58bac7
commit d657275
Show file tree

Hide file tree

Showing 10 changed files with 28 additions and 104 deletions.
diff --git a/hypha/apply/funds/templates/funds/application_base.html b/hypha/apply/funds/templates/funds/application_base.html
@@ -96,17 +96,6 @@ <h3>{% blocktrans %}Sorry this {{ page|verbose_name }} is not accepting applicat
     {% endif %}
     <script src="{% static 'js/multi-input-fields.js' %}"></script>
 
-    <script type="module">
-        import Choices from "{% static 'js/esm/choices.js-10-2-0.js' %}";
-
-        const selectElements = document.querySelectorAll('.js-choices');
-
-        selectElements.forEach(selectElement => {
-            new Choices(selectElement, {
-                shouldSort: false,
-                allowHTML: true,
-                removeItemButton: true,
-            });
-        });
-    </script>
+    <script src="{% static 'js/vendor/choices.min.js' %}"></script>
+    <script src="{% static 'js/choices-select.js' %}"></script>
 {% endblock %}
diff --git a/hypha/apply/funds/templates/funds/applicationsubmission_form.html b/hypha/apply/funds/templates/funds/applicationsubmission_form.html
@@ -54,17 +54,6 @@
         <script src="{% static 'js/form-group-toggle.js' %}"></script>
     {% endif %}
 
-    <script type="module">
-        import Choices from "{% static 'js/esm/choices.js-10-2-0.js' %}";
-
-        const selectElements = document.querySelectorAll('.js-choices');
-
-        selectElements.forEach(selectElement => {
-            new Choices(selectElement, {
-                shouldSort: false,
-                allowHTML: true,
-                removeItemButton: true,
-            });
-        });
-    </script>
+    <script src="{% static 'js/vendor/choices.min.js' %}"></script>
+    <script src="{% static 'js/choices-select.js' %}"></script>
 {% endblock %}
diff --git a/hypha/apply/projects/templates/application_projects/invoice_list.html b/hypha/apply/projects/templates/application_projects/invoice_list.html
@@ -39,17 +39,6 @@
     {{ filter.form.media.js }}
     <script src="{% static 'js/submission-filters.js' %}"></script>
     <script src="{% static 'js/batch-actions.js' %}"></script>
-    <script type="module">
-        import Choices from "{% static 'js/esm/choices.js-10-2-0.js' %}";
-
-        const selectElements = document.querySelectorAll('.js-choices');
-
-        selectElements.forEach(selectElement => {
-            new Choices(selectElement, {
-                shouldSort: false,
-                allowHTML: true,
-                removeItemButton: true,
-            });
-        });
-    </script>
+    <script src="{% static 'js/vendor/choices.min.js' %}"></script>
+    <script src="{% static 'js/choices-select.js' %}"></script>
 {% endblock %}
diff --git a/hypha/apply/projects/templates/application_projects/project_approval_form.html b/hypha/apply/projects/templates/application_projects/project_approval_form.html
@@ -77,17 +77,6 @@ <h5>{% trans "Proposal attachments" %}</h5>
         <script src="{% static 'js/form-group-toggle.js' %}"></script>
     {% endif %}
 
-    <script type="module">
-        import Choices from "{% static 'js/esm/choices.js-10-2-0.js' %}";
-
-        const selectElements = document.querySelectorAll('.js-choices');
-
-        selectElements.forEach(selectElement => {
-            new Choices(selectElement, {
-                shouldSort: false,
-                allowHTML: true,
-                removeItemButton: true,
-            });
-        });
-    </script>
+    <script src="{% static 'js/vendor/choices.min.js' %}"></script>
+    <script src="{% static 'js/choices-select.js' %}"></script>
 {% endblock %}
diff --git a/hypha/apply/projects/templates/application_projects/project_list.html b/hypha/apply/projects/templates/application_projects/project_list.html
@@ -37,17 +37,6 @@
 {% block extra_js %}
     {{ filter.form.media.js }}
     <script src="{% static 'js/submission-filters.js' %}"></script>
-    <script type="module">
-        import Choices from "{% static 'js/esm/choices.js-10-2-0.js' %}";
-
-        const selectElements = document.querySelectorAll('.js-choices');
-
-        selectElements.forEach(selectElement => {
-            new Choices(selectElement, {
-                shouldSort: false,
-                allowHTML: true,
-                removeItemButton: true,
-            });
-        });
-    </script>
+    <script src="{% static 'js/vendor/choices.min.js' %}"></script>
+    <script src="{% static 'js/choices-select.js' %}"></script>
 {% endblock %}
diff --git a/hypha/apply/projects/templates/application_projects/project_sow_form.html b/hypha/apply/projects/templates/application_projects/project_sow_form.html
@@ -74,17 +74,6 @@ <h5>{% trans "Proposal attachments" %}</h5>
         <script src="{% static 'js/form-group-toggle.js' %}"></script>
     {% endif %}
 
-    <script type="module">
-        import Choices from "{% static 'js/esm/choices.js-10-2-0.js' %}";
-
-        const selectElements = document.querySelectorAll('.js-choices');
-
-        selectElements.forEach(selectElement => {
-            new Choices(selectElement, {
-                shouldSort: false,
-                allowHTML: true,
-                removeItemButton: true,
-            });
-        });
-    </script>
+    <script src="{% static 'js/vendor/choices.min.js' %}"></script>
+    <script src="{% static 'js/choices-select.js' %}"></script>
 {% endblock %}
diff --git a/hypha/apply/projects/templates/application_projects/report_form.html b/hypha/apply/projects/templates/application_projects/report_form.html
@@ -79,17 +79,6 @@
 
 {% block extra_js %}
     <script src="{% static 'js/multi-input-fields.js' %}"></script>
-    <script type="module">
-        import Choices from "{% static 'js/esm/choices.js-10-2-0.js' %}";
-
-        const selectElements = document.querySelectorAll('.js-choices');
-
-        selectElements.forEach(selectElement => {
-            new Choices(selectElement, {
-                shouldSort: false,
-                allowHTML: true,
-                removeItemButton: true,
-            });
-        });
-    </script>
+    <script src="{% static 'js/vendor/choices.min.js' %}"></script>
+    <script src="{% static 'js/choices-select.js' %}"></script>
 {% endblock %}
diff --git a/hypha/apply/projects/templates/application_projects/reporting.html b/hypha/apply/projects/templates/application_projects/reporting.html
@@ -33,17 +33,6 @@
 {% block extra_js %}
     {{ filter.form.media.js }}
     <script src="{% static 'js/submission-filters.js' %}"></script>
-    <script type="module">
-        import Choices from "{% static 'js/esm/choices.js-10-2-0.js' %}";
-
-        const selectElements = document.querySelectorAll('.js-choices');
-
-        selectElements.forEach(selectElement => {
-            new Choices(selectElement, {
-                shouldSort: false,
-                allowHTML: true,
-                removeItemButton: true,
-            });
-        });
-    </script>
+    <script src="{% static 'js/vendor/choices.min.js' %}"></script>
+    <script src="{% static 'js/choices-select.js' %}"></script>
 {% endblock %}
diff --git a/hypha/static_src/javascript/choices-select.js b/hypha/static_src/javascript/choices-select.js
@@ -0,0 +1,10 @@
+const selectElements = document.querySelectorAll('.js-choices');
+
+selectElements.forEach(selectElement => {
+    // eslint-disable-next-line no-undef
+    new Choices(selectElement, {
+        shouldSort: false,
+        allowHTML: true,
+        removeItemButton: true,
+    });
+});
diff --git a/hypha/static_src/javascript/vendor/choices.min.js b/hypha/static_src/javascript/vendor/choices.min.js