From 8ff8d55d6d35bd602da0172c73d89539a6249308 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Mon, 26 Sep 2022 21:40:10 +0200
Subject: [PATCH 1/5] Implement 'GroupButton' in 'default' layout

---
 webapp/components/Group/GroupButton.vue | 5 +++++
 webapp/layouts/default.vue              | 7 ++++++-
 2 files changed, 11 insertions(+), 1 deletion(-)
 create mode 100644 webapp/components/Group/GroupButton.vue

diff --git a/webapp/components/Group/GroupButton.vue b/webapp/components/Group/GroupButton.vue
new file mode 100644
index 000000000..2000e3046
--- /dev/null
+++ b/webapp/components/Group/GroupButton.vue
@@ -0,0 +1,5 @@
+<template>
+  <div>
+    <nuxt-link to="/my-groups"><base-button icon="users" circle ghost /></nuxt-link>
+  </div>
+</template>
diff --git a/webapp/layouts/default.vue b/webapp/layouts/default.vue
index 3e2a4aa69..b23ed98ea 100644
--- a/webapp/layouts/default.vue
+++ b/webapp/layouts/default.vue
@@ -88,6 +88,9 @@
                       <invite-button placement="top" />
                     </client-only>
                   </div>
+                  <client-only>
+                    <group-button />
+                  </client-only>
                   <client-only>
                     <avatar-menu placement="top" />
                   </client-only>
@@ -125,7 +128,8 @@ import FilterMenu from '~/components/FilterMenu/FilterMenu.vue'
 import PageFooter from '~/components/PageFooter/PageFooter'
 import AvatarMenu from '~/components/AvatarMenu/AvatarMenu'
 import InviteButton from '~/components/InviteButton/InviteButton'
-import CategoriesMenu from '~/components/FilterMenu/CategoriesMenu.vue'
+import CategoriesMenu from '~/components/FilterMenu/CategoriesMenu'
+import GroupButton from '~/components/Group/GroupButton'
 
 export default {
   components: {
@@ -139,6 +143,7 @@ export default {
     PageFooter,
     InviteButton,
     CategoriesMenu,
+    GroupButton,
   },
   mixins: [seo],
   data() {

From 60b68ed63c8f1993095b78c1b8fe76cbdc8fb581 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Tue, 27 Sep 2022 13:47:01 +0200
Subject: [PATCH 2/5] Add 'SHOW_GROUP_BUTTON_IN_HEADER' in 'groups.js', still
 unused

---
 webapp/constants/groups.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/webapp/constants/groups.js b/webapp/constants/groups.js
index 3abf0d12a..1c49d3ff3 100644
--- a/webapp/constants/groups.js
+++ b/webapp/constants/groups.js
@@ -2,3 +2,4 @@
 export const NAME_LENGTH_MIN = 3
 export const NAME_LENGTH_MAX = 50
 export const DESCRIPTION_WITHOUT_HTML_LENGTH_MIN = 100 // with removed HTML tags
+export const SHOW_GROUP_BUTTON_IN_HEADER = true

From 8867f8674f318d614c8cf9c13a36ebd1ac466a20 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Tue, 27 Sep 2022 16:09:33 +0200
Subject: [PATCH 3/5] Make group button in header configurable

---
 webapp/layouts/default.vue | 20 +++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

diff --git a/webapp/layouts/default.vue b/webapp/layouts/default.vue
index b23ed98ea..6fb3a2f54 100644
--- a/webapp/layouts/default.vue
+++ b/webapp/layouts/default.vue
@@ -88,7 +88,7 @@
                       <invite-button placement="top" />
                     </client-only>
                   </div>
-                  <client-only>
+                  <client-only v-if="SHOW_GROUP_BUTTON_IN_HEADER">
                     <group-button />
                   </client-only>
                   <client-only>
@@ -115,21 +115,22 @@
 </template>
 
 <script>
-import Logo from '~/components/Logo/Logo'
-import LOGOS from '../constants/logos.js'
-import headerMenu from '../constants/headerMenu.js'
 import { mapGetters } from 'vuex'
+import Logo from '~/components/Logo/Logo'
+import { SHOW_GROUP_BUTTON_IN_HEADER } from '~/constants/groups.js'
+import headerMenu from '~/constants/headerMenu.js'
+import LOGOS from '~/constants/logos.js'
+import seo from '~/mixins/seo'
 import LocaleSwitch from '~/components/LocaleSwitch/LocaleSwitch'
 import SearchField from '~/components/features/SearchField/SearchField.vue'
 import Modal from '~/components/Modal'
-import NotificationMenu from '~/components/NotificationMenu/NotificationMenu'
-import seo from '~/mixins/seo'
-import FilterMenu from '~/components/FilterMenu/FilterMenu.vue'
-import PageFooter from '~/components/PageFooter/PageFooter'
 import AvatarMenu from '~/components/AvatarMenu/AvatarMenu'
-import InviteButton from '~/components/InviteButton/InviteButton'
 import CategoriesMenu from '~/components/FilterMenu/CategoriesMenu'
+import FilterMenu from '~/components/FilterMenu/FilterMenu.vue'
 import GroupButton from '~/components/Group/GroupButton'
+import InviteButton from '~/components/InviteButton/InviteButton'
+import NotificationMenu from '~/components/NotificationMenu/NotificationMenu'
+import PageFooter from '~/components/PageFooter/PageFooter'
 
 export default {
   components: {
@@ -149,6 +150,7 @@ export default {
   data() {
     return {
       LOGOS,
+      SHOW_GROUP_BUTTON_IN_HEADER,
       isHeaderMenu: headerMenu.MENU.length > 0,
       menu: headerMenu.MENU,
       mobileSearchVisible: false,

From f62df1f4aadeaee456859cf6842540e4fd135201 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Tue, 27 Sep 2022 16:10:17 +0200
Subject: [PATCH 4/5] Add 'my groups' to avatar menu

---
 webapp/components/AvatarMenu/AvatarMenu.vue | 7 ++++++-
 webapp/locales/de.json                      | 7 ++++++-
 webapp/locales/en.json                      | 7 ++++++-
 3 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/webapp/components/AvatarMenu/AvatarMenu.vue b/webapp/components/AvatarMenu/AvatarMenu.vue
index 061e96221..5caec07f2 100644
--- a/webapp/components/AvatarMenu/AvatarMenu.vue
+++ b/webapp/components/AvatarMenu/AvatarMenu.vue
@@ -72,10 +72,15 @@ export default {
       }
       const routes = [
         {
-          name: this.$t('profile.name'),
+          name: this.$t('header.avatarMenu.myProfile'),
           path: `/profile/${this.user.id}/${this.user.slug}`,
           icon: 'user',
         },
+        {
+          name: this.$t('header.avatarMenu.myGroups'),
+          path: '/my-groups',
+          icon: 'users',
+        },
         {
           name: this.$t('notifications.pageLink'),
           path: '/notifications',
diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index d9590709f..fd3c7a666 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -443,6 +443,12 @@
     "hashtag-search": "Suche nach #{hashtag}",
     "title": "Deine Filterblase"
   },
+  "header": {
+    "avatarMenu": {
+      "myGroups": "Mein Gruppen",
+      "myProfile": "Mein Profil"
+    }
+  },
   "index": {
     "change-filter-settings": "Verändere die Filter-Einstellungen, um mehr Ergebnisse zu erhalten.",
     "no-results": "Keine Beiträge gefunden."
@@ -601,7 +607,6 @@
       "title": "Lade jemanden zu {APPLICATION_NAME} ein!"
     },
     "memberSince": "Mitglied seit",
-    "name": "Mein Profil",
     "network": {
       "andMore": "und {number} weitere …",
       "followedBy": "wird gefolgt von:",
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index ac06d1bce..c8a4bd78e 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -443,6 +443,12 @@
     "hashtag-search": "Searching for #{hashtag}",
     "title": "Your filter bubble"
   },
+  "header": {
+    "avatarMenu": {
+      "myGroups": "My groups",
+      "myProfile": "My profile"
+    }
+  },
   "index": {
     "change-filter-settings": "Change your filter settings to get more results.",
     "no-results": "No contributions found."
@@ -601,7 +607,6 @@
       "title": "Invite somebody to {APPLICATION_NAME}!"
     },
     "memberSince": "Member since",
-    "name": "My Profile",
     "network": {
       "andMore": "and {number} more …",
       "followedBy": "is followed by:",

From 421f8a69a24a14c6a65eb416f873daa60333d434 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Tue, 27 Sep 2022 16:28:23 +0200
Subject: [PATCH 5/5] Enhance tests of 'AvatarMenu'

---
 .../components/AvatarMenu/AvatarMenu.spec.js  | 20 +++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/webapp/components/AvatarMenu/AvatarMenu.spec.js b/webapp/components/AvatarMenu/AvatarMenu.spec.js
index 77de68de4..15f536ee7 100644
--- a/webapp/components/AvatarMenu/AvatarMenu.spec.js
+++ b/webapp/components/AvatarMenu/AvatarMenu.spec.js
@@ -90,6 +90,13 @@ describe('AvatarMenu.vue', () => {
           expect(profileLink.exists()).toBe(true)
         })
 
+        it('displays a link to "My groups"', () => {
+          const profileLink = wrapper
+            .findAll('.ds-menu-item span')
+            .at(wrapper.vm.routes.findIndex((route) => route.path === '/my-groups'))
+          expect(profileLink.exists()).toBe(true)
+        })
+
         it('displays a link to the notifications page', () => {
           const notificationsLink = wrapper
             .findAll('.ds-menu-item span')
@@ -103,6 +110,11 @@ describe('AvatarMenu.vue', () => {
             .at(wrapper.vm.routes.findIndex((route) => route.path === '/settings'))
           expect(settingsLink.exists()).toBe(true)
         })
+
+        it('displays a total of 4 links', () => {
+          const allLinks = wrapper.findAll('.ds-menu-item')
+          expect(allLinks).toHaveLength(4)
+        })
       })
 
       describe('role moderator', () => {
@@ -125,9 +137,9 @@ describe('AvatarMenu.vue', () => {
           expect(moderationLink.exists()).toBe(true)
         })
 
-        it('displays a total of 4 links', () => {
+        it('displays a total of 5 links', () => {
           const allLinks = wrapper.findAll('.ds-menu-item')
-          expect(allLinks).toHaveLength(4)
+          expect(allLinks).toHaveLength(5)
         })
       })
 
@@ -151,9 +163,9 @@ describe('AvatarMenu.vue', () => {
           expect(adminLink.exists()).toBe(true)
         })
 
-        it('displays a total of 5 links', () => {
+        it('displays a total of 6 links', () => {
           const allLinks = wrapper.findAll('.ds-menu-item')
-          expect(allLinks).toHaveLength(5)
+          expect(allLinks).toHaveLength(6)
         })
       })
     })