From 2c8c381ca7f63ef6b0ddb86a2f52cd3b5029ad36 Mon Sep 17 00:00:00 2001
From: Matt Westcott <matt@west.co.tt>
Date: Fri, 13 Jan 2023 01:31:48 +0000
Subject: [PATCH] Implement multiple choice UI for image chooser

---
 .../wagtailimages/chooser/results.html         | 18 ++++++++++++++----
 wagtail/images/views/chooser.py                |  8 ++++++++
 2 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/wagtail/images/templates/wagtailimages/chooser/results.html b/wagtail/images/templates/wagtailimages/chooser/results.html
index 2bc9d673e1..fb0bc093bb 100644
--- a/wagtail/images/templates/wagtailimages/chooser/results.html
+++ b/wagtail/images/templates/wagtailimages/chooser/results.html
@@ -7,10 +7,20 @@
     <ul class="listing horiz images chooser">
         {% for image in results %}
             <li>
-                <a data-chooser-modal-choice class="image-choice" title="{% if collections %}{{ image.collection.name }} » {% endif %}{{ image.title }}" href="{{ image.chosen_url }}">
-                    <div class="image">{% image image max-165x165 class="show-transparency" %}</div>
-                    <h3>{{ image.title|ellipsistrim:60 }}</h3>
-                </a>
+                {% if is_multiple_choice %}
+                    <a data-chooser-modal-choice class="image-choice" title="{% if collections %}{{ image.collection.name }} » {% endif %}{{ image.title }}" href="{{ image.chosen_url }}">
+                        <div class="image">{% image image max-165x165 class="show-transparency" %}</div>
+                    </a>
+                    <h3>
+                        <input type="checkbox" name="id" value="{{ image.id }}" title="{% blocktrans trimmed with title=image.title %}Select {{ title }}{% endblocktrans %}">
+                        {{ image.title|ellipsistrim:60 }}
+                    </h3>
+                {% else %}
+                    <a data-chooser-modal-choice class="image-choice" title="{% if collections %}{{ image.collection.name }} » {% endif %}{{ image.title }}" href="{{ image.chosen_url }}">
+                        <div class="image">{% image image max-165x165 class="show-transparency" %}</div>
+                        <h3>{{ image.title|ellipsistrim:60 }}</h3>
+                    </a>
+                {% endif %}
             </li>
         {% endfor %}
     </ul>
diff --git a/wagtail/images/views/chooser.py b/wagtail/images/views/chooser.py
index ca04b90323..539ceb31aa 100644
--- a/wagtail/images/views/chooser.py
+++ b/wagtail/images/views/chooser.py
@@ -14,6 +14,7 @@ from wagtail.admin.views.generic.chooser import (
     BaseChooseView,
     ChooseResultsViewMixin,
     ChooseViewMixin,
+    ChosenMultipleViewMixin,
     ChosenResponseMixin,
     ChosenViewMixin,
     CreateViewMixin,
@@ -156,6 +157,12 @@ class ImageChosenView(ChosenViewMixin, ImageChosenResponseMixin, View):
         return super().get(request, *args, pk, **kwargs)
 
 
+class ImageChosenMultipleView(ChosenMultipleViewMixin, ImageChosenResponseMixin, View):
+    def get(self, request, *args, **kwargs):
+        self.model = get_image_model()
+        return super().get(request, *args, **kwargs)
+
+
 class SelectFormatResponseMixin(PreserveURLParametersMixin):
     def render_select_format_response(self, image, form):
         action_url = self.append_preserved_url_parameters(
@@ -299,6 +306,7 @@ class ImageChooserViewSet(ChooserViewSet):
     choose_view_class = ImageChooseView
     choose_results_view_class = ImageChooseResultsView
     chosen_view_class = ImageChosenView
+    chosen_multiple_view_class = ImageChosenMultipleView
     create_view_class = ImageUploadView
     select_format_view_class = ImageSelectFormatView
     permission_policy = permission_policy