From 12135b5c227a2bfc9b8cd6c32b1c8d31ff83e833 Mon Sep 17 00:00:00 2001
From: Sli <antoine@bartuccio.fr>
Date: Thu, 20 Aug 2026 17:29:35 +0200
Subject: [PATCH 1/3] Fix star width and rewrite star widget with nice hovering

---
 pedagogy/static/pedagogy/css/pedagogy.scss | 43 ++++++++--
 pedagogy/templates/pedagogy/starlist.jinja | 92 +++++++++-------------
 2 files changed, 77 insertions(+), 58 deletions(-)

diff --git a/pedagogy/static/pedagogy/css/pedagogy.scss b/pedagogy/static/pedagogy/css/pedagogy.scss
index d7dc424a..eeacedfe 100644
--- a/pedagogy/static/pedagogy/css/pedagogy.scss
+++ b/pedagogy/static/pedagogy/css/pedagogy.scss
@@ -1,3 +1,4 @@
+@import "core/static/core/devices";
 @import "core/static/core/colors";
 
 
@@ -7,10 +8,6 @@ $pedagogy-hover-blue: #0e97ce;
 $pedagogy-light-blue: #caf0ff;
 $pedagogy-white-text: #f0f0f0;
 
-$small-devices: 576px;
-$medium-devices: 768px;
-$large-devices: 992px;
-
 .pedagogy {
   &.star-not-checked {
     color: #f7f7f7;
@@ -256,7 +253,7 @@ $large-devices: 992px;
 
     .ue-details-container {
       display: grid;
-      grid-template-columns: 150px 100px auto;
+      grid-template-columns: 150px 130px auto;
       grid-template-rows: 156px 1fr;
       grid-template-areas:
       "grade grade-stars ue-infos"
@@ -523,4 +520,40 @@ details.accordion>.accordion-content {
   background-color: $white-color;
   border-color: $pedagogy-orange;
   border-right: none;
+}
+
+fieldset.star {
+  label {
+    display: inline;
+    cursor: pointer;
+  }
+
+  .checked {
+    color: orange;
+  }
+
+  .unchecked {
+    color: gray;
+  }
+
+  .hovered {
+    color: #FFD700;
+  }
+
+  .checked.hovered {
+    color: orange;
+  }
+
+  .removed {
+    color: red;
+  }
+
+  input[type="radio"] {
+    display: none;
+  }
+
+  label:first-child {
+    margin-right: 10px;
+  }
+
 }
\ No newline at end of file
diff --git a/pedagogy/templates/pedagogy/starlist.jinja b/pedagogy/templates/pedagogy/starlist.jinja
index 02379e03..a122d6b8 100644
--- a/pedagogy/templates/pedagogy/starlist.jinja
+++ b/pedagogy/templates/pedagogy/starlist.jinja
@@ -1,58 +1,44 @@
-<div>
-  <style>
-    .checked {
-      color : orange;
-    }
-    .unchecked {
-      color : gray;
-    }
-    .star input[type="radio"] {
-      display : none;
-    }
-    .star {
-      display: inline;
-    }
-
-  </style>
-
-    {# Do not vote button #}
-  <label class="star">
-    <input type="radio" name="{{ widget.name }}" value="-1" onclick='
-                                                                     var stars = document.getElementsByClassName("{{ widget.name }}");
-                                                                     for (var i = 0; i < stars.length; i++){
-                                                                     var attrs = stars[i].getAttribute("class");
-                                                                     attrs = attrs.replace("unchecked", "");
-                                                                     attrs = attrs.replace("checked", "");
-                                                                     stars[i].setAttribute("class", attrs + " unchecked");
-                                                                     }
-                                                                    ' checked>
-    <span class="fa fa-times-circle"> {{ translations.do_not_vote }}</span>
+<fieldset
+  class="star"
+  x-data="{ 'value': -1, 'hover': -1 }"
+  @mouseover.outside="hover = -1"
+>
+  {# Do not vote button #}
+  <label
+    class="star"
+    @mouseover="hover = -1"
+  >
+    <input
+      type="radio"
+      name="{{ widget.name }}"
+      value="-1"
+      @click="value = -1"
+    >
+    <i class="fa fa-times-circle"></i>
+    {{ translations.do_not_vote }}
   </label>
 
-    {# Star widget #}
+  {# Star widget #}
   {% for i in number_of_stars %}
-    <label class="star">
-      <input type="radio" name="{{ widget.name }}" value="{{ forloop.counter0 }}" onclick='
-                                                                                           var stars = document.getElementsByClassName("{{ widget.name }}");
-
-                                                                                           for (var i = 0; i < stars.length; i++){
-                                                                                           var attrs = stars[i].getAttribute("class");
-                                                                                           attrs = attrs.replace("unchecked", "");
-                                                                                           attrs = attrs.replace("checked", "");
-                                                                                           if (i > {{ forloop.counter0 }}){
-                                                                                           stars[i].setAttribute("class", attrs + " unchecked");
-                                                                                           } else {
-                                                                                           stars[i].setAttribute("class", attrs + " checked");
-                                                                                           }
-                                                                                           }
-                                                                                          '>
-      <i class="{{ widget.name }} fa fa-star unchecked"></i>
+    <label
+      class="star"
+      @mouseover="hover = {{ forloop.counter0 }}"
+    >
+      <input
+        type="radio"
+        name="{{ widget.name }}"
+        value="{{ forloop.counter0 }}"
+        @click="value = {{ forloop.counter0 }}"
+      >
+      <i
+        class="{{ widget.name }} fa fa-star"
+        :class="{
+                'checked': value >= {{ forloop.counter0 }},
+                'unchecked': value < {{ forloop.counter0 }},
+                'hovered': hover >= {{ forloop.counter0 }},
+                'removed': hover >= 0 && value >= {{ forloop.counter0 }} && hover < {{ forloop.counter0 }},
+                }"
+      ></i>
     </label>
   {% endfor %}
-
-    {# Restaure previous (-1 is default) #}
-  <script type="text/javascript">
-    document.querySelector("input[name='{{ widget.name }}'][value='{{ widget.value }}']").click()
-  </script>
-
-</div>
\ No newline at end of file
+</fieldset>
\ No newline at end of file

From 82e71263dd9ba3231ffd8ef0930c7a23b513aa65 Mon Sep 17 00:00:00 2001
From: Sli <antoine@bartuccio.fr>
Date: Fri, 21 Aug 2026 14:22:46 +0200
Subject: [PATCH 2/3] StarList uses proper inheritance and properly passes
 initial values and attributes + add empty comment clause

---
 locale/fr/LC_MESSAGES/django.po             |  6 +-
 pedagogy/forms.py                           | 42 ++++++++---
 pedagogy/static/pedagogy/css/pedagogy.scss  | 36 ----------
 pedagogy/static/pedagogy/css/starlist.scss  | 42 +++++++++++
 pedagogy/templates/pedagogy/starlist.jinja  | 78 ++++++++++++---------
 pedagogy/templates/pedagogy/ue_detail.jinja |  3 +-
 pedagogy/tests/tests.py                     | 18 +++++
 7 files changed, 142 insertions(+), 83 deletions(-)
 create mode 100644 pedagogy/static/pedagogy/css/starlist.scss

diff --git a/locale/fr/LC_MESSAGES/django.po b/locale/fr/LC_MESSAGES/django.po
index 5050adda..a34f65c0 100644
--- a/locale/fr/LC_MESSAGES/django.po
+++ b/locale/fr/LC_MESSAGES/django.po
@@ -6,7 +6,7 @@
 msgid ""
 msgstr ""
 "Report-Msgid-Bugs-To: \n"
-"POT-Creation-Date: 2026-06-10 20:18+0200\n"
+"POT-Creation-Date: 2026-08-21 14:10+0200\n"
 "PO-Revision-Date: 2016-07-18\n"
 "Last-Translator: Maréchal <thomas.girod@utbm.fr\n"
 "Language-Team: AE info <ae.info@utbm.fr>\n"
@@ -4969,6 +4969,10 @@ msgstr "Ne pas voter"
 msgid "This user has already commented on this UE"
 msgstr "Cet utilisateur a déjà commenté cette UE"
 
+#: pedagogy/forms.py
+msgid "UE comment can't be empty."
+msgstr "Un commentaire d'UE ne peut pas être vide."
+
 #: pedagogy/forms.py
 msgid "Accepted reports"
 msgstr "Signalements acceptés"
diff --git a/pedagogy/forms.py b/pedagogy/forms.py
index e2ca430b..d0623731 100644
--- a/pedagogy/forms.py
+++ b/pedagogy/forms.py
@@ -22,6 +22,8 @@
 #
 
 from django import forms
+from django.contrib.staticfiles.storage import staticfiles_storage
+from django.forms.fields import ValidationError
 from django.utils.translation import gettext_lazy as _
 
 from core.models import User
@@ -30,7 +32,7 @@ from pedagogy.models import UE, UEComment, UECommentReport
 
 
 class UEForm(forms.ModelForm):
-    """Form handeling creation and edit of an UE."""
+    """Form handling creation and edit of an UE."""
 
     class Meta:
         model = UE
@@ -68,22 +70,28 @@ class UEForm(forms.ModelForm):
         self.fields["author"].initial = author_id
 
 
-class StarList(forms.NumberInput):
+class StarList(forms.RadioSelect):
     template_name = "pedagogy/starlist.jinja"
 
-    def __init__(self, nubmer_of_stars=0):
-        super().__init__(None)
-        self.number_of_stars = nubmer_of_stars
+    def __init__(self, number_of_stars=0, attrs=None):
+        super().__init__(
+            attrs=attrs,
+            choices=(
+                (choice, _("Do not vote") if choice == -1 else choice)
+                for choice in range(-1, number_of_stars)
+            ),
+        )
 
     def get_context(self, name, value, attrs):
         context = super().get_context(name, value, attrs)
-        context["number_of_stars"] = range(0, self.number_of_stars)
-        context["translations"] = {"do_not_vote": _("Do not vote")}
+        context["statics"] = {
+            "css": staticfiles_storage.url("pedagogy/css/starlist.scss"),
+        }
         return context
 
 
 class UECommentForm(forms.ModelForm):
-    """Form handeling creation and edit of an UEComment."""
+    """Form handling creation and edit of an UEComment."""
 
     class Meta:
         model = UEComment
@@ -129,11 +137,25 @@ class UECommentForm(forms.ModelForm):
                 ),
             )
 
+        # Ensure that at least one value is exists
+        if (
+            all(
+                grade == -1
+                for grade in [
+                    self.cleaned_data[key]
+                    for key in self.cleaned_data
+                    if key.startswith("grade_")
+                ]
+            )
+            and not self.cleaned_data["comment"]
+        ):
+            raise ValidationError(message=_("UE comment can't be empty."))
+
         return self.cleaned_data
 
 
 class UECommentReportForm(forms.ModelForm):
-    """Form handeling creation and edit of an UEReport."""
+    """Form handling creation and edit of an UEReport."""
 
     class Meta:
         model = UECommentReport
@@ -153,7 +175,7 @@ class UECommentReportForm(forms.ModelForm):
 
 
 class UECommentModerationForm(forms.Form):
-    """Form handeling bulk comment deletion."""
+    """Form handling bulk comment deletion."""
 
     accepted_reports = forms.ModelMultipleChoiceField(
         UECommentReport.objects.all(),
diff --git a/pedagogy/static/pedagogy/css/pedagogy.scss b/pedagogy/static/pedagogy/css/pedagogy.scss
index eeacedfe..f0b9863d 100644
--- a/pedagogy/static/pedagogy/css/pedagogy.scss
+++ b/pedagogy/static/pedagogy/css/pedagogy.scss
@@ -520,40 +520,4 @@ details.accordion>.accordion-content {
   background-color: $white-color;
   border-color: $pedagogy-orange;
   border-right: none;
-}
-
-fieldset.star {
-  label {
-    display: inline;
-    cursor: pointer;
-  }
-
-  .checked {
-    color: orange;
-  }
-
-  .unchecked {
-    color: gray;
-  }
-
-  .hovered {
-    color: #FFD700;
-  }
-
-  .checked.hovered {
-    color: orange;
-  }
-
-  .removed {
-    color: red;
-  }
-
-  input[type="radio"] {
-    display: none;
-  }
-
-  label:first-child {
-    margin-right: 10px;
-  }
-
 }
\ No newline at end of file
diff --git a/pedagogy/static/pedagogy/css/starlist.scss b/pedagogy/static/pedagogy/css/starlist.scss
new file mode 100644
index 00000000..43d1b05d
--- /dev/null
+++ b/pedagogy/static/pedagogy/css/starlist.scss
@@ -0,0 +1,42 @@
+fieldset.star {
+  border: none;
+
+  label {
+    display: inline;
+    cursor: pointer;
+  }
+
+  .checked {
+    color: orange;
+  }
+
+  .unchecked {
+    color: gray;
+  }
+
+  .hovered {
+    color: #FFD700;
+  }
+
+  .checked.hovered {
+    color: orange;
+  }
+
+  .removed {
+    color: red;
+  }
+
+  input[type="radio"] {
+    display: none;
+  }
+
+  label:first-child {
+    margin-right: 10px;
+  }
+
+  &:has(input:required:invalid) {
+    border: 1px solid;
+    border-color: #c00000;
+  }
+
+}
\ No newline at end of file
diff --git a/pedagogy/templates/pedagogy/starlist.jinja b/pedagogy/templates/pedagogy/starlist.jinja
index a122d6b8..275f012e 100644
--- a/pedagogy/templates/pedagogy/starlist.jinja
+++ b/pedagogy/templates/pedagogy/starlist.jinja
@@ -1,44 +1,52 @@
-<fieldset
-  class="star"
-  x-data="{ 'value': -1, 'hover': -1 }"
-  @mouseover.outside="hover = -1"
->
-  {# Do not vote button #}
-  <label
+<link-once rel="stylesheet" type="text/css" href="{{ statics.css }}" defer></link-once>
+  <fieldset
     class="star"
-    @mouseover="hover = -1"
+    x-data="{ 'value': {% if widget.value.0 %}{{ widget.value.0 }}{% else %}-1{% endif %}, 'hover': -1 }"
+    @mouseover.outside="hover = -1"
+    {% include "django/forms/widgets/attrs.html" %}
   >
-    <input
-      type="radio"
-      name="{{ widget.name }}"
-      value="-1"
-      @click="value = -1"
-    >
-    <i class="fa fa-times-circle"></i>
-    {{ translations.do_not_vote }}
-  </label>
-
-  {# Star widget #}
-  {% for i in number_of_stars %}
+  {# Do not vote button #}
     <label
-      class="star"
-      @mouseover="hover = {{ forloop.counter0 }}"
+      @mouseover="hover = -1"
+      for="{{ widget.optgroups.0.1.0.attrs.id }}"
     >
       <input
         type="radio"
         name="{{ widget.name }}"
-        value="{{ forloop.counter0 }}"
-        @click="value = {{ forloop.counter0 }}"
+        value="{{ widget.optgroups.0.1.0.value }}"
+        @click="value = -1"
+        {% with widget=widget.optgroups.0.1.0 %}
+          {% include "django/forms/widgets/attrs.html" %}
+        {% endwith %}
       >
-      <i
-        class="{{ widget.name }} fa fa-star"
-        :class="{
-                'checked': value >= {{ forloop.counter0 }},
-                'unchecked': value < {{ forloop.counter0 }},
-                'hovered': hover >= {{ forloop.counter0 }},
-                'removed': hover >= 0 && value >= {{ forloop.counter0 }} && hover < {{ forloop.counter0 }},
-                }"
-      ></i>
+      <i class="fa fa-times-circle"></i>
+      {{ widget.optgroups.0.1.0.label }}
     </label>
-  {% endfor %}
-</fieldset>
\ No newline at end of file
+
+  {# Star widget #}
+    {% for opt in widget.optgroups|slice:"1:" %}
+      <label
+        @mouseover="hover = {{ opt.1.0.value }}"
+        for="{{ opt.1.0.attrs.id }}"
+      >
+        <input
+          type="radio"
+          name="{{ widget.name }}"
+          value="{{ opt.1.0.value }}"
+          @click="value = {{ opt.1.0.value }}"
+          {% with widget=opt.1.0 %}
+            {% include "django/forms/widgets/attrs.html" %}
+          {% endwith %}
+        >
+        <i
+          class="{{ widget.name }} fa fa-star"
+          :class="{
+                  'checked': value >= {{ opt.1.0.value }},
+                  'unchecked': value < {{ opt.1.0.value }},
+                  'hovered': hover >= {{ opt.1.0.value }},
+                  'removed': hover >= 0 && value >= {{ opt.1.0.value }} && hover < {{ opt.1.0.value }},
+                  }"
+        ></i>
+      </label>
+    {% endfor %}
+  </fieldset>
\ No newline at end of file
diff --git a/pedagogy/templates/pedagogy/ue_detail.jinja b/pedagogy/templates/pedagogy/ue_detail.jinja
index f5118c42..93423afd 100644
--- a/pedagogy/templates/pedagogy/ue_detail.jinja
+++ b/pedagogy/templates/pedagogy/ue_detail.jinja
@@ -89,13 +89,14 @@
           <p>{% trans %}You already posted a comment on this UE. If you want to comment again, please modify or delete your previous comment.{% endtrans %}</p>
         </div>
       {% elif user.has_perm("pedagogy.add_uecomment") %}
-        <details class="accordion" id="leave_comment">
+        <details class="accordion" id="leave_comment" {% if form.errors %}open{%endif%}>
           <summary>{% trans %}Leave comment{% endtrans %}</summary>
           <div class="accordion-content">
             <form action="{{ url('pedagogy:ue_detail', ue_id=object.id) }}" method="post" enctype="multipart/form-data">
               {% csrf_token %}
               <div class="leave-comment-grid-container">
                 <div class="form-stars">
+                  {{ form.non_field_errors() }}
                   {{ form.author.errors }}
                   {{ form.ue.errors }}
 
diff --git a/pedagogy/tests/tests.py b/pedagogy/tests/tests.py
index 671a698c..b638516e 100644
--- a/pedagogy/tests/tests.py
+++ b/pedagogy/tests/tests.py
@@ -339,6 +339,24 @@ class TestUVCommentCreationAndDisplay(TestCase):
         response = self.client.get(self.ue_url)
         self.assertContains(response, text="Superbe UE")
 
+    def test_create_ue_empty_comment_fail(self):
+        self.client.force_login(self.tutu)
+        response = self.client.post(
+            self.ue_url,
+            {
+                "author": self.tutu.id,
+                "ue": UE.objects.get(code="PA00").id,
+                "grade_global": -1,
+                "grade_utility": -1,
+                "grade_interest": -1,
+                "grade_teaching": -1,
+                "grade_work_load": -1,
+                "comment": "",
+            },
+        )
+        assert response.status_code == 200
+        self.assertInHTML("Un commentaire d'UE ne peut pas être vide.", response.text)
+
     def test_create_ue_comment_unauthorized_fail(self):
         nb_comments = self.ue.comments.count()
         # Test with anonymous user

From 4a8471983f6bb92ee708806ba6a32983d0a557d0 Mon Sep 17 00:00:00 2001
From: Sli <antoine@bartuccio.fr>
Date: Sun, 23 Aug 2026 15:17:03 +0200
Subject: [PATCH 3/3] Apply review comments

---
 pedagogy/forms.py                          | 7 ++-----
 pedagogy/static/pedagogy/css/starlist.scss | 6 +-----
 pedagogy/templates/pedagogy/starlist.jinja | 2 +-
 3 files changed, 4 insertions(+), 11 deletions(-)

diff --git a/pedagogy/forms.py b/pedagogy/forms.py
index d0623731..4d03c83b 100644
--- a/pedagogy/forms.py
+++ b/pedagogy/forms.py
@@ -141,11 +141,8 @@ class UECommentForm(forms.ModelForm):
         if (
             all(
                 grade == -1
-                for grade in [
-                    self.cleaned_data[key]
-                    for key in self.cleaned_data
-                    if key.startswith("grade_")
-                ]
+                for key, grade in self.cleaned_data.items()
+                if key.startswith("grade_")
             )
             and not self.cleaned_data["comment"]
         ):
diff --git a/pedagogy/static/pedagogy/css/starlist.scss b/pedagogy/static/pedagogy/css/starlist.scss
index 43d1b05d..d2aa8f34 100644
--- a/pedagogy/static/pedagogy/css/starlist.scss
+++ b/pedagogy/static/pedagogy/css/starlist.scss
@@ -14,14 +14,10 @@ fieldset.star {
     color: gray;
   }
 
-  .hovered {
+  .unchecked.hovered {
     color: #FFD700;
   }
 
-  .checked.hovered {
-    color: orange;
-  }
-
   .removed {
     color: red;
   }
diff --git a/pedagogy/templates/pedagogy/starlist.jinja b/pedagogy/templates/pedagogy/starlist.jinja
index 275f012e..46c4a5ff 100644
--- a/pedagogy/templates/pedagogy/starlist.jinja
+++ b/pedagogy/templates/pedagogy/starlist.jinja
@@ -1,7 +1,7 @@
 <link-once rel="stylesheet" type="text/css" href="{{ statics.css }}" defer></link-once>
   <fieldset
     class="star"
-    x-data="{ 'value': {% if widget.value.0 %}{{ widget.value.0 }}{% else %}-1{% endif %}, 'hover': -1 }"
+    x-data="{ 'value': {{ widget.value.0 }}, 'hover': -1 }"
     @mouseover.outside="hover = -1"
     {% include "django/forms/widgets/attrs.html" %}
   >