From cc7cdd89940315634db678a068240953e3bc3c0c Mon Sep 17 00:00:00 2001
From: cubicroot <cccv@cubicroot.xyz>
Date: Mon, 23 Dec 2024 18:49:21 +0000
Subject: [PATCH] improve invitations UI

---
 .../locale/de/LC_MESSAGES/django.po           | 45 +++++++++++++------
 .../locale/en/LC_MESSAGES/django.po           | 43 +++++++++++++-----
 src/backoffice/static/backoffice.css          |  4 ++
 .../components/invitations_list.html          | 36 ++++++++++++++-
 .../backoffice/invitations/create_edit.html   | 12 ++---
 .../backoffice/invitations/detail.html        | 33 ++++++--------
 .../backoffice/invitations/list.html          |  4 +-
 .../templates/backoffice/teams/list.html      |  2 +
 src/backoffice/views/invitations/__init__.py  |  5 +--
 src/core/locale/de/LC_MESSAGES/django.po      |  2 +-
 src/core/locale/en/LC_MESSAGES/django.po      |  2 +-
 11 files changed, 130 insertions(+), 58 deletions(-)

diff --git a/src/backoffice/locale/de/LC_MESSAGES/django.po b/src/backoffice/locale/de/LC_MESSAGES/django.po
index cbaabc601..72e7f5436 100644
--- a/src/backoffice/locale/de/LC_MESSAGES/django.po
+++ b/src/backoffice/locale/de/LC_MESSAGES/django.po
@@ -774,9 +774,8 @@ msgstr "Wiki"
 msgid "nav_schedules"
 msgstr "Schedules"
 
-# Use translation from core
 msgid "Invitations"
-msgstr ""
+msgstr "Einladungen"
 
 msgid "Conference__Selection"
 msgstr "Konferenz auswählen"
@@ -823,9 +822,31 @@ msgstr "Keine Activity Log Einträge"
 msgid "Cancel"
 msgstr "Abbrechen"
 
-#, python-format
-msgid "Invitation__description %(requester)s %(requested)s %(type)s"
-msgstr "Die Einladung von  \"%(requester)s\" an \"%(requested)s\" (Art: %(type)s)"
+msgid "User"
+msgstr ""
+
+msgid "invited to"
+msgstr "eingeladen zu"
+
+# use translation from core
+msgid "Team"
+msgstr ""
+
+msgid "requested to join"
+msgstr "möchte beitreten zu"
+
+# use translation from core
+msgid "Assembly"
+msgstr ""
+
+msgid "Habitat"
+msgstr ""
+
+msgid "Invitation_from"
+msgstr "Einladung von"
+
+msgid "Invitation_for"
+msgstr "Einladung für"
 
 msgid "Invitation__action__edit"
 msgstr "Bearbeiten"
@@ -960,6 +981,9 @@ msgstr "Aktualisieren"
 msgid "No comment"
 msgstr ""
 
+msgid "Invitations__intro"
+msgstr "Hier findest du Einladungen und Anfragen rund um Benutzende, Habitate, Teams und mehr. Du kannst Anfragen, z.b. an Teams, stellen oder du wirst, z.B. von einem Team, eingeladen. Nehme Einladungen an, ziehe sie zurück oder verändere sie. Entitäten können sich Teils auch gegenseitig einladen/anfragen - mehr dazu findest du auf den Detail-Ansichten der Entitäten."
+
 msgid "Invitations__list__title"
 msgstr "Ausstehende Einladungen"
 
@@ -1041,10 +1065,6 @@ msgstr "letzte Änderung"
 msgid "Badge__name"
 msgstr ""
 
-# use translation from core
-msgid "Assembly"
-msgstr ""
-
 # use translation from core
 msgid "Badge__state"
 msgstr ""
@@ -1450,10 +1470,6 @@ msgstr "Self-organized Session löschen"
 msgid "SoS__delete__introduction"
 msgstr "Hiermit wird diese Self-organized Session gelöscht. Wenn du sie nur unsichtbar machen möchtest gibt es weiter oben die Möglichkeit die Self-organized Session zurückzunehmen!"
 
-# use translation from core
-msgid "Team"
-msgstr ""
-
 msgid "Team__create__title"
 msgstr "Neues Team erstellen"
 
@@ -1554,6 +1570,9 @@ msgstr "Hiermit wird dieses Team gelöscht. Dies kann nicht rückgängig gemacht
 msgid "Team__delete__button"
 msgstr "Team löschen"
 
+msgid "Team__intro"
+msgstr "Teams erlauben es Rechte im Backoffice gebündelt zu vergeben. Jedem Team sind bestimmte Rechte zugeordnet die alle Teammitglieder erhalten. Benutzende können im Backoffice anfragen in ein Team aufgenommen zu werden. Teammitglieder mit Verwaltungsrechten können Benutzende einladen und Anfragen akzeptieren."
+
 msgid "Team__member_count"
 msgstr "Mitgliederanzahl"
 
diff --git a/src/backoffice/locale/en/LC_MESSAGES/django.po b/src/backoffice/locale/en/LC_MESSAGES/django.po
index 0fc438364..2f9369195 100644
--- a/src/backoffice/locale/en/LC_MESSAGES/django.po
+++ b/src/backoffice/locale/en/LC_MESSAGES/django.po
@@ -774,7 +774,6 @@ msgstr "Wiki"
 msgid "nav_schedules"
 msgstr "Schedules"
 
-# use translation from core
 msgid "Invitations"
 msgstr ""
 
@@ -823,9 +822,31 @@ msgstr "No activity log entries"
 msgid "Cancel"
 msgstr ""
 
-#, python-format
-msgid "Invitation__description %(requester)s %(requested)s %(type)s"
-msgstr "Invitation from \"%(requester)s\" to \"%(requested)s\" (type: %(type)s)"
+msgid "User"
+msgstr ""
+
+msgid "invited to"
+msgstr ""
+
+# use translation from core
+msgid "Team"
+msgstr ""
+
+msgid "requested to join"
+msgstr "requested to join"
+
+# use translation from core
+msgid "Assembly"
+msgstr ""
+
+msgid "Habitat"
+msgstr ""
+
+msgid "Invitation_from"
+msgstr "Invitation from"
+
+msgid "Invitation_for"
+msgstr "Invitation for"
 
 msgid "Invitation__action__edit"
 msgstr "Edit"
@@ -961,6 +982,9 @@ msgstr "Update"
 msgid "No comment"
 msgstr ""
 
+msgid "Invitations__intro"
+msgstr "Here you will find invitations and request related to users, habitats, teams and more. You can request, e.g. a team, to join, or you can be invited, e.g. by a team. Accept invitations, reject them and edit them. Entities can sometimes invite/request to join each other - if so you will find more at the entities detail page."
+
 msgid "Invitations__list__title"
 msgstr "Open invitations"
 
@@ -1042,10 +1066,6 @@ msgstr "last update"
 msgid "Badge__name"
 msgstr ""
 
-# use translation from core
-msgid "Assembly"
-msgstr ""
-
 # use translation from core
 msgid "Badge__state"
 msgstr ""
@@ -1455,10 +1475,6 @@ msgstr "Delete self-organized session"
 msgid "SoS__delete__introduction"
 msgstr "This removes this self-organized session. If you only want to make it invisible, there is an option above to recall the self-organized session above!"
 
-# use translation from core
-msgid "Team"
-msgstr ""
-
 msgid "Team__create__title"
 msgstr "Create team"
 
@@ -1559,6 +1575,9 @@ msgstr "This deletes this Team. This action cannot be reversed!"
 msgid "Team__delete__button"
 msgstr "Delete team"
 
+msgid "Team__intro"
+msgstr "Teams allow to hand out permissions to users in bulk. Every team has specific permissions which all members will automatically get assigned. Users can request to join a team in the backoffice. Members with management rights can invite users and accept their requests."
+
 msgid "Team__member_count"
 msgstr "members count"
 
diff --git a/src/backoffice/static/backoffice.css b/src/backoffice/static/backoffice.css
index 96469ab0e..cc113be52 100644
--- a/src/backoffice/static/backoffice.css
+++ b/src/backoffice/static/backoffice.css
@@ -66,3 +66,7 @@
 .pb-10rem {
   padding-bottom: 10rem;
 }
+
+.badge-large {
+  font-size: 0.93rem;
+}
diff --git a/src/backoffice/templates/backoffice/components/invitations_list.html b/src/backoffice/templates/backoffice/components/invitations_list.html
index 89b74e928..ba6abf462 100644
--- a/src/backoffice/templates/backoffice/components/invitations_list.html
+++ b/src/backoffice/templates/backoffice/components/invitations_list.html
@@ -10,7 +10,41 @@
         {% has_perm 'core.accept_invitation' request.user invitation as can_accept %}
         {% if can_change or can_accept %}
           <li class="list-group-item">
-            {% blocktrans with requester=invitation.requester.name requested=invitation.requested.name type=invitation.get_type_display  %}Invitation__description {{ requester }} {{ requested }} {{ type }}{% endblocktrans %}
+
+            <span class="badge bg-primary">{{ invitation.get_type_display }}</span>
+            <br>
+
+            {% if invitation.type == 'TEAM_TO_MEMBER' %}
+
+              {% trans "User" %}
+              <span class="badge text-bg-light border border-secondary-subtle">{{ invitation.requested.name }}</span>
+              {% trans "invited to" %} {% trans "Team" %}
+              <span class="badge text-bg-light border border-secondary-subtle">{{ invitation.requester.name }}</span>
+
+            {% elif invitation.type == 'MEMBER_TO_TEAM' %}
+
+              {% trans "User" %}
+              <span class="badge text-bg-light border border-secondary-subtle">{{ invitation.requester.name }}</span>
+              {% trans "requested to join" %} {% trans "Team" %}
+              <span class="badge text-bg-light border border-secondary-subtle">{{ invitation.requested.name }}</span>
+
+            {% elif invitation.type == 'HABITAT' %}
+
+              {% trans "Assembly" %}
+              <span class="badge text-bg-light border border-secondary-subtle">{{ invitation.requester.name }}</span>
+              {% trans "requested to join" %} {% trans "Habitat" %}
+              <span class="badge text-bg-light border border-secondary-subtle">{{ invitation.requested.name }}</span>
+
+            {% else %}
+
+              {% trans "Invitation_from" %}
+              <span class="badge text-bg-light border border-secondary-subtle">{{ invitation.requester.name }}</span>
+              <br>
+              {% trans "Invitation_for" %}
+              <span class="badge text-bg-light border border-secondary-subtle">{{ invitation.requested.name }}</span>
+
+            {% endif %}
+
             <span class="float-end">
               <form method='post'
                     action="{% url "backoffice:invitation-decision" pk=invitation.pk %}">
diff --git a/src/backoffice/templates/backoffice/invitations/create_edit.html b/src/backoffice/templates/backoffice/invitations/create_edit.html
index 0094d2667..2509c728e 100644
--- a/src/backoffice/templates/backoffice/invitations/create_edit.html
+++ b/src/backoffice/templates/backoffice/invitations/create_edit.html
@@ -32,7 +32,7 @@
       <div class="card-body">
         <div class="row">
           <div class="col-md-12">
-            <p>{{ introduction_text }}</p>
+            <div class="alert alert-info">{{ introduction_text }}</div>
           </div>
         </div>
         {% if form.non_field_errors %}
@@ -84,7 +84,7 @@
             <div class="col-md-4">
               {% if form.requester_link %}
                 <a id="requester"
-                   class="form-control-plaintext"
+                   class="badge text-bg-light border border-secondary-subtle badge-large"
                    href="{{ form.requester_link }}"
                    target="_blank">{{ form.instance.requester.name }}</a>
               {% else %}
@@ -98,7 +98,7 @@
             <div class="col-md-4">
               {% if form.requested_link %}
                 <a id="requested"
-                   class="form-control-plaintext"
+                   class="badge text-bg-light border border-secondary-subtle badge-large"
                    href="{{ form.requested_link }}"
                    target="_blank">{{ form.instance.requested.name }}</a>
               {% else %}
@@ -132,7 +132,8 @@
             <div class="col-md-4">
               <input type="text"
                      id="sender"
-                     class="form-control-plaintext"
+                     disabled
+                     class="form-control"
                      value="{{ invitation.sender }}">
             </div>
             {% if invitation.decision_by %}
@@ -140,7 +141,8 @@
               <div class="col-md-4">
                 <input type="text"
                        id="decision_by"
-                       class="form-control-plaintext"
+                       disabled
+                       class="form-control"
                        value="{{ invitation.decision_by }}">
               </div>
             {% endif %}
diff --git a/src/backoffice/templates/backoffice/invitations/detail.html b/src/backoffice/templates/backoffice/invitations/detail.html
index c1949ec42..c061741ca 100644
--- a/src/backoffice/templates/backoffice/invitations/detail.html
+++ b/src/backoffice/templates/backoffice/invitations/detail.html
@@ -33,7 +33,7 @@
         {% if invitation.state == "requested" %}
           <div class="row">
             <div class="col-md-12">
-              <p>{{ introduction_text }}</p>
+              <div class="alert alert-info">{{ introduction_text }}</div>
             </div>
           </div>
         {% endif %}
@@ -43,7 +43,7 @@
           <div class="col-md-4">
             {% if requester_link %}
               <a id="requester"
-                 class="form-control-plaintext"
+                 class="badge text-bg-light border border-secondary-subtle badge-large"
                  href="{{ requester_link }}"
                  target="_blank">{{ invitation.requester.name }}</a>
             {% else %}
@@ -57,7 +57,7 @@
           <div class="col-md-4">
             {% if requested_link %}
               <a id="requested"
-                 class="form-control-plaintext"
+                 class="badge text-bg-light border border-secondary-subtle badge-large"
                  href="{{ requested_link }}"
                  target="_blank">{{ invitation.requested.name }}</a>
             {% else %}
@@ -91,7 +91,8 @@
           <div class="col-md-4">
             <input type="text"
                    id="sender"
-                   class="form-control-plaintext"
+                   class="form-control"
+                   disabled
                    value="{{ invitation.sender }}">
           </div>
           {% if invitation.decision_by %}
@@ -99,7 +100,8 @@
             <div class="col-md-4">
               <input type="text"
                      id="decision_by"
-                     class="form-control-plaintext"
+                     class="form-control"
+                     disabled
                      value="{{ invitation.decision_by }}">
             </div>
           {% endif %}
@@ -110,21 +112,12 @@
           </div>
         {% else %}
           <div class="row">
-            {% if invitation.comment %}
-              <div class="col-md-12">
-                <label for="comment" class="form-label">{{ invitation|verbose_name:"comment" }}</label>
-                <textarea name="comment" id="comment" class="form-control-plaintext" rows="3">{{ invitation.comment }}</textarea>
-              </div>
-            {% else %}
-              <label for="requested" class="col-md-2 col-form-label">{{ invitation|verbose_name:"comment" }}</label>
-              <div class="col-md-10">
-                <input type="text"
-                       name="requested"
-                       id="requested"
-                       class="form-control-plaintext"
-                       value="{% trans "No comment" %}">
-              </div>
-            {% endif %}
+
+            <div class="col-md-12">
+              <label for="comment" class="form-label">{{ invitation|verbose_name:"comment" }}</label>
+              <textarea name="comment" id="comment" class="form-control" disabled rows="3">{% if invitation.comment %}{{ invitation.comment }}{% else %}{% trans "No comment" %}{% endif %}</textarea>
+            </div>
+
           </div>
         {% endif %}
 
diff --git a/src/backoffice/templates/backoffice/invitations/list.html b/src/backoffice/templates/backoffice/invitations/list.html
index cdc6a601d..7e4aad27b 100644
--- a/src/backoffice/templates/backoffice/invitations/list.html
+++ b/src/backoffice/templates/backoffice/invitations/list.html
@@ -4,10 +4,12 @@
 {% load rules %}
 
 {% block title %}
-  {{ title_text }} | {{ invitation.conference.name }}
+  {{ title_text }} | {{ conference.name }}
 {% endblock title %}
 
 {% block content %}
+  <div class="alert alert-info">{% trans "Invitations__intro" %}</div>
+
   {% include "backoffice/assembly_edit_header.html" %}
 
   {% trans "Invitations__list__title" as list_title %}
diff --git a/src/backoffice/templates/backoffice/teams/list.html b/src/backoffice/templates/backoffice/teams/list.html
index a42244d76..56c9086db 100644
--- a/src/backoffice/templates/backoffice/teams/list.html
+++ b/src/backoffice/templates/backoffice/teams/list.html
@@ -21,6 +21,8 @@
     </div>
     <div class="card-body">
 
+      <p>{% trans "Team__intro" %}</p>
+
       {% if filter_tag is not None %}
         <div class="alert alert-info">
           {% trans "assemblies_filtered_tag" %}: <strong>{{ filter_tag }}</strong>
diff --git a/src/backoffice/views/invitations/__init__.py b/src/backoffice/views/invitations/__init__.py
index 5bdf91917..645af8428 100644
--- a/src/backoffice/views/invitations/__init__.py
+++ b/src/backoffice/views/invitations/__init__.py
@@ -22,10 +22,7 @@ class InvitationListView(ConferenceLoginRequiredMixin, ListView):
         return super().get_queryset().filter(state=Invitation.RequestsState.REQUESTED)
 
     def get_context_data(self, **kwargs):
-        return {
-            **super().get_context_data(**kwargs),
-            'active_page': 'invitations',
-        }
+        return {**super().get_context_data(**kwargs), 'active_page': 'invitations', 'title_text': _('Invitations')}
 
 
 class InvitationDetailView(ConferenceRuleRequiredMixin, AutoPermissionRequiredMixin, DetailView):
diff --git a/src/core/locale/de/LC_MESSAGES/django.po b/src/core/locale/de/LC_MESSAGES/django.po
index ff3f6a27a..d53a77fcf 100644
--- a/src/core/locale/de/LC_MESSAGES/django.po
+++ b/src/core/locale/de/LC_MESSAGES/django.po
@@ -1201,7 +1201,7 @@ msgid "Invitation__comment"
 msgstr "Kommentar"
 
 msgid "Invitation__comment__help_text"
-msgstr "Anzahl der Verwendungen für diesen Link (Standard: 1). Wenn nichts angegeben wird, kann der Link beliebig oft verwendet werden."
+msgstr "Kommentar zur Einladung. Kann etwa für persönliche Notizen oder Gründe warum die Einladung gerechtfertigt ist genutzt werden. Kann von der eingeladenen Person und allen die die Einladung verwalten können gelesen werden."
 
 msgid "Invitation__requested_at"
 msgstr "Einladungsdatum"
diff --git a/src/core/locale/en/LC_MESSAGES/django.po b/src/core/locale/en/LC_MESSAGES/django.po
index 14cfc2fcf..4eac17f38 100644
--- a/src/core/locale/en/LC_MESSAGES/django.po
+++ b/src/core/locale/en/LC_MESSAGES/django.po
@@ -1201,7 +1201,7 @@ msgid "Invitation__comment"
 msgstr "comment"
 
 msgid "Invitation__comment__help_text"
-msgstr "Number of uses for this link (Default: 1). If left blank, the link can be used any number of times."
+msgstr "Comment on the invitation. Can be used for personal notes or reasons why the invite is required. Can be read by the invited person and everyone managaing invitations."
 
 msgid "Invitation__requested_at"
 msgstr "invitation date"
-- 
GitLab