Merge pull request #38 from beabee-communityrm/feat/clear-nlgroups

feat: show newsletter group names, and move to new section
beabee-communityrm · Aug 1, 2024 · 9579c82 · 9579c82
2 parents 9616a68 + d0647c6
commit 9579c82
Show file tree

Hide file tree

Showing 9 changed files with 93 additions and 53 deletions.
diff --git a/apps/frontend/locales/de.json b/apps/frontend/locales/de.json
@@ -608,7 +608,11 @@
     "contribution": "Beitrag",
     "contributionType": "Zahlungsart",
     "joinSurvey": "Anmelde-Fragebogen",
-    "newsletter": "Newsletter",
+    "newsletter": {
+      "groups": "Gruppe",
+      "status": "Status",
+      "title": "Newsletter"
+    },
     "overview": "Überblick",
     "pickTag": "Tag aus der Liste wählen",
     "profile": "Profil",
@@ -646,15 +650,14 @@
       "description": "Beschreibung",
       "email": "E-Mail",
       "firstname": "Vorname",
-      "groups": "Gruppe",
       "joined": "Kontakt seit",
       "lastSeen": "Zuletzt angemeldet",
       "lastname": "Nachname",
       "manualPaymentSource": "Manuelle Zahlungsquelle",
       "membershipExpires": "Mitglied bis",
       "membershipStarts": "Mitglied seit",
       "name": "Name",
-      "newsletter": "Newsletter",
+      "newsletterGroups": "Newsletter-Gruppe",
       "newsletterStatus": "Newsletter-Status",
       "notes": "Notizen",
       "payingFee": "Übernimmt Transaktionskosten?",

diff --git a/apps/frontend/locales/de@easy.json b/apps/frontend/locales/de@easy.json
@@ -166,6 +166,7 @@
   },
   "contactOverview": {
     "annotation": {},
+    "newsletter": {},
     "security": {
       "mfa": {}
     }

diff --git a/apps/frontend/locales/de@informal.json b/apps/frontend/locales/de@informal.json
@@ -608,7 +608,11 @@
     "contribution": "Beitrag",
     "contributionType": "Zahlungsart",
     "joinSurvey": "Anmelde-Fragebogen",
-    "newsletter": "Newsletter",
+    "newsletter": {
+      "groups": "Gruppe",
+      "status": "Status",
+      "title": "Newsletter"
+    },
     "overview": "Überblick",
     "pickTag": "Tag aus der Liste wählen",
     "profile": "Profil",
@@ -646,15 +650,14 @@
       "description": "Beschreibung",
       "email": "E-Mail",
       "firstname": "Vorname",
-      "groups": "Gruppe",
       "joined": "Kontakt seit",
       "lastSeen": "Zuletzt angemeldet",
       "lastname": "Nachname",
       "manualPaymentSource": "Manuelles Zahlungsmittel",
       "membershipExpires": "Mitglied bis",
       "membershipStarts": "Mitglied seit",
       "name": "Name",
-      "newsletter": "Newsletter",
+      "newsletterGroups": "Newsletter-Gruppe",
       "newsletterStatus": "Newsletter-Status",
       "notes": "Notizen",
       "payingFee": "Übernimmt Transaktionskosten?",

diff --git a/apps/frontend/locales/en.json b/apps/frontend/locales/en.json
@@ -612,7 +612,11 @@
     "contribution": "Contribution",
     "contributionType": "Type",
     "joinSurvey": "Join survey",
-    "newsletter": "Newsletter",
+    "newsletter": {
+      "groups": "Groups",
+      "status": "Status",
+      "title": "Newsletter"
+    },
     "overview": "Overview",
     "pickTag": "Pick a tag from the list below",
     "profile": "Profile",
@@ -650,15 +654,14 @@
       "description": "Description",
       "email": "Email",
       "firstname": "First name",
-      "groups": "Groups",
       "joined": "Joined",
       "lastSeen": "Last seen",
       "lastname": "Last name",
       "manualPaymentSource": "Manual payment source",
       "membershipExpires": "Member until",
       "membershipStarts": "Member since",
       "name": "Name",
-      "newsletter": "Newsletter",
+      "newsletterGroups": "Newsletter groups",
       "newsletterStatus": "Newsletter status",
       "notes": "Notes",
       "payingFee": "Paying fee?",

diff --git a/apps/frontend/locales/it.json b/apps/frontend/locales/it.json
@@ -210,6 +210,7 @@
   },
   "contactOverview": {
     "annotation": {},
+    "newsletter": {},
     "security": {
       "mfa": {}
     }

diff --git a/apps/frontend/locales/nl.json b/apps/frontend/locales/nl.json
@@ -171,6 +171,7 @@
   },
   "contactOverview": {
     "annotation": {},
+    "newsletter": {},
     "security": {
       "mfa": {
         "disabledDesc": "Deze contactpersoon heeft geen 2FA geactiveerd."

diff --git a/apps/frontend/locales/pt.json b/apps/frontend/locales/pt.json
@@ -378,6 +378,9 @@
   },
   "contactOverview": {
     "annotation": {},
+    "newsletter": {
+      "groups": "Grupos"
+    },
     "security": {
       "mfa": {
         "desc": "Este contato ativou o 2FA. Clica no botão \"{ disableLabel }\" para desativar.",
@@ -402,15 +405,13 @@
       "description": "Descrição",
       "email": "Email",
       "firstname": "Primeiro nome",
-      "groups": "Grupos",
       "joined": "Inscreveu-se em",
       "lastSeen": "Visto pela última vez em",
       "lastname": "Último nome",
       "manualPaymentSource": "Pagamento manual",
       "membershipExpires": "Membro até",
       "membershipStarts": "Membro desde",
       "name": "Nome",
-      "newsletter": "Newsletter",
       "newsletterStatus": "Assinatura da newsletter",
       "notes": "Notas",
       "payingFee": "Paga a taxa?",

diff --git a/apps/frontend/locales/ru.json b/apps/frontend/locales/ru.json
@@ -353,7 +353,11 @@
       "copy": "<p>Вся информация, добавленная в этот раздел, <strong>видна только администраторам</strong>. Участники никогда не увидят их в своем профиле или личном кабинете.</p>\n"
     },
     "contribution": "Взнос",
-    "newsletter": "Новости",
+    "newsletter": {
+      "groups": "Группы",
+      "status": "Статус",
+      "title": "Новости"
+    },
     "overview": "Обзор",
     "roles": "Роль",
     "security": {
@@ -376,7 +380,6 @@
       "deliveryOptIn": "Согласие на доставку",
       "description": "Описание",
       "email": "Почтовый ящик",
-      "groups": "Группы",
       "joined": "Участник с",
       "lastSeen": "Последний раз онлайн",
       "name": "Имя",

diff --git a/apps/frontend/src/pages/admin/contacts/[id]/index.vue b/apps/frontend/src/pages/admin/contacts/[id]/index.vue
@@ -114,40 +114,57 @@ meta:
       </AppForm>
     </template>
     <template #col2>
-      <AppHeading>{{ t('contactOverview.profile') }}</AppHeading>
-      <AppInfoList>
-        <AppInfoListItem
-          :name="t('contacts.data.preferredChannel')"
-          :value="contact.profile.preferredContact"
-        />
-        <AppInfoListItem
-          :name="t('contacts.data.email')"
-          :value="contact.email"
-        />
-        <AppInfoListItem
-          :name="t('contacts.data.phone')"
-          :value="contact.profile.telephone"
-        />
-        <AppInfoListItem
-          :name="t('contacts.data.deliveryOptIn')"
-          :value="
-            contact.profile.deliveryOptIn ? t('common.yes') : t('common.no')
-          "
-        />
-        <AppInfoListItem
-          :name="t('contactOverview.newsletter')"
-          :value="
-            t('common.newsletterStatus.' + contact.profile.newsletterStatus)
-          "
-        />
-        <AppInfoListItem
-          :name="t('contacts.data.groups')"
-          :value="contact.profile.newsletterGroups.join(', ')"
-        />
-      </AppInfoList>
+      <section class="mb-6">
+        <AppHeading>{{ t('contactOverview.profile') }}</AppHeading>
+        <AppInfoList>
+          <AppInfoListItem
+            :name="t('contacts.data.preferredChannel')"
+            :value="contact.profile.preferredContact"
+          />
+          <AppInfoListItem
+            :name="t('contacts.data.email')"
+            :value="contact.email"
+          />
+          <AppInfoListItem
+            :name="t('contacts.data.phone')"
+            :value="contact.profile.telephone"
+          />
+          <AppInfoListItem
+            :name="t('contacts.data.deliveryOptIn')"
+            :value="
+              contact.profile.deliveryOptIn ? t('common.yes') : t('common.no')
+            "
+          />
+        </AppInfoList>
+      </section>
+
+      <section class="mb-6">
+        <AppHeading>{{ t('contactOverview.newsletter.title') }}</AppHeading>
+        <AppInfoList>
+          <AppInfoListItem
+            :name="t('contactOverview.newsletter.status')"
+            :value="
+              t('common.newsletterStatus.' + contact.profile.newsletterStatus)
+            "
+          />
+          <AppInfoListItem
+            :name="t('contactOverview.newsletter.groups')"
+            :value="
+              contact.profile.newsletterGroups
+                .map(
+                  (id) =>
+                    setupContent?.newsletterGroups.find(
+                      (group) => group.id === id
+                    )?.label || id
+                )
+                .join(', ')
+            "
+          />
+        </AppInfoList>
+      </section>
 
       <!-- Security -->
-      <section class="mt-6">
+      <section class="mb-6">
         <AppHeading>{{ t('contactOverview.security.title') }}</AppHeading>
 
         <!-- Multi factor authentication -->
@@ -198,8 +215,8 @@ meta:
         </section>
       </section>
 
-      <template v-if="joinSurvey && joinSurveyResponse">
-        <AppHeading class="mt-6">
+      <section v-if="joinSurvey && joinSurveyResponse" class="mb-6">
+        <AppHeading>
           {{ t('contactOverview.joinSurvey') }}
         </AppHeading>
         <CalloutForm
@@ -209,7 +226,7 @@ meta:
           all-slides
           readonly
         />
-      </template>
+      </section>
     </template>
   </App2ColGrid>
 
@@ -228,7 +245,11 @@ meta:
 
 <script lang="ts" setup>
 import { onBeforeMount, ref, reactive } from 'vue';
-import { ContributionType, type RoleType } from '@beabee/beabee-common';
+import {
+  ContributionType,
+  type ContentJoinSetupData,
+  type RoleType,
+} from '@beabee/beabee-common';
 import { useI18n } from 'vue-i18n';
 import { faCircleNotch, faMobileAlt } from '@fortawesome/free-solid-svg-icons';
 
@@ -362,6 +383,8 @@ async function handleChangedRoles(cb: () => Promise<unknown>) {
   changingRoles.value = false;
 }
 
+const setupContent = ref<ContentJoinSetupData>();
+
 onBeforeMount(async () => {
   contact.value = await fetchContact(props.contact.id, [
     'profile',
@@ -380,11 +403,12 @@ onBeforeMount(async () => {
     mfa.value.isEnabled = true;
   }
 
-  const setupContent = await fetchContent('join/setup');
-  if (setupContent.surveySlug) {
-    joinSurvey.value = await fetchCallout(setupContent.surveySlug, ['form']);
+  setupContent.value = await fetchContent('join/setup');
+  const joinSurveySlug = setupContent.value.surveySlug;
+  if (joinSurveySlug) {
+    joinSurvey.value = await fetchCallout(joinSurveySlug, ['form']);
     const responses = await fetchResponses(
-      setupContent.surveySlug,
+      joinSurveySlug,
       {
         limit: 1,
         order: 'DESC',