Prototype: use partials

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/fragments/ue_details/comments.jinja

@@ -0,0 +1,10 @@
+{% if comments %}
+  <h2>{% trans %}Comments{% endtrans %}</h2>
+  <br>
+{% endif %}
+
+<section>
+  {% for comment in comments %}
+    {% include "pedagogy/fragments/ue_comment.jinja" %}
+  {% endfor %}
+</section>

pedagogy/templates/pedagogy/fragments/ue_details/form.jinja

@@ -0,0 +1,10 @@
+{% 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 %}

pedagogy/templates/pedagogy/fragments/ue_details/grade.jinja

@@ -0,0 +1,27 @@
+<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>

pedagogy/templates/pedagogy/ue_detail.jinja

@@ -1,7 +1,19 @@
 {% from "pedagogy/macros.jinja" import display_star %}
 
 {% if is_fragment %}
-  {% include "pedagogy/fragments/ue_detail.jinja" %}
+
+  <hx-partial id="ue-grade">
+    {% include "pedagogy/fragments/ue_details/grade.jinja" %}
+  </hx-partial>
+
+  <hx-partial id="comment-form">
+    {% include "pedagogy/fragments/ue_details/form.jinja" %}
+  </hx-partial>
+
+  <hx-partial id="comments" hx-swap="innerMorph">
+    {% include "pedagogy/fragments/ue_details/comments.jinja" %}
+  </hx-partial>
+
 {% else %}
   {% extends "core/base.jinja" %}
 
@@ -59,12 +71,23 @@
 
         <br>
 
-        {% include "pedagogy/fragments/ue_detail.jinja" %}
+        <div id="ue-grade">
+          {% include "pedagogy/fragments/ue_details/grade.jinja" %}
+        </div>
 
-        {{ comments }}
+        <br>
+
+        <div id="comment-form">
+          {% include "pedagogy/fragments/ue_details/form.jinja" %}
+        </div>
+
+        <div id="comments">
+          {% for comment in comments %}
+            {% include "pedagogy/fragments/ue_comment.jinja" %}
+          {% endfor %}
+        </div>
 
       </div>
     </div>
-
   {% endblock %}
 {% endif %}