From da041388610865247dfed6c0278ce42c7e4571b4 Mon Sep 17 00:00:00 2001
From: Ross <ross@xkjq.uk>
Date: Wed, 12 Nov 2025 21:23:41 +0000
Subject: [PATCH] Enhance bulk add groups form with crispy forms for improved
 styling and usability

---
 generic/forms.py                              | 27 +++++++++++++++++++
 .../examcollection_bulk_add_groups_form.html  | 18 +++++--------
 2 files changed, 33 insertions(+), 12 deletions(-)

diff --git a/generic/forms.py b/generic/forms.py
index acc489a2..34ea0f73 100755
--- a/generic/forms.py
+++ b/generic/forms.py
@@ -328,6 +328,33 @@ class ExamCollectionBulkAddGroupsForm(Form):
         self.fields["cid_user_groups"].widget.attrs["size"] = 8
         self.fields["user_user_groups"].widget.attrs["size"] = 8
 
+        # Crispy helper: render fields prettily in templates. We set form_tag=False
+        # because the HTMX partial includes the <form> tag with hx attributes.
+        try:
+            self.helper = FormHelper()
+            # render only the fields (the template contains the form element)
+            self.helper.form_tag = False
+            # use bootstrap5 templates if available in the project
+            self.helper.template_pack = "bootstrap5"
+            self.helper.form_class = "form-vertical"
+            self.helper.layout = Layout(
+                Div(
+                    Field("cid_user_groups", css_class="form-select", template="bootstrap5/layout/multi_select.html"),
+                    css_class="mb-3",
+                ),
+                Div(
+                    Field("user_user_groups", css_class="form-select", template="bootstrap5/layout/multi_select.html"),
+                    css_class="mb-3",
+                ),
+                Div(
+                    Field("exam_types", css_class="form-select"),
+                    css_class="mb-3",
+                ),
+            )
+        except Exception:
+            # If crispy isn't available for some reason, degrade gracefully.
+            self.helper = None
+
 
 class ExaminationForm(ModelForm):
     def __init__(self, *args, **kwargs):
diff --git a/generic/templates/generic/partials/examcollection_bulk_add_groups_form.html b/generic/templates/generic/partials/examcollection_bulk_add_groups_form.html
index 675185ab..eb74d261 100644
--- a/generic/templates/generic/partials/examcollection_bulk_add_groups_form.html
+++ b/generic/templates/generic/partials/examcollection_bulk_add_groups_form.html
@@ -1,17 +1,11 @@
+{% load crispy_forms_tags %}
 <form hx-post="{% url 'generic:exam_collection_bulk_add_groups' collection.pk %}" hx-target="#bulk-add-groups" hx-swap="innerHTML" class="bulk-add-groups-form">
     {% csrf_token %}
-    <div>
-        {{ form.cid_user_groups.label_tag }}<br/>
-        {{ form.cid_user_groups }}
-    </div>
-    <div>
-        {{ form.user_user_groups.label_tag }}<br/>
-        {{ form.user_user_groups }}
-    </div>
-    <div>
-        {{ form.exam_types.label_tag }}<br/>
-        {{ form.exam_types }}
-    </div>
+
+    {# Render fields with crispy. The form helper sets form_tag=False so the surrounding
+       <form> keeps the HTMX attributes while crispy renders nicely styled fields. #}
+    {{ form|crispy }}
+
     <div class="mt-2">
         <button type="submit" class="btn btn-primary btn-sm">Add groups</button>
         <button type="button" class="btn btn-secondary btn-sm" hx-get="{% url 'generic:examcollection_detail' collection.pk %}" hx-target="#bulk-add-groups" hx-swap="innerHTML">Cancel</button>