add translations

fix: duplicate user search when a whitelist exists

club/admin.py

@@ -46,8 +46,8 @@ class ClubAdmin(admin.ModelAdmin):
 @admin.register(ClubRole)
 class ClubRoleAdmin(admin.ModelAdmin):
     list_display = ("name", "club", "is_board", "is_presidency")
-    search_fields = ("name",)
-    autocomplete_fields = ("club",)
+    search_fields = ("name", "club__name")
+    autocomplete_fields = ("club", "linked_groups")
     list_select_related = ("club",)
     list_filter = (
         "is_board",

club/forms.py

@@ -479,6 +479,13 @@ class ClubRoleCreateForm(forms.ModelForm):
 class ClubRoleBaseFormSet(forms.BaseInlineFormSet):
     ordering_widget = forms.HiddenInput()
 
+    def __init__(self, *args, queryset=None, **kwargs):
+        if queryset is None:
+            queryset = self.model._default_manager
+        super().__init__(
+            *args, queryset=queryset.prefetch_related("linked_groups"), **kwargs
+        )
+
 
 ClubRoleFormSet = forms.inlineformset_factory(
     Club,

club/migrations/0018_clubrole_linked_groups.py

@@ -0,0 +1,26 @@
+# Generated by Django 5.2.17 on 2026-09-01 14:36
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+    dependencies = [
+        ("club", "0017_linktype_clublink"),
+        ("core", "0050_alter_sithfile_moderator"),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name="clubrole",
+            name="linked_groups",
+            field=models.ManyToManyField(
+                help_text=(
+                    "Groups that are automatically given or removed "
+                    "to user receiving or losing this club role"
+                ),
+                related_name="club_roles",
+                to="core.group",
+                verbose_name="Linked groups",
+            ),
+        ),
+    ]

club/models.py

@@ -23,6 +23,8 @@
 #
 from __future__ import annotations
 
+import operator
+from functools import reduce
 from typing import Iterable, Self
 
 from django.conf import settings
@@ -282,6 +284,15 @@ class ClubRole(OrderedModel):
             "If the role is inactive, people joining the club won't be able to get it."
         ),
     )
+    linked_groups = models.ManyToManyField(
+        Group,
+        verbose_name=_("Linked groups"),
+        help_text=_(
+            "Groups that are automatically given or removed "
+            "to user receiving or losing this club role"
+        ),
+        related_name="linked_roles",
+    )
 
     order_with_respect_to = "club"
 
@@ -534,7 +545,7 @@ class Membership(models.Model):
     def _remove_club_groups(
         memberships: Iterable[Membership],
     ) -> tuple[int, dict[str, int]]:
-        """Remove users of those memberships from the club groups.
+        """Remove users of those memberships from the club  and club role groups.
 
         For example, if a user is in the Troll club board,
         he is in the board group and the members group of the Troll.
@@ -553,15 +564,19 @@ class Membership(models.Model):
         clubs = {m.club_id for m in memberships}
         users = {m.user_id for m in memberships}
         groups = Group.objects.filter(Q(club__in=clubs) | Q(club_board__in=clubs))
+        role_groups = [
+            Q(user_id=m.user_id, group__linked_roles=m.role_id) for m in memberships
+        ]
         return User.groups.through.objects.filter(
-            Q(group__in=groups) & Q(user__in=users)
+            (Q(group__in=groups) & Q(user__in=users))
+            | reduce(operator.or_, role_groups)
         ).delete()
 
     @staticmethod
     def _add_club_groups(
         memberships: Iterable[Membership],
     ) -> list[User.groups.through]:
-        """Add users of those memberships to the club groups.
+        """Add users of those memberships to the club and club role groups.
 
         For example, if a user just joined the Troll club board,
         he will be added in both the members group and the board group
@@ -582,34 +597,40 @@ class Membership(models.Model):
         memberships = [m for m in memberships if m.end_date is None]
         if not memberships:
             return []
-
-        if sum(1 for m in memberships if not hasattr(m, "club")) > 1:
+        nb_prefetched = sum(
+            1 for m in memberships if not hasattr(m, "club") or not hasattr(m, "role")
+        )
+        if nb_prefetched > 1:
             # if more than one membership hasn't its `club` attribute set
             # it's less expensive to reload the whole query with
             # a select_related than perform a distinct query
             # to fetch each club.
             ids = {m.id for m in memberships}
             memberships = list(
-                Membership.objects.filter(id__in=ids).select_related("club")
+                Membership.objects.filter(id__in=ids)
+                .select_related("club", "role")
+                .prefetch_related("role__linked_groups")
             )
-        club_groups = []
+        groups = []
         for membership in memberships:
-            club_groups.append(
+            groups.append(
                 User.groups.through(
                     user_id=membership.user_id,
                     group_id=membership.club.members_group_id,
                 )
             )
             if membership.role.is_board:
-                club_groups.append(
+                groups.append(
                     User.groups.through(
                         user_id=membership.user_id,
                         group_id=membership.club.board_group_id,
                     )
                 )
-        return User.groups.through.objects.bulk_create(
-            club_groups, ignore_conflicts=True
+            groups.extend(
+                User.groups.through(user_id=membership.user_id, group_id=g.id)
+                for g in membership.role.linked_groups.all()
             )
+        return User.groups.through.objects.bulk_create(groups, ignore_conflicts=True)
 
 
 class Mailing(models.Model):

club/templates/club/club_roles.jinja

@@ -49,6 +49,20 @@
             {{ subform.is_active.help_text }}
           </span>
         </div>
+        {% set groups = subform.instance.linked_groups.all()|list %}
+        {% if groups %}
+          <div>
+            <p>
+              <strong>{% trans %}Linked groups : {% endtrans %}</strong>
+              {{ groups|map(attribute="name")|join(", ") }}
+            </p>
+            <p class="helptext">
+              {% trans trimmed %}
+                Users receiving this role will also be assigned to those groups
+              {% endtrans %}
+            </p>
+          </div>
+        {% endif %}
       </div>
     </details>
   </div>

club/templates/club/fragments/add_member.jinja

@@ -7,7 +7,7 @@
 
   <form
     hx-post="{{ url('club:club_new_members', club_id=club.id) }}"
-    hx-disabled-elt="find input[type='submit']"
+    hx-disable="find input[type='submit']"
     hx-swap="outerHTML"
     hx-target="#member-fragment-container"
     id="add_club_members_form"

club/tests/test_membership.py

@@ -17,7 +17,7 @@ from club.forms import ClubAddMemberForm, JoinClubForm
 from club.models import Club, ClubRole, Membership
 from club.tests.base import TestClub
 from core.baker_recipes import subscriber_user
-from core.models import AnonymousUser, User
+from core.models import AnonymousUser, Group, User
 
 
 class TestMembershipQuerySet(TestClub):
@@ -500,6 +500,29 @@ class TestMembership(TestClub):
         assert self.subscriber.groups.contains(self.club.members_group)
         assert self.subscriber.groups.contains(self.club.board_group)
 
+    def test_add_to_club_role_group(self):
+        groups = baker.make(Group, _quantity=4)
+        self.subscriber.groups.set(groups[:1])
+        self.board_role.linked_groups.set(groups[1:3])
+        baker.make(
+            Membership, club=self.club, user=self.subscriber, role=self.board_role
+        )
+        assert set(self.subscriber.groups.all()) == {
+            *groups[:3],
+            self.club.board_group,
+            self.club.members_group,
+        }
+
+    def test_remove_from_club_role_group(self):
+        groups = baker.make(Group, _quantity=3)
+        baker.make(
+            Membership, club=self.club, user=self.subscriber, role=self.board_role
+        )
+        self.subscriber.groups.set(groups[:1])
+        self.board_role.linked_groups.set(groups[1:])
+        self.subscriber.memberships.update(end_date=localdate())
+        assert set(self.subscriber.groups.all()) == {groups[0]}
+
     def test_change_position_in_club(self):
         """Test that when moving from board to members, club group change"""
         membership = baker.make(

core/static/bundled/base-bundle-index.ts

@@ -6,14 +6,15 @@
  * for more efficient tree-shaking and gzip compression.
  */
 
+// Must be loaded before Apline
+import htmx from "htmx.org";
+import "htmx.org/dist/ext/hx-alpine-compat.js";
+import "htmx.org/dist/ext/hx-prompt.js";
+import "htmx.org/dist/ext/hx-download.js";
+
 import sort from "@alpinejs/sort";
 import Alpine from "alpinejs";
 import { polyfillCountryFlagEmojis } from "country-flag-emoji-polyfill";
-import htmx from "htmx.org";
-import { getErrorCallbacksExt } from "#core:htmx/error-callback";
-
-("#core:htmx/error-callback");
-
 import { limitedChoices } from "#core:alpine/limited-choices";
 import { expireOldStorage } from "#core:core/localstorage";
 import { default as navbar } from "#core:core/navbar";
@@ -48,22 +49,19 @@ polyfillCountryFlagEmojis();
  * HTMX
  */
 document.body.addEventListener(
-  "htmx:beforeRequest" as keyof HTMLElementEventMap,
+  "htmx:before:request" as keyof HTMLElementEventMap,
   (event) => {
-    (event as CustomEvent).detail.target.ariaBusy = true;
+    (event as CustomEvent).detail.ctx.target.ariaBusy = true;
   },
 );
 
 document.body.addEventListener(
-  "htmx:beforeSwap" as keyof HTMLElementEventMap,
+  "htmx:before:swap" as keyof HTMLElementEventMap,
   (event) => {
-    (event as CustomEvent).detail.target.ariaBusy = null;
+    (event as CustomEvent).detail.ctx.target.ariaBusy = null;
   },
 );
 
-const errorCallbackExt = getErrorCallbacksExt();
-htmx.defineExtension(errorCallbackExt.name, errorCallbackExt.extension);
-
 Object.assign(window, { htmx });
 
 /**

core/static/bundled/htmx/error-callback.ts

@@ -1,80 +0,0 @@
-import type { HtmxExtension } from "htmx.org";
-
-interface CustomHtmxExtension {
-  name: string;
-  extension: Partial<HtmxExtension>;
-}
-
-export const getErrorCallbacksExt = () => {
-  const attrPrefix = "hx-callback-";
-  let htmxApi: {
-    [x: string]: any;
-    getClosestAttributeValue: any;
-  };
-
-  const getCallback = (elt: HTMLElement, responseCode: number) => {
-    if (!elt || !responseCode) {
-      return () => {};
-    }
-
-    const code = responseCode.toString();
-
-    // '*' is the original syntax, as the obvious character for a wildcard.
-    // The 'x' alternative was added for maximum compatibility with HTML
-    // templating engines, due to ambiguity around which characters are
-    // supported in HTML attributes.
-    //
-    // Start with the most specific possible attribute and generalize from
-    // there.
-    const suffixes = [
-      code,
-
-      code.substring(0, 2) + "*",
-      code.substring(0, 2) + "x",
-
-      code.substring(0, 1) + "*",
-      code.substring(0, 1) + "x",
-      code.substring(0, 1) + "**",
-      code.substring(0, 1) + "xx",
-
-      "*",
-      "x",
-      "***",
-      "xxx",
-    ];
-    if (code.startsWith("4") || code.startsWith("5")) {
-      suffixes.push("error");
-    }
-
-    for (const suffix of suffixes) {
-      const attr = attrPrefix + suffix;
-      const callback = htmxApi?.getClosestAttributeValue(elt, attr);
-      if (callback) {
-        return Function("src", "target", callback);
-      }
-    }
-
-    return () => {};
-  };
-
-  return {
-    name: "error-callbacks",
-    extension: {
-      init: (api: any) => {
-        htmxApi = api;
-      },
-      onEvent: (name: string, event: CustomEvent) => {
-        if (name !== "htmx:responseError") {
-          return true;
-        }
-
-        getCallback(event.detail.requestConfig.elt, event.detail.xhr.status)(
-          event.detail.requestConfig.elt,
-          htmxApi.getTarget(event.detail.requestConfig.elt),
-        );
-
-        return true;
-      },
-    },
-  } as CustomHtmxExtension;
-};

core/templates/core/fragment/user_visibility.jinja

@@ -1,6 +1,6 @@
 <form
   hx-post="{{ url("core:user_visibility_fragment", user_id=form.instance.id) }}"
-  hx-disabled-elt="find input[type='submit']"
+  hx-disable="find input[type='submit']"
   hx-swap="outerHTML" x-data="{ isViewable: {{ form.is_viewable.value()|tojson }} }"
 >
   {% for message in messages %}

core/tests/test_user.py

@@ -141,6 +141,22 @@ class TestSearchUsersView(TestSearchUsers):
         response = self.client.get(reverse("core:search"))
         assert response.status_code == 200
 
+    def test_search_with_whitelist_unique(self):
+        """Test that when a user has a whitelist and appears in the results,
+        it appears only once.
+
+        This is a regression test (cf #1463)
+        """
+        user = subscriber_user.make(is_viewable=False)
+        user.whitelisted_users.add(
+            *subscriber_user.make(_quantity=4, _bulk_create=True)
+        )
+        self.client.force_login(user)
+        response = self.client.get(
+            reverse("core:search", query={"query": user.last_name})
+        )
+        assert response.context_data["users"] == [user]
+
 
 @pytest.mark.django_db
 def test_user_account_not_found(client: Client):

core/views/index.py

@@ -65,6 +65,7 @@ class SearchView(LoginRequiredMixin, TemplateView):
                 UserFilterSchema(search=query)
                 .filter(User.objects.viewable_by(self.request.user))
                 .order_by(F("last_login").desc(nulls_last=True))
+                .distinct()
             )
             clubs = list(Club.objects.filter(name__icontains=query)[:5])
         return super().get_context_data(**kwargs) | {"users": users, "clubs": clubs}

core/views/user.py

@@ -473,7 +473,7 @@ class UserClubView(UserTabsMixin, CanViewMixin, DetailView):
 class UserVisibilityFormFragment(FragmentMixin, SuccessMessageMixin, UpdateView):
     model = User
     form_class = UserVisibilityForm
-    template_name = "core/fragments/user_visibility.jinja"
+    template_name = "core/fragment/user_visibility.jinja"
     pk_url_kwarg = "user_id"
 
     def get_form_kwargs(self):

counter/static/bundled/counter/components/ajax-select-index.ts

@@ -28,18 +28,23 @@ export class ProductAjaxSelect extends AjaxSelect {
     return [];
   }
 
-  private getName(item: SimpleProductSchema, sanitize: typeof escape_html): string {
+  // In the context in which this method is called, `this` might be shadowed
+  // We need to call it explicitly from the class itself
+  private static getName(
+    item: SimpleProductSchema,
+    sanitize: typeof escape_html,
+  ): string {
     return item.code ? `${sanitize(item.code)} - ${sanitize(item.name)}` : item.name;
   }
 
   protected renderOption(item: SimpleProductSchema, sanitize: typeof escape_html) {
     return `<div class="select-item">
-            <span class="select-item-text">${this.getName(item, sanitize)}</span>
+            <span class="select-item-text">${ProductAjaxSelect.getName(item, sanitize)}</span>
           </div>`;
   }
 
   protected renderItem(item: SimpleProductSchema, sanitize: typeof escape_html) {
-    return `<span>${this.getName(item, sanitize)}</span>`;
+    return `<span>${ProductAjaxSelect.getName(item, sanitize)}</span>`;
   }
 }
 

counter/templates/counter/fragments/delete_student_card.jinja

@@ -1,5 +1,10 @@
 <div id="student_card_form">
-  <form hx-post="{{ action }}" hx-swap="outerHTML" hx-target="#student_card_form">
+  <form
+    hx-post="{{ action }}"
+    hx-swap="outerHTML"
+    hx-target="#student_card_form"
+    hx-disable="input[type='submit']"
+  >
     {% csrf_token %}
     <p>{% trans obj=object %}Are you sure you want to delete "{{ obj }}"?{% endtrans %}</p>
     <input type="submit" value="{% trans %}Confirm{% endtrans %}" />

docs/explanation/technos.md

@@ -217,7 +217,7 @@ C'est une technologie simple et puissante qui se veut comme le jQuery du web mod
 
 ### Htmx
 
-[Site officiel](https://htmx.org/)
+[Site officiel](https://four.htmx.org/)
 
 En plus de AlpineJS, l’interactivité sur le site est augmentée via Htmx.
 C'est une librairie js qui s'utilise également au moyen d'attributs HTML à

election/templates/election/fragments/apply_result.jinja

@@ -41,7 +41,7 @@
       hx-post="{{ url("election:apply_result", election_id=form.election.id) }}"
       hx-swap="outerHTML"
       hx-target="#apply-election-result-fragment"
-      hx-disabled-elt="find input[type='submit']"
+      hx-disable="find input[type='submit']"
     >
       {% csrf_token %}
       {{ form }}

locale/fr/LC_MESSAGES/django.po

@@ -6,7 +6,7 @@
 msgid ""
 msgstr ""
 "Report-Msgid-Bugs-To: \n"
-"POT-Creation-Date: 2026-08-21 14:10+0200\n"
+"POT-Creation-Date: 2026-09-01 18:25+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"
@@ -260,6 +260,18 @@ msgstr ""
 "Si ce rôle est inactif, il ne pourra pas être attribué aux gens qui "
 "rejoignent le club."
 
+#: club/models.py
+msgid "Linked groups"
+msgstr "Groupes liés"
+
+#: club/models.py
+msgid ""
+"Groups that are automatically given or removed to user receiving or losing "
+"this club role"
+msgstr ""
+"Les groupes qui sont automatiquement donnés ou retirés quand l'utilisateur "
+"reçoit ou perd ce rôle de club"
+
 #: club/models.py election/models.py
 msgid "club role"
 msgstr "rôle de club"
@@ -485,6 +497,14 @@ msgstr "Du"
 msgid "To"
 msgstr "Au"
 
+#: club/templates/club/club_roles.jinja
+msgid "Linked groups : "
+msgstr "Groupes liés : "
+
+#: club/templates/club/club_roles.jinja
+msgid "Users receiving this role will also be assigned to those groups"
+msgstr "Les utilisateurs recevant ce rôle seront aussi assignés à ces groupes"
+
 #: club/templates/club/club_roles.jinja
 msgid ""
 "Roles give rights on the club. Higher roles grant more rights, and the "
@@ -5089,6 +5109,10 @@ msgstr "signalant"
 msgid "A guide of courses available at UTBM."
 msgstr "Un guide de tous les cours disponibles à l'UTBM."
 
+#: pedagogy/templates/pedagogy/guide.jinja
+msgid "Search UE"
+msgstr "Recherche d'UE"
+
 #: pedagogy/templates/pedagogy/guide.jinja
 #, python-format
 msgid "%(display_name)s"
@@ -5758,6 +5782,18 @@ msgstr "fin de la cotisation"
 msgid "location"
 msgstr "lieu"
 
+#: subscription/models.py
+msgid "created_at"
+msgstr "créé le"
+
+#: subscription/models.py
+msgid ""
+"When this subscription was created. This date may differ from the start of "
+"the subscription."
+msgstr ""
+"Quand la cotisation a été créée. Cette date peut différer du début effectif de "
+"la cotisation."
+
 #: subscription/models.py
 msgid "You can not subscribe many time for the same period"
 msgstr "Vous ne pouvez pas cotiser plusieurs fois pour la même période"

package-lock.json

@@ -30,7 +30,7 @@
         "easymde": "^2.21.0",
         "glob": "^13.0.6",
         "html2canvas": "^1.4.1",
-        "htmx.org": "^2.0.10",
+        "htmx.org": "^4.0.0",
         "js-cookie": "^3.0.8",
         "lit-html": "^3.3.3",
         "native-file-system-adapter": "^3.0.1",
@@ -3801,10 +3801,16 @@
       }
     },
     "node_modules/htmx.org": {
-      "version": "2.0.10",
-      "resolved": "https://registry.npmjs.org/htmx.org/-/htmx.org-2.0.10.tgz",
-      "integrity": "sha512-kdeJe7ZVwaS6QMz/ebBIVtZdpwen6L0OQ5GOhPV9MKBb196TCZeZu4yA7ZIQsaLKv7EpXz+So7KSXNuHXhj7Cw==",
-      "license": "0BSD"
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/htmx.org/-/htmx.org-4.0.0.tgz",
+      "integrity": "sha512-T/171FUY93Kdfp8t+DnHdk45QvKRiBhVhhrwSzrXgUi4pHKvhp77dUA/qg8FAjsFWPIHNbmUuIdCrcVHuiZWng==",
+      "license": "BSD-0-Clause",
+      "workspaces": [
+        "ext/*"
+      ],
+      "bin": {
+        "upgrade-check": "dist/scripts/upgrade-check.js"
+      }
     },
     "node_modules/ical.js": {
       "version": "1.5.0",

package.json

@@ -34,8 +34,8 @@
     "@types/cytoscape-klay": "^3.1.5",
     "@types/js-cookie": "^3.0.6",
     "@types/node": "^26.2.0",
-    "rollup-plugin-visualizer": "^7.1.1",
     "@typescript/native": "npm:typescript@^7.0.2",
+    "rollup-plugin-visualizer": "^7.1.1",
     "typescript": "npm:@typescript/typescript6@^6.0.2",
     "vite": "^8.2.2"
   },
@@ -61,7 +61,7 @@
     "easymde": "^2.21.0",
     "glob": "^13.0.6",
     "html2canvas": "^1.4.1",
-    "htmx.org": "^2.0.10",
+    "htmx.org": "^4.0.0",
     "js-cookie": "^3.0.8",
     "lit-html": "^3.3.3",
     "native-file-system-adapter": "^3.0.1",

pedagogy/models.py

@@ -126,11 +126,7 @@ class UE(models.Model):
         Returns:
             True if the user has already posted a comment on this UE, else False.
         """
-        self._has_user_commented = getattr(self, "_has_user_commented", {})
-        self._has_user_commented[user] = self._has_user_commented.get(
-            user, self.comments.filter(author=user).exists()
-        )
-        return self._has_user_commented[user]
+        return self.comments.filter(author=user).exists()
 
     @cached_property
     def grade_global_average(self):

pedagogy/static/pedagogy/css/pedagogy.scss

@@ -64,100 +64,23 @@ $pedagogy-white-text: #f0f0f0;
   }
 
   #search_form {
-    .search-form-container {
-      display: grid;
-      grid-template-columns: auto auto;
-      grid-template-rows: auto auto auto;
-      grid-template-areas:
-      "action-bar action-bar"
-      "search-bar search-bar"
-      "radio-department radio-department"
-      "radio-credit-type radio-semester";
-    }
 
-    .action-bar {
-      grid-area: action-bar;
-      margin-bottom: 10px;
-    }
-
-    .search-bar {
-      grid-area: search-bar;
-      display: grid;
-      grid-template-columns: auto 200px;
-      grid-template-rows: auto;
-      grid-template-areas: "search-bar-input search-bar-button";
-
-      @media screen and (max-width: $medium-devices) {
-        grid-template-columns: auto auto;
-        grid-template-rows: auto;
-        grid-template-areas: "search-bar-input search-bar-button";
-      }
-
-      @media screen and (max-width: $small-devices) {
-        grid-template-columns: auto;
-        grid-template-rows: auto;
-        grid-template-areas: "search-bar-input";
-
-        .search-bar-button {
-          display: none;
-        }
-      }
-
-      .search-bar-input {
-        grid-area: search-bar-input;
-        background: $pedagogy-light-blue;
-      }
-
-      .search-bar-button {
-        grid-area: search-bar-button;
-        background: $pedagogy-orange;
-        color: white;
-        font-weight: bold;
-        margin-left: 20px;
-      }
-    }
-
-    .radio-department {
-      grid-area: radio-department;
-    }
-
-    .radio-credit-type {
-      grid-area: radio-credit-type;
-    }
-
-    .radio-semester {
-      grid-area: radio-semester;
-    }
-
-    .radio-guide input[type="radio"],
+    .radio-guide fieldset {
       input[type="checkbox"] {
         display: none;
       }
-
-    .radio-guide {
       margin-top: 10px;
+      margin-bottom: 0;
       color: white;
-    }
 
-    .radio-guide label {
-      display: inline-block;
-      background-color: $pedagogy-blue;
+      label {
         padding: 10px 20px;
-      font-family: Arial, sans-serif;
-      font-size: 16px;
-      border-radius: 4px;
       }
 
-    .radio-guide input[type="radio"]:checked+label {
+      input[type="checkbox"]:checked+label {
         background-color: $pedagogy-orange;
+        @include shadow;
       }
-
-    .radio-guide input[type="checkbox"]:checked+label {
-      background-color: $pedagogy-orange;
-    }
-
-    .radio-guide label:hover {
-      background-color: $pedagogy-hover-blue;
     }
   }
 
@@ -205,14 +128,14 @@ $pedagogy-white-text: #f0f0f0;
       grid-area: hours-the;
     }
 
-    .leave-comment-not-allowed {
+    #leave_comment_not_allowed {
       p {
         text-align: center;
         color: red;
       }
     }
 
-    .leave-comment {
+    #leave_comment {
       .leave-comment-grid-container {
         display: grid;
         grid-template-columns: 270px auto;
@@ -245,6 +168,10 @@ $pedagogy-white-text: #f0f0f0;
       .input-stars {
         margin-top: 20px;
       }
+
+      input[type="submit"] {
+        float: right;
+      }
     }
 
     .ue-details-container {
@@ -406,9 +333,8 @@ $pedagogy-white-text: #f0f0f0;
           padding-left: 10px;
         }
 
-        .action {
+        .actions {
           float: right;
-          margin-top: 0;
         }
       }
 
@@ -518,8 +444,3 @@ details.accordion>.accordion-content {
   border-color: $pedagogy-orange;
   border-right: none;
 }
-
-.right {
-  display: flex;
-  justify-content: flex-end;
-}

pedagogy/templates/pedagogy/fragments/comment_report.jinja

@@ -1,30 +0,0 @@
-<form
-  hx-post="{{ request.get_full_path() }}"
-  hx-ext="error-callbacks"
-  hx-target="this"
-  hx-swap="outerHTML"
-  hx-disabled-elt="input[type='submit']"
-  hx-trigger="submit"
-  hx-callback-404="target.remove()"
->
-  {% csrf_token %}
-  {{ form.non_field_errors() }}
-  {{ form.reason.errors }}
-  {{ form.reason }}
-
-  {# Hidden fields #}
-  {{ form.reporter }}
-  {{ form.comment }}
-
-  <button
-    hx-get="{{ url('pedagogy:comment_detail', comment_id=comment_id) }}"
-    hx-target="closest form"
-    hx-swap="outerHTML"
-  >
-    {% trans %}Cancel{% endtrans %}
-  </button>
-
-  <p class="right" id="nique">
-    <input type="submit" value="{% trans %}Report{% endtrans %}" />
-  </p>
-</form>

pedagogy/templates/pedagogy/fragments/ue_comment.jinja

@@ -1,83 +0,0 @@
-{% from "pedagogy/macros.jinja" import display_star %}
-{% from "core/macros.jinja" import user_profile_link %}
-
-<div id="comment-{{ comment.id }}" class="comment-container">
-
-  <div class="grade-block">
-    <div class="grade-type">
-      <p>{% trans %}Global grade{% endtrans %}</p>
-      <p>{% trans %}Utility{% endtrans %}</p>
-      <p>{% trans %}Interest{% endtrans %}</p>
-      <p>{% trans %}Teaching{% endtrans %}</p>
-      <p>{% trans %}Work load{% endtrans %}</p>
-    </div>
-    <div class="grade-stars">
-      <p>{{ display_star(comment.grade_global) }}</p>
-      <p>{{ display_star(comment.grade_utility) }}</p>
-      <p>{{ display_star(comment.grade_interest) }}</p>
-      <p>{{ display_star(comment.grade_teaching) }}</p>
-      <p>{{ display_star(comment.grade_work_load) }}</p>
-    </div>
-    <div class="grade-extension"></div>
-  </div>
-
-  <div class="comment">
-    <div class="anchor">
-      <a href="{{ url('pedagogy:ue_detail', ue_id=ue.id) }}#comment-{{ comment.id }}"><i class="fa fa-paragraph"></i></a>
-    </div>
-    {{ comment.comment|markdown }}
-  </div>
-
-  <div class="info">
-    {% if comment.is_reported %}
-      <p class="status-reported">
-        {% trans %}This comment has been reported{% endtrans %}
-      </p>
-    {% endif %}
-
-    {% if comment.author_id == user.id or user.has_perm("pedagogy.change_comment") %}
-      <button
-        class="btn btn-orange action"
-        hx-get="{{ url('pedagogy:comment_update', comment_id=comment.id) }}"
-        hx-swap="outerHTML"
-        hx-target="#comment-{{ comment.id }}"
-      >
-        <i class="fa fa-pencil"></i> {% trans %}Edit{% endtrans %}
-      </button>
-    {% endif %}
-    {% if comment.author_id == user.id or user.has_perm("pedagogy.delete_comment") %}
-      <form class="action"
-            hx-ext="error-callbacks"
-            hx-post="{{ url('pedagogy:comment_delete', comment_id=comment.id) }}"
-            hx-confirm='{% trans obj=object %}Are you sure you want to delete "{{ obj }}"?{% endtrans %}'
-            hx-swap="outerHTML"
-            hx-target="#comment-{{ comment.id }}"
-            hx-callback-404="document.getElementsByTagName('body')[0].dispatchEvent(new CustomEvent('CommentUpdate'));target.remove()"
-      >
-        {% csrf_token %}
-        <button class="btn btn-red action">
-          <i class="fa fa-trash-can"></i> {% trans %}Delete{% endtrans %}
-        </button>
-      </form>
-    {% endif %}
-  </div>
-
-  <div class="comment-end-bar">
-    <div class="report">
-      <p>
-        <a
-          hx-get="{{ url('pedagogy:comment_report', comment_id=comment.id) }}"
-          hx-swap="outerHTML"
-          hx-target="#comment-{{ comment.id }}"
-        >
-          {% trans %}Report this comment{% endtrans %}
-        </a>
-      </p>
-    </div>
-
-    <div class="date"><p>{{ comment.publish_date.strftime('%d/%m/%Y') }}</p></div>
-
-    <div class="author"><p>{{ user_profile_link(comment.author) }}</p></div>
-  </div>
-
-</div>

pedagogy/templates/pedagogy/fragments/ue_comment_form.jinja

@@ -1,71 +0,0 @@
-<div class="leave-comment">
-  {% if form.is_creation %}
-    <details class="accordion" id="leave_comment" {% if form.errors %}open{% endif %}>
-      <summary>{% trans %}Leave comment{% endtrans %}</summary>
-      <div class="accordion-content">
-  {% endif %}
-  <form
-    hx-post="{{ action }}"
-    hx-target="closest .leave-comment"
-    hx-swap="outerHTML"
-    hx-disabled-elt="find input[type='submit']"
-  >
-    {% csrf_token %}
-    <div class="leave-comment-grid-container">
-      <div class="form-stars">
-        {{ form.non_field_errors() }}
-        {{ form.author.errors }}
-        {{ form.ue.errors }}
-
-        {{ form.author }}
-        {{ form.ue }}
-
-        <div class="input-stars">
-          <label for="{{ form.grade_global.id_for_label }}">{{ form.grade_global.label }} :</label>
-          {{ form.grade_global.errors }}
-          {{ form.grade_global }}
-        </div>
-
-        <div class="input-stars">
-          <label for="{{ form.grade_utility.id_for_label }}">{{ form.grade_utility.label }} :</label>
-          {{ form.grade_utility.errors }}
-          {{ form.grade_utility }}
-        </div>
-
-        <div class="input-stars">
-          <label for="{{ form.grade_interest.id_for_label }}">{{ form.grade_interest.label }} :</label>
-          {{ form.grade_interest.errors }}
-          {{ form.grade_interest }}
-        </div>
-
-        <div class="input-stars">
-          <label for="{{ form.grade_teaching.id_for_label }}">{{ form.grade_teaching.label }} :</label>
-          {{ form.grade_teaching.errors }}
-          {{ form.grade_teaching }}
-        </div>
-
-        <div class="input-stars">
-          <label for="{{ form.grade_work_load.id_for_label }}">{{ form.grade_work_load.label }} :</label>
-          {{ form.grade_work_load.errors }}
-          {{ form.grade_work_load }}
-        </div>
-      </div>
-      <div class="form-comment">
-        <label for="{{ form.comment.id_for_label }}">{{ form.comment.label }} :</label>
-        {{ form.comment.errors }}
-        {{ form.comment }}
-      </div>
-    </div>
-    <p class="right">
-      <input type="submit" value="{% trans %}Comment{% endtrans %}" />
-    </p>
-  </form>
-
-  {% if form.is_creation %}
-    </div>
-    </details>
-  {% endif %}
-
-  <br>
-
-</div>

pedagogy/templates/pedagogy/fragments/ue_comments.jinja

@@ -1,17 +0,0 @@
-<section
-  hx-get="{{ url("pedagogy:ue_comments", ue_id=object.id) }}"
-  hx-swap="outerHTML"
-  hx-target="this"
-  hx-trigger="NewComment from:body"
->
-  {% if comments %}
-    <h2>{% trans %}Comments{% endtrans %}</h2>
-    <br>
-  {% endif %}
-
-  {% for comment in comments %}
-    {% include "pedagogy/fragments/ue_comment.jinja" %}
-  {% endfor %}
-</section>
-
-

pedagogy/templates/pedagogy/fragments/ue_detail.jinja

@@ -1,47 +0,0 @@
-<div
-  hx-get="{{ request.get_full_path() }}"
-  hx-swap="outerHTML"
-  hx-target="this"
-  hx-trigger="CommentUpdate from:body"
->
-  <div class="ue-details-container">
-    <div class="grade">
-      <p>{% trans %}Global grade{% endtrans %}</p>
-      <p>{% trans %}Utility{% endtrans %}</p>
-      <p>{% trans %}Interest{% endtrans %}</p>
-      <p>{% trans %}Teaching{% endtrans %}</p>
-      <p>{% trans %}Work load{% endtrans %}</p>
-    </div>
-    <div class="grade-stars">
-      <p>{{ display_star(object.grade_global_average) }}</p>
-      <p>{{ display_star(object.grade_utility_average) }}</p>
-      <p>{{ display_star(object.grade_interest_average) }}</p>
-      <p>{{ display_star(object.grade_teaching_average) }}</p>
-      <p>{{ display_star(object.grade_work_load_average) }}</p>
-    </div>
-    <div class="ue-infos">
-      <p><b>{% trans %}Objectives{% endtrans %}</b></p>
-      <p>{{ object.objectives|markdown }}</p>
-      <p><b>{% trans %}Program{% endtrans %}</b></p>
-      <p>{{ object.program|markdown }}</p>
-      <p><b>{% trans %}Earned skills{% endtrans %}</b></p>
-      <p>{{ object.skills|markdown }}</p>
-      <p><b>{% trans %}Key concepts{% endtrans %}</b></p>
-      <p>{{ object.key_concepts|markdown }}</p>
-      <p><b>{% trans %}UE manager: {% endtrans %}</b>{{ object.manager }}</p>
-    </div>
-  </div>
-
-  <br>
-  {% if object.has_user_already_commented(user) %}
-    <div class="leave-comment-not-allowed">
-      <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>
-    <br>
-  {% endif %}
-
-  {% if not object.has_user_already_commented(user) and user.has_perm("pedagogy.add_uecomment") %}
-    {{ add_comment_form }}
-  {% endif %}
-
-</div>

pedagogy/templates/pedagogy/guide.jinja

@@ -14,7 +14,7 @@
 {% endblock %}
 
 {% block additional_js %}
-  <script type="module" src="{{ static('bundled/pedagogy/guide-index.js') }}"></script>
+  <script type="module" src="{{ static('bundled/pedagogy/guide-index.ts') }}"></script>
 {% endblock %}
 
 {% block head %}
@@ -24,30 +24,28 @@
 
 {% block content %}
   {% if user.has_perm("pedagogy.add_ue") %}
-    <div class="action-bar">
-      <p>
-        <a href="{{ url('pedagogy:ue_create') }}">{% trans %}Create UE{% endtrans %}</a>
-      </p>
-      <p>
-        <a href="{{ url('pedagogy:moderation') }}">{% trans %}Moderate comments{% endtrans %}</a>
-      </p>
+    <div class="row gap">
+      <a href="{{ url('pedagogy:ue_create') }}" class="btn btn-blue"><i class="fa fa-plus"></i>{% trans %}Create UE{% endtrans %}</a>
+      <a href="{{ url('pedagogy:moderation') }}" class="btn btn-grey">{% trans %}Moderate comments{% endtrans %}</a>
     </div>
     <br/>
   {% endif %}
   <div class="pedagogy" x-data="ue_search" x-cloak>
-    <form id="search_form">
+    <form id="search_form" class="">
       <div class="search-form-container">
-        <div class="search-bar">
+        <fieldset>
+          <label for="search_input">{% trans %}Search UE{% endtrans %}</label>
           <input
             id="search_input"
             class="search-bar-input"
-            type="text"
+            type="search"
             name="search"
+            placeholder=""
             x-model.debounce.500ms="search"
           />
-        </div>
-        <div class="radio-department">
-          <div class="radio-guide">
+        </fieldset>
+        <div class="row gap-3x margin-bottom radio-guide">
+          <fieldset>
             {% set departments = [
             ("EDIM", "EDIM"), ("ENERGIE", "EE"), ("IMSI", "IMSI"),
             ("INFO", "GI"), ("GMC", "MC"), ("HUMA", "HUMA"), ("TC", "TC")
@@ -56,16 +54,16 @@
               <input
                 type="checkbox"
                 name="department"
-                id="radio{{ real_name }}"
+                id="radio_{{ real_name }}"
                 value="{{ real_name }}"
                 x-model="department"
               />
-              <label for="radio{{ real_name }}">{% trans %}{{ display_name }}{% endtrans %}</label>
+              <label for="radio_{{ real_name }}" class="btn btn-blue">
+                {% trans %}{{ display_name }}{% endtrans %}
+              </label>
             {% endfor %}
-          </div>
-        </div>
-        <div class="radio-credit-type">
-          <div class="radio-guide">
+          </fieldset>
+          <fieldset>
             {% for credit_type in ["CS", "TM", "EC", "QC", "OM"] %}
               <input
                 type="checkbox"
@@ -74,18 +72,21 @@
                 value="{{ credit_type }}"
                 x-model="credit_type"
               />
-              <label for="radio{{ credit_type }}">{% trans %}{{ credit_type }}{% endtrans %}</label>
+              <label for="radio{{ credit_type }}" class="btn btn-blue">
+                {% trans %}{{ credit_type }}{% endtrans %}
+              </label>
             {% endfor %}
-          </div>
-        </div>
-
-        <div class="radio-semester">
-          <div class="radio-guide">
+          </fieldset>
+          <fieldset>
             <input type="checkbox" name="semester" id="radioAUTUMN" value="AUTUMN" x-model="semester"/>
-            <label for="radioAUTUMN"><i class="fa fa-leaf"></i></label>
+            <label for="radioAUTUMN" class="btn btn-no-text btn-blue">
+              <i class="fa fa-leaf"></i>
+            </label>
             <input type="checkbox" name="semester" id="radioSPRING" value="SPRING" x-model="semester"/>
-            <label for="radioSPRING"><i class="fa-regular fa-sun"></i></label>
-          </div>
+            <label for="radioSPRING" class="btn btn-no-text btn-blue">
+              <i class="fa-regular fa-sun"></i>
+            </label>
+          </fieldset>
         </div>
       </div>
     </form>

pedagogy/templates/pedagogy/ue_detail.jinja

@@ -1,20 +1,16 @@
+{% extends "core/base.jinja" %}
+{% from "core/macros.jinja" import user_profile_link %}
 {% from "pedagogy/macros.jinja" import display_star %}
 
-{% if is_fragment %}
-  {% include "pedagogy/fragments/ue_detail.jinja" %}
-{% else %}
-  {% extends "core/base.jinja" %}
-
-  {% block additional_css %}
+{% block additional_css %}
   <link rel="stylesheet" href="{{ static('pedagogy/css/pedagogy.scss') }}">
-  {% endblock %}
+{% endblock %}
 
-  {% block title %}
+{% block title %}
   {% trans %}UE Details{% endtrans %}
-  {% endblock %}
-
-  {% block content %}
+{% endblock %}
 
+{% block content %}
   <div class="pedagogy">
     <div id="ue_detail">
       <button onclick='(function(){
@@ -59,12 +55,166 @@
 
       <br>
 
-        {% include "pedagogy/fragments/ue_detail.jinja" %}
-
-        {{ comments }}
-
+      <div class="ue-details-container">
+        <div class="grade">
+          <p>{% trans %}Global grade{% endtrans %}</p>
+          <p>{% trans %}Utility{% endtrans %}</p>
+          <p>{% trans %}Interest{% endtrans %}</p>
+          <p>{% trans %}Teaching{% endtrans %}</p>
+          <p>{% trans %}Work load{% endtrans %}</p>
+        </div>
+        <div class="grade-stars">
+          <p>{{ display_star(object.grade_global_average) }}</p>
+          <p>{{ display_star(object.grade_utility_average) }}</p>
+          <p>{{ display_star(object.grade_interest_average) }}</p>
+          <p>{{ display_star(object.grade_teaching_average) }}</p>
+          <p>{{ display_star(object.grade_work_load_average) }}</p>
+        </div>
+        <div class="ue-infos">
+          <p><b>{% trans %}Objectives{% endtrans %}</b></p>
+          <p>{{ object.objectives|markdown }}</p>
+          <p><b>{% trans %}Program{% endtrans %}</b></p>
+          <p>{{ object.program|markdown }}</p>
+          <p><b>{% trans %}Earned skills{% endtrans %}</b></p>
+          <p>{{ object.skills|markdown }}</p>
+          <p><b>{% trans %}Key concepts{% endtrans %}</b></p>
+          <p>{{ object.key_concepts|markdown }}</p>
+          <p><b>{% trans %}UE manager: {% endtrans %}</b>{{ object.manager }}</p>
         </div>
       </div>
 
-  {% endblock %}
-{% endif %}
+      <br>
+      {% if object.has_user_already_commented(user) %}
+        <div id="leave_comment_not_allowed">
+          <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" {% 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 }}
+
+                  {{ form.author }}
+                  {{ form.ue }}
+
+                  <div class="input-stars">
+                    <label for="{{ form.grade_global.id_for_label }}">{{ form.grade_global.label }} :</label>
+                    {{ form.grade_global.errors }}
+                    {{ form.grade_global }}
+                  </div>
+
+                  <div class="input-stars">
+                    <label for="{{ form.grade_utility.id_for_label }}">{{ form.grade_utility.label }} :</label>
+                    {{ form.grade_utility.errors }}
+                    {{ form.grade_utility }}
+                  </div>
+
+                  <div class="input-stars">
+                    <label for="{{ form.grade_interest.id_for_label }}">{{ form.grade_interest.label }} :</label>
+                    {{ form.grade_interest.errors }}
+                    {{ form.grade_interest }}
+                  </div>
+
+                  <div class="input-stars">
+                    <label for="{{ form.grade_teaching.id_for_label }}">{{ form.grade_teaching.label }} :</label>
+                    {{ form.grade_teaching.errors }}
+                    {{ form.grade_teaching }}
+                  </div>
+
+                  <div class="input-stars">
+                    <label for="{{ form.grade_work_load.id_for_label }}">{{ form.grade_work_load.label }} :</label>
+                    {{ form.grade_work_load.errors }}
+                    {{ form.grade_work_load }}
+                  </div>
+                </div>
+                <div class="form-comment">
+                  <label for="{{ form.comment.id_for_label }}">{{ form.comment.label }} :</label>
+                  {{ form.comment.errors }}
+                  {{ form.comment }}
+                </div>
+              </div>
+              <p><input type="submit" value="{% trans %}Comment{% endtrans %}" /></p>
+            </form>
+          </div>
+        </details>
+      {% endif %}
+      <br>
+
+      {% if comments %}
+        <h2>{% trans %}Comments{% endtrans %}</h2>
+        {% for comment in comments %}
+          <div id="{{ comment.id }}" class="comment-container">
+
+            <div class="grade-block">
+              <div class="grade-type">
+                <p>{% trans %}Global grade{% endtrans %}</p>
+                <p>{% trans %}Utility{% endtrans %}</p>
+                <p>{% trans %}Interest{% endtrans %}</p>
+                <p>{% trans %}Teaching{% endtrans %}</p>
+                <p>{% trans %}Work load{% endtrans %}</p>
+              </div>
+              <div class="grade-stars">
+                <p>{{ display_star(comment.grade_global) }}</p>
+                <p>{{ display_star(comment.grade_utility) }}</p>
+                <p>{{ display_star(comment.grade_interest) }}</p>
+                <p>{{ display_star(comment.grade_teaching) }}</p>
+                <p>{{ display_star(comment.grade_work_load) }}</p>
+              </div>
+              <div class="grade-extension"></div>
+            </div>
+
+            <div class="comment">
+              <div class="anchor">
+                <a href="{{ url('pedagogy:ue_detail', ue_id=ue.id) }}#{{ comment.id }}"><i class="fa fa-paragraph"></i></a>
+              </div>
+              {{ comment.comment|markdown }}
+            </div>
+
+            <div class="info">
+              {% if comment.is_reported %}
+                <p class="status-reported">
+                  {% trans %}This comment has been reported{% endtrans %}
+                </p>
+              {% endif %}
+
+              {% if comment.author_id == user.id or user.has_perm("pedagogy.change_comment") %}
+                <p class="actions">
+                  <a href="{{ url('pedagogy:comment_update', comment_id=comment.id) }}">
+                    {% trans %}Edit{% endtrans %}
+                  </a>
+              {% endif %}
+              {% if comment.author_id == user.id or user.has_perm("pedagogy.delete_comment") %}
+                <a href="{{ url('pedagogy:comment_delete', comment_id=comment.id) }}">
+                  {% trans %}Delete{% endtrans %}
+                </a>
+                </p>
+              {% endif %}
+            </div>
+
+            <div class="comment-end-bar">
+              <div class="report">
+                <p>
+                  <a href="{{ url('pedagogy:comment_report', comment_id=comment.id) }}">
+                    {% trans %}Report this comment{% endtrans %}
+                  </a>
+                </p>
+              </div>
+
+              <div class="date"><p>{{ comment.publish_date.strftime('%d/%m/%Y') }}</p></div>
+
+              <div class="author"><p>{{ user_profile_link(comment.author) }}</p></div>
+            </div>
+
+          </div>
+        {% endfor %}
+      {% endif %}
+
+    </div>
+  </div>
+{% endblock %}

pedagogy/urls.py

@@ -24,15 +24,12 @@
 from django.urls import path
 
 from pedagogy.views import (
-    UECommentCreateView,
     UECommentDeleteView,
-    UECommentDetailView,
     UECommentReportCreateView,
     UECommentUpdateView,
     UECreateView,
     UEDeleteView,
-    UEDetailCommentsView,
-    UEDetailView,
+    UEDetailFormView,
     UEGuideView,
     UEModerationFormView,
     UEUpdateView,
@@ -41,22 +38,7 @@ from pedagogy.views import (
 urlpatterns = [
     # Urls displaying the actual application for visitors
     path("", UEGuideView.as_view(), name="guide"),
-    path("ue/<int:ue_id>/", UEDetailView.as_view(), name="ue_detail"),
-    path(
-        "ue/<int:ue_id>/comments",
-        UEDetailCommentsView.as_view(),
-        name="ue_comments",
-    ),
-    path(
-        "ue/<int:ue_id>/comment",
-        UECommentCreateView.as_view(),
-        name="comment_create",
-    ),
-    path(
-        "comment/<int:comment_id>/",
-        UECommentDetailView.as_view(),
-        name="comment_detail",
-    ),
+    path("ue/<int:ue_id>/", UEDetailFormView.as_view(), name="ue_detail"),
     path(
         "comment/<int:comment_id>/edit/",
         UECommentUpdateView.as_view(),

pedagogy/views.py

@@ -24,13 +24,11 @@
 from django.conf import settings
 from django.contrib.auth.mixins import PermissionRequiredMixin
 from django.db.models import Exists, OuterRef
-from django.http import HttpResponse
 from django.shortcuts import get_object_or_404
 from django.urls import reverse, reverse_lazy
 from django.views.generic import (
     CreateView,
     DeleteView,
-    DetailView,
     FormView,
     TemplateView,
     UpdateView,
@@ -38,7 +36,7 @@ from django.views.generic import (
 
 from core.auth.mixins import PermissionOrAuthorRequiredMixin
 from core.models import Notification, User
-from core.views.mixins import AllowFragment, FragmentMixin, UseFragmentsMixin
+from core.views import DetailFormView
 from pedagogy.forms import (
     UECommentForm,
     UECommentModerationForm,
@@ -48,120 +46,61 @@ from pedagogy.forms import (
 from pedagogy.models import UE, UEComment, UECommentReport
 
 
-class UECommentCreateView(PermissionRequiredMixin, FragmentMixin, CreateView):
-    model = UEComment
-    template_name = "pedagogy/fragments/ue_comment_form.jinja"
-    form_class = UECommentForm
-    permission_required = "pedagogy.add_uecomment"
-    object = None  # Avoid initialisation bug with FragmentMixin
+class UEDetailFormView(PermissionRequiredMixin, DetailFormView):
+    """Display every comment of an UE and detailed infos about it.
 
-    @property
-    def ue(self):
-        if hasattr(self, "_ue"):
-            return self._ue
-        self._ue = get_object_or_404(UE, id=self.kwargs.get("ue_id"))
-        return self._ue
+    Allow to comment the UE.
+    """
+
+    model = UE
+    pk_url_kwarg = "ue_id"
+    template_name = "pedagogy/ue_detail.jinja"
+    form_class = UECommentForm
+    permission_required = "pedagogy.view_ue"
 
     def has_permission(self):
-        if self.ue.has_user_already_commented(self.request.user):
+        if self.request.method == "POST" and not self.request.user.has_perm(
+            "pedagogy.add_uecomment"
+        ):
+            # if it's a POST request, the user is trying to add a new UEComment
+            # thus he also needs the "add_uecomment" permission
             return False
         return super().has_permission()
 
     def get_form_kwargs(self):
         kwargs = super().get_form_kwargs()
         kwargs["author_id"] = self.request.user.id
-        kwargs["ue_id"] = self.ue.id
+        kwargs["ue_id"] = self.object.id
         kwargs["is_creation"] = True
         return kwargs
 
-    def get_context_data(self, **kwargs):
-        return super().get_context_data(**kwargs) | {
-            "action": reverse("pedagogy:comment_create", kwargs={"ue_id": self.ue.id})
-        }
-
     def form_valid(self, form):
-        """If the form is valid, save the associated model."""
-        self.object = form.save()
-        response = HttpResponse(status=200)
-        response.headers["HX-Trigger"] = "NewComment, CommentUpdate"
-        return response
-
-
-class UEDetailCommentsView(
-    PermissionRequiredMixin,
-    FragmentMixin,
-    DetailView,
-):
-    """Fragment view that display all comments"""
-
-    model = UE
-    pk_url_kwarg = "ue_id"
-    template_name = "pedagogy/fragments/ue_comments.jinja"
-    permission_required = "pedagogy.view_ue"
+        form.save()
+        return super().form_valid(form)
 
     def get_context_data(self, **kwargs):
-        self.object = self.get_object()  # Needed if loaded with .as_fragment()
         return super().get_context_data(**kwargs) | {
             "comments": list(
                 self.object.comments.viewable_by(self.request.user)
                 .annotate_is_reported()
                 .select_related("author")
                 .order_by("-publish_date")
-            ),
-        }
-
-
-class UEDetailView(
-    PermissionRequiredMixin, UseFragmentsMixin, AllowFragment, DetailView
-):
-    """Display every comment of an UE and detailed infos about it."""
-
-    model = UE
-    pk_url_kwarg = "ue_id"
-    template_name = "pedagogy/ue_detail.jinja"
-    permission_required = "pedagogy.view_ue"
-    fragments = {
-        "add_comment_form": UECommentCreateView,
-        "comments": UEDetailCommentsView,
-    }
-
-    def get_fragment_data(self):
-        return {
-            "add_comment_form": {"ue_id": self.object.id},
-            "comments": {"ue_id": self.object.id},
-        }
-
-
-class UECommentDetailView(PermissionRequiredMixin, DetailView):
-    model = UEComment
-    pk_url_kwarg = "comment_id"
-    template_name = "pedagogy/fragments/ue_comment.jinja"
-    permission_required = "pedagogy.view_ue"
-    context_object_name = "comment"
-
-    def get_queryset(self):
-        return (
-            super().get_queryset().viewable_by(self.request.user).annotate_is_reported()
             )
-
-    def dispatch(self, *args, **kwargs):
-        res: HttpResponse = super().dispatch(*args, **kwargs)
-        res.headers["HX-Trigger"] = "CommentUpdate"
-        return res
-
-    def get_context_data(self, **kwargs):
-        return super().get_context_data(**kwargs) | {
-            "ue": getattr(self.object, "ue", None)
         }
 
+    def get_success_url(self):
+        # once the new ue comment has been saved
+        # redirect to the same page we are currently
+        return self.request.path
 
-class UECommentUpdateView(PermissionOrAuthorRequiredMixin, AllowFragment, UpdateView):
+
+class UECommentUpdateView(PermissionOrAuthorRequiredMixin, UpdateView):
     """Allow edit of a given comment."""
 
     model = UEComment
     form_class = UECommentForm
     pk_url_kwarg = "comment_id"
-    template_name = "pedagogy/fragments/ue_comment_form.jinja"
+    template_name = "core/edit.jinja"
     permission_required = "pedagogy.change_uecomment"
     author_field = "author"
 
@@ -172,18 +111,11 @@ class UECommentUpdateView(PermissionOrAuthorRequiredMixin, AllowFragment, Update
         kwargs["is_creation"] = False
         return kwargs
 
-    def get_context_data(self, **kwargs):
-        return super().get_context_data(**kwargs) | {
-            "action": reverse(
-                "pedagogy:comment_update", kwargs={"comment_id": self.object.id}
-            )
-        }
-
     def get_success_url(self):
-        return reverse("pedagogy:comment_detail", kwargs={"comment_id": self.object.id})
+        return reverse("pedagogy:ue_detail", kwargs={"ue_id": self.object.ue_id})
 
 
-class UECommentDeleteView(PermissionOrAuthorRequiredMixin, AllowFragment, DeleteView):
+class UECommentDeleteView(PermissionOrAuthorRequiredMixin, DeleteView):
     """Allow to delete a given comment."""
 
     model = UEComment
@@ -192,13 +124,8 @@ class UECommentDeleteView(PermissionOrAuthorRequiredMixin, AllowFragment, Delete
     permission_required = "pedagogy.delete_uecomment"
     author_field = "author"
 
-    def form_valid(self, form):
-        response = super().form_valid(form)
-        response.headers["HX-Trigger"] = "CommentUpdate"
-        return response
-
     def get_success_url(self):
-        return reverse("pedagogy:comment_detail", kwargs={"comment_id": self.object.id})
+        return reverse("pedagogy:ue_detail", kwargs={"ue_id": self.object.ue_id})
 
 
 class UEGuideView(PermissionRequiredMixin, TemplateView):
@@ -208,12 +135,12 @@ class UEGuideView(PermissionRequiredMixin, TemplateView):
     permission_required = "pedagogy.view_ue"
 
 
-class UECommentReportCreateView(PermissionRequiredMixin, AllowFragment, CreateView):
+class UECommentReportCreateView(PermissionRequiredMixin, CreateView):
     """Create a new report for an inappropriate comment."""
 
     model = UECommentReport
     form_class = UECommentReportForm
-    template_name = "pedagogy/fragments/comment_report.jinja"
+    template_name = "core/edit.jinja"
     permission_required = "pedagogy.add_uecommentreport"
 
     def dispatch(self, request, *args, **kwargs):
@@ -226,11 +153,6 @@ class UECommentReportCreateView(PermissionRequiredMixin, AllowFragment, CreateVi
         kwargs["comment_id"] = self.ue_comment.id
         return kwargs
 
-    def get_context_data(self, **kwargs):
-        return super().get_context_data() | {
-            "comment_id": self.ue_comment.id,
-        }
-
     def form_valid(self, form):
         resp = super().form_valid(form)
         # Send a message to moderation admins
@@ -246,12 +168,11 @@ class UECommentReportCreateView(PermissionRequiredMixin, AllowFragment, CreateVi
                 url=reverse("pedagogy:moderation"),
                 type="PEDAGOGY_MODERATION",
             )
+
         return resp
 
     def get_success_url(self):
-        return reverse(
-            "pedagogy:comment_detail", kwargs={"comment_id": self.ue_comment.id}
-        )
+        return reverse("pedagogy:ue_detail", kwargs={"ue_id": self.ue_comment.ue_id})
 
 
 class UEModerationFormView(PermissionRequiredMixin, FormView):

subscription/templates/subscription/fragments/creation_form_existing_user.jinja

@@ -1,7 +1,7 @@
 <form
   hx-post="{{ url("subscription:fragment-existing-user") }}"
   hx-target="this"
-  hx-disabled-elt="find input[type='submit']"
+  hx-disable="find input[type='submit']"
   hx-swap="outerHTML"
 >
   {% csrf_token %}

subscription/templates/subscription/fragments/creation_form_new_user.jinja

@@ -1,7 +1,7 @@
 <form
   hx-post="{{ url("subscription:fragment-new-user") }}"
   hx-target="this"
-  hx-disabled-elt="find input[type='submit']"
+  hx-disable="find input[type='submit']"
   hx-swap="outerHTML"
 >
   {% csrf_token %}