[MERGE AFTER django_components 0.63 UPGRADE] Refactor: Use django_components for panel instead of a template tag

components/panel/panel.html

@@ -0,0 +1,62 @@
+{% load admission component_tags %}
+
+{% comment "License" %}
+ * OSIS stands for Open Student Information System. It's an application
+ * designed to manage the core business of higher education institutions,
+ * such as universities, faculties, institutes and professional schools.
+ * The core business involves the administration of students, teachers,
+ * courses, programs and so on.
+ *
+ * Copyright (C) 2015-2024 Université catholique de Louvain (http://www.uclouvain.be)
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * A copy of this license - GNU General Public License - is available
+ * at the root of the source code of this program.  If not,
+ * see http://www.gnu.org/licenses/.
+{% endcomment %}
+
+{# FIXME Uncomment after upgrade to django_components >= 0.77 #}
+{# <div {% html_attrs attributes class="panel panel-default" %}>#}
+<div class="panel panel-default {{ additional_class }}" {% if id %}id="{{ id }}"{% endif %}>
+  <div class="panel-heading">
+    {% if edit_link_button %}
+      <a
+          class="btn btn-default pull-right btn-sm"
+          {% if edit_link_button == 'JS_BUTTON' %}
+          tabindex="0"
+          {% else %}
+          href="{{ edit_link_button }}"
+          {% if edit_link_button_in_new_tab %}
+          target="_blank"
+          {% endif %}
+          {% endif %}
+      >
+        <i class="fas fa-{% if edit_link_button == 'JS_BUTTON' or 'update' in edit_link_button or 'edit' in edit_link_button %}edit{% else %}eye{% endif %}"></i>
+      </a>
+    {% endif %}
+    <h{{ title_level }} class="panel-title">
+        {{ title }}
+    </h{{ title_level }}>
+  </div>
+  <div class="panel-body">
+      {% slot "body" default required %}{% endslot %}
+  </div>
+  {# FIXME Uncomment after upgrade to django_components >= 0.77 #}
+  {#  {% if component_vars.is_filled.footer %}#}
+  {% if_filled "footer" %}
+  <div class="panel-footer clearfix">
+    {% slot "footer" %}{% endslot %}
+  </div>
+  {% endif_filled %}
+  {# FIXME Uncomment after upgrade to django_components >= 0.77 #}
+  {#  {% endif %}#}
+</div>

components/panel/panel.py

@@ -0,0 +1,53 @@
+# ##############################################################################
+#
+#    OSIS stands for Open Student Information System. It's an application
+#    designed to manage the core business of higher education institutions,
+#    such as universities, faculties, institutes and professional schools.
+#    The core business involves the administration of students, teachers,
+#    courses, programs and so on.
+#
+#    Copyright (C) 2015-2024 Université catholique de Louvain (http://www.uclouvain.be)
+#
+#    This program is free software: you can redistribute it and/or modify
+#    it under the terms of the GNU General Public License as published by
+#    the Free Software Foundation, either version 3 of the License, or
+#    (at your option) any later version.
+#
+#    This program is distributed in the hope that it will be useful,
+#    but WITHOUT ANY WARRANTY; without even the implied warranty of
+#    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+#    GNU General Public License for more details.
+#
+#    A copy of this license - GNU General Public License - is available
+#    at the root of the source code of this program.  If not,
+#    see http://www.gnu.org/licenses/.
+#
+# ##############################################################################
+from django.utils.functional import Promise
+from django_components import component
+from voluptuous import Schema, Required, Any
+
+from inscription_evaluation.components.utils import OsisComponent
+
+
+@component.register("panel")
+class PanelComponent(OsisComponent):
+    template_name = "panel/panel.html"
+    context_data_schema = Schema(
+        {
+            Required('title'): Any(str, Promise),
+            Required('title_level', default=4): int,
+            'edit_link_button': str,
+            Required('edit_link_button_in_new_tab', default=False): bool,
+            # FIXME Uncomment after upgrade to django_components >= 0.77
+            # 'attributes': {str: str},
+            # And remove `additional_class`, then move it to the `class` key of `attributes` when used
+            'additional_class': str,
+            # Also remove `id` and move it as a key of `attributes`
+            'id': str,
+        }
+    )
+
+    class Media:
+        css = "panel/panel.css"
+        js = "panel/panel.js"

templates/admission/continuing_education/forms/specific_questions.html

@@ -1,5 +1,5 @@
 {% extends base_template %}
-{% load bootstrap3 admission i18n %}
+{% load bootstrap3 component_tags admission i18n %}
 
 {% comment "License" %}
   * OSIS stands for Open Student Information System. It's an application
@@ -28,7 +28,7 @@
 {% block form %}
   {% bootstrap_form_errors form %}
 
-  {% panel _('Specific aspects') %}
+  {% component "panel" title=_('Specific aspects') %}
     {% if form.display_residence_permit_question %}
       <p class="alert alert-info text-justify">
         {% blocktranslate trimmed %}
@@ -52,7 +52,7 @@
       </div>
       {% bootstrap_field form.adresse_mail_professionnelle placeholder='' form_group_class='form-group required_field' %}
       {% bootstrap_field form.type_adresse_facturation form_group_class='form-group required_field' %}
-      {% panel _("Billing address") id="billing-address-container" %}
+      {% component "panel" title=_("Billing address") id="billing-address-container" %}
         {% bootstrap_field form.adresse_facturation_destinataire placeholder='' %}
         <div class="row">
           <div class="col-md-4 required_field formatted-field">
@@ -86,11 +86,11 @@
             </div>
           </div>
         </div>
-      {% endpanel %}
+      {% endcomponent %}
     </div>
     {% bootstrap_field form.reponses_questions_specifiques show_label=False error_css_class='' %}
     {% bootstrap_field form.documents_additionnels %}
-  {% endpanel %}
+  {% endcomponent %}
 {% endblock %}
 
 {% block script %}

templates/admission/details/accounting.html

@@ -1,5 +1,5 @@
 {% extends base_template %}
-{% load i18n admission enums static academic_year_display %}
+{% load component_tags i18n admission enums static academic_year_display %}
 
 {% comment "License" %}
 * OSIS stands for Open Student Information System. It's an application
@@ -32,13 +32,13 @@
       {% plural %}
       Certificates stating no debts to the institutions attended during the academic year {{ academic_year}}: {{ names }}.
     {% endblocktranslate %}
-    {% panel _('Absence of debt') %}
+    {% component "panel" title=_('Absence of debt') %}
       {% field_data absence_of_debt_label accounting.attestation_absence_dette_etablissement %}
-    {% endpanel %}
+    {% endcomponent %}
   {% endif %}
 
   {% if is_general %}
-    {% panel _('Reduced tuition fee') %}
+    {% component "panel" title=_('Reduced tuition fee') %}
       {% field_data _('Have you applied for a student grant from the French Community of Belgium?') accounting.demande_allocation_d_etudes_communaute_francaise_belgique %}
       {% field_data _('Are you the child of a UCLouvain or Martin V staff member?') accounting.enfant_personnel %}
       {% if accounting.enfant_personnel %}
@@ -53,11 +53,11 @@
           </p>
         </div>
       {% endif %}
-    {% endpanel %}
+    {% endcomponent %}
   {% endif %}
 
   {% if with_assimilation %}
-    {% panel _('Belgian student status') %}
+    {% component "panel" title=_('Belgian student status') %}
       {% if accounting.type_situation_assimilation == 'AUCUNE_ASSIMILATION' %}
         {% translate 'You specified that no Belgian student status situation applies to you.' %}
 
@@ -173,17 +173,17 @@
         {% field_data _('Your Belgian student status') accounting.type_situation_assimilation|enum_display:'TypeSituationAssimilation' %}
       {% endif %}
 
-    {% endpanel %}
+    {% endcomponent %}
   {% endif %}
 
-  {% panel _('Memberships') %}
+  {% component "panel" title=_('Memberships') %}
     {% if is_general and admission.formation.campus in sport_affiliation_choices_by_campus %}
       {% field_data _('Would you like to join the sport activities? If so, the cost of membership will be added to your tuition fee.') accounting.affiliation_sport|enum_display:'ChoixAffiliationSport' %}
     {% endif %}
     {% field_data _("Would you like to become a Solidarity Student, that is, a member of a programme proposed by UCLouvain's NGO, Louvain Cooperation? This membership will give you access to a fund for your solidarity projects. If so, the membership cost, which is E12, will be added to your tuition fee.") accounting.etudiant_solidaire %}
-  {% endpanel %}
+  {% endcomponent %}
 
-  {% panel _('Bank account') %}
+  {% component "panel" title=_('Bank account') %}
     {% field_data _('Would you like to enter an account number so that we can issue a refund?') accounting.type_numero_compte|enum_display:'ChoixTypeCompteBancaire' %}
     {% if accounting.type_numero_compte == 'IBAN' %}
       <dl>
@@ -206,7 +206,7 @@
         {% field_data _('Account holder surname') accounting.nom_titulaire_compte css_class="col-md-6"  %}
       </div>
     {% endif %}
-  {% endpanel %}
+  {% endcomponent %}
 {% endblock %}
 
 {% block style %}

templates/admission/details/coordonnees.html

@@ -1,5 +1,5 @@
 {% extends base_template %}
-{% load i18n static admission index %}
+{% load component_tags i18n static admission index %}
 
 {% comment "License" %}
 * OSIS stands for Open Student Information System. It's an application
@@ -26,7 +26,7 @@
 {% endcomment %}
 
 {% block tab_content %}
-    {% panel _("Legal domicile") %}
+    {% component "panel" title=_("Legal domicile") %}
         <div class="row">
             <div class="col-md-4">{% field_data _("Street") coordonnees.residential.street %}</div>
             {% trans "Number" context "address" as address_number_label %}
@@ -39,10 +39,10 @@
             <div class="col-md-4">{% field_data _("Postcode") coordonnees.residential.postal_code %}</div>
             <div class="col-md-4">{% field_data _("City") coordonnees.residential.city %}</div>
         </div>
-    {% endpanel %}
+    {% endcomponent %}
     {% if coordonnees.contact %}
         {% translate 'Postal address' context 'admission' as contact_panel_title %}
-        {% panel contact_panel_title %}
+        {% component "panel" title=contact_panel_title %}
             <div class="row">
                 <div class="col-md-4">{% field_data _("Street") coordonnees.contact.street %}</div>
                 {% trans "Number" context "address" as address_number_label %}
@@ -55,9 +55,9 @@
                 <div class="col-md-4">{% field_data _("Postcode") coordonnees.contact.postal_code %}</div>
                 <div class="col-md-4">{% field_data _("City") coordonnees.contact.city %}</div>
             </div>
-        {% endpanel %}
+        {% endcomponent %}
     {% endif %}
-    {% panel _("Contact") %}
+    {% component "panel" title=_("Contact") %}
         <div class="row">
             {% trans "Telephone (mobile)" context "admission" as mobile_phone_label %}
             {% field_data mobile_phone_label coordonnees.phone_mobile "col-md-6" %}
@@ -67,5 +67,5 @@
         <div class="row">
             {% field_data _('Emergency contact (telephone number)') coordonnees.emergency_contact_phone "col-md-6" %}
         </div>
-    {% endpanel %}
+    {% endcomponent %}
 {% endblock %}

templates/admission/details/curriculum.html

@@ -1,5 +1,5 @@
 {% extends base_template %}
-{% load i18n admission %}
+{% load component_tags i18n admission %}
 
 {% comment "License" %}
 * OSIS stands for Open Student Information System. It's an application
@@ -29,7 +29,7 @@
   {% include 'admission/includes/common_curriculum.html' %}
 
   {% if display_equivalence or display_curriculum or specific_questions %}
-    {% panel _('Specific aspects') %}
+    {% component "panel" title=_('Specific aspects') %}
 
       {% if display_equivalence %}
         {% field_data _("Copy of equivalency decision issued by the French Community of Belgium making your bachelor's diploma (bac+5) equivalent to the academic rank of a corresponding master's degree.") admission.equivalence_diplome %}
@@ -41,7 +41,7 @@
 
       {% multiple_field_data specific_questions title='' %}
 
-    {% endpanel %}
+    {% endcomponent %}
   {% endif %}
 
 {% endblock %}

templates/admission/details/education.html

@@ -36,5 +36,5 @@
 {% endblock %}
 
 {% block tab_content %}
-  {% include 'admission/exports/recap/includes/education.html' %}
+  {% include 'admission/exports/recap/includes/education.html' with edit_link_button_in_new_tab=False %}
 {% endblock %}

templates/admission/details/person.html

@@ -1,5 +1,5 @@
 {% extends base_template %}
-{% load i18n static admission index enums academic_year_display %}
+{% load component_tags i18n static admission index enums academic_year_display %}
 
 {% comment "License" %}
 * OSIS stands for Open Student Information System. It's an application
@@ -26,7 +26,7 @@
 {% endcomment %}
 
 {% block tab_content %}
-    {% panel _("Identification") %}
+    {% component "panel" title=_("Identification") %}
         <div style="display:flex; flex-direction: row;">
 
             <div class="original-person-data" style="flex: 1;">
@@ -101,9 +101,9 @@
             {% endif %}
 
         </div>
-    {% endpanel %}
+    {% endcomponent %}
 
-    {% panel _("Identity document") %}
+    {% component "panel" title=_("Identity document") %}
 
         <div style="display:flex; flex-direction: row;">
 
@@ -147,11 +147,9 @@
         {% endif %}
 
         </div>
+    {% endcomponent %}
 
-
-    {% endpanel %}
-
-    {% panel _("Former UCLouvain student") %}
+    {% component "panel" title=_("Former UCLouvain student") %}
         {% if person.last_registration_year %}
             {% field_data _('Have you previously enrolled at UCLouvain?') _('Yes') %}
             <div class="row">
@@ -161,7 +159,7 @@
         {% else %}
             {% field_data _('Have you previously enrolled at UCLouvain?') _('No') %}
         {% endif %}
-    {% endpanel %}
+    {% endcomponent %}
 {% endblock %}
 
 {% block script %}

templates/admission/details/training_choice.html

@@ -1,5 +1,5 @@
 {% extends base_template %}
-{% load bootstrap3 i18n static waffle_tags academic_year_display admission enums%}
+{% load component_tags bootstrap3 i18n static waffle_tags academic_year_display admission enums%}
 
 {% comment "License" %}
   * OSIS stands for Open Student Information System. It's an application
@@ -26,7 +26,7 @@
 {% endcomment %}
 
 {% block tab_content %}
-  {% panel _('Choose your course') %}
+  {% component "panel" title=_('Choose your course') %}
     {% field_data _('Course name') admission.formation.intitule %}
     {% field_data _('Campus') admission.formation.campus %}
     {% if view.is_continuing %}
@@ -35,11 +35,11 @@
     {% switch 'debug' %}
       {% field_data _('Academic year') admission.formation.annee|get_academic_year css_class='debug-content' %}
     {% endswitch %}
-  {% endpanel %}
+  {% endcomponent %}
 
   {% if admission.formation.type|admission_training_type == 'MASTER' %}
     {% translate 'Specific profile' context 'admission' as specific_profile_title %}
-    {% panel specific_profile_title %}
+    {% component "panel" title=specific_profile_title %}
       {% with admission.bourse_double_diplome.nom_court|default:_('No') as short_name %}
         {% field_data _('Dual degree scholarship') admission.bourse_double_diplome.nom_long|default:short_name %}
       {% endwith %}
@@ -49,7 +49,7 @@
       {% with admission.bourse_erasmus_mundus.nom_court|default:_('No') as short_name %}
         {% field_data _('Erasmus Mundus') admission.bourse_erasmus_mundus.nom_long|default:short_name %}
       {% endwith %}
-    {% endpanel %}
+    {% endcomponent %}
   {% endif %}
 
   {% if view.is_continuing %}