From 181207a90b924f237fe620289761492417f9c25f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Wed, 12 Jul 2023 14:28:04 +0200
Subject: [PATCH 1/8] Move chat notification button in header to position
 between language and system notification

- Add this button to mobile as well.
---
 webapp/components/HeaderMenu/HeaderMenu.vue | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/webapp/components/HeaderMenu/HeaderMenu.vue b/webapp/components/HeaderMenu/HeaderMenu.vue
index bef73186b..a08bec882 100644
--- a/webapp/components/HeaderMenu/HeaderMenu.vue
+++ b/webapp/components/HeaderMenu/HeaderMenu.vue
@@ -74,6 +74,10 @@
             <!-- locale switch -->
             <locale-switch class="topbar-locale-switch" placement="top" offset="8" />
             <template v-if="isLoggedIn">
+              <!-- chat menu -->
+              <client-only>
+                <chat-notification-menu placement="top" />
+              </client-only>
               <!-- notification menu -->
               <client-only>
                 <notification-menu placement="top" />
@@ -92,10 +96,6 @@
               <client-only v-if="!isEmpty(this.$env.MAPBOX_TOKEN)">
                 <map-button />
               </client-only>
-              <!-- chat menü -->
-              <client-only>
-                <chat-notification-menu placement="top" />
-              </client-only>
               <!-- avatar menu -->
               <client-only>
                 <avatar-menu placement="top" />
@@ -131,10 +131,16 @@
           <!-- mobile hamburger menu -->
           <ds-flex-item class="mobile-hamburger-menu">
             <client-only>
+              <!-- chat menu -->
+              <div style="display: inline-flex">
+                <chat-notification-menu />
+              </div>
+              <!-- notification menu -->
               <div style="display: inline-flex; padding-right: 20px">
                 <notification-menu />
               </div>
             </client-only>
+            <!-- hamburger menu -->
             <base-button icon="bars" @click="toggleMobileMenuView" circle />
           </ds-flex-item>
         </ds-flex>

From 0eaa4059b3c2321e97633ac76e25c65834a92598 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Wed, 12 Jul 2023 16:05:23 +0200
Subject: [PATCH 2/8] Fix icon and dummy count for chat notification button in
 header menu

---
 webapp/assets/_new/icons/svgs/chat-bubble.svg |   4 +
 .../ChatNotificationMenu.vue                  | 121 +-----------------
 webapp/components/HeaderMenu/HeaderMenu.vue   |   4 +-
 webapp/locales/de.json                        |   7 +-
 webapp/locales/en.json                        |   3 +
 5 files changed, 15 insertions(+), 124 deletions(-)
 create mode 100644 webapp/assets/_new/icons/svgs/chat-bubble.svg

diff --git a/webapp/assets/_new/icons/svgs/chat-bubble.svg b/webapp/assets/_new/icons/svgs/chat-bubble.svg
new file mode 100644
index 000000000..377b52f2f
--- /dev/null
+++ b/webapp/assets/_new/icons/svgs/chat-bubble.svg
@@ -0,0 +1,4 @@
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+<title>chat-bubble</title>
+<g data-name="Chat"><path d="M27.23,24.91A9,9,0,0,0,22.44,9.52,8.57,8.57,0,0,0,21,9.41a8.94,8.94,0,0,0-8.92,10.14c0,.1,0,.2,0,.29a9,9,0,0,0,.22,1l0,.11a8.93,8.93,0,0,0,.38,1l.13.28a9,9,0,0,0,.45.83l.07.14a9.13,9.13,0,0,1-2.94-.36,1,1,0,0,0-.68,0L7,24.13l.54-1.9a1,1,0,0,0-.32-1,9,9,0,0,1,11.27-14,1,1,0,0,0,1.23-1.58A10.89,10.89,0,0,0,13,3.25a11,11,0,0,0-7.5,19l-1,3.34A1,1,0,0,0,5.9,26.82l4.35-1.93a11,11,0,0,0,4.68.16A9,9,0,0,0,21,27.41a8.81,8.81,0,0,0,2.18-.27l3.41,1.52A1,1,0,0,0,28,27.48Zm-1.77-1.1a1,1,0,0,0-.32,1L25.45,26l-1.79-.8a1,1,0,0,0-.41-.09,1,1,0,0,0-.29,0,6.64,6.64,0,0,1-2,.29,7,7,0,0,1,0-14,6.65,6.65,0,0,1,1.11.09,7,7,0,0,1,3.35,12.31Z"></path><path d="M17.82 17.08H17a1 1 0 0 0 0 2h.82a1 1 0 0 0 0-2zM21.41 17.08h-.82a1 1 0 0 0 0 2h.82a1 1 0 0 0 0-2zM25 17.08h-.82a1 1 0 0 0 0 2H25a1 1 0 0 0 0-2z"></path></g>
+</svg>
\ No newline at end of file
diff --git a/webapp/components/ChatNotificationMenu/ChatNotificationMenu.vue b/webapp/components/ChatNotificationMenu/ChatNotificationMenu.vue
index 537affd38..fcd93ee48 100644
--- a/webapp/components/ChatNotificationMenu/ChatNotificationMenu.vue
+++ b/webapp/components/ChatNotificationMenu/ChatNotificationMenu.vue
@@ -1,140 +1,25 @@
 <template>
-  <nuxt-link v-if="!unreadChatNotificationsCount" class="chat-menu" :to="{ name: 'chat' }">
+  <nuxt-link class="chat-notification-menu" :to="{ name: 'chat' }">
     <base-button
       ghost
       circle
       v-tooltip="{
-        content: $t('notifications.headerMenuButton.chat'),
+        content: $t('header.chat.tooltip'),
         placement: 'bottom-start',
       }"
     >
-      <img src="/img/empty/chat-bubble.svg" />
+      <counter-icon icon="chat-bubble" :count="1" danger />
     </base-button>
   </nuxt-link>
-  <dropdown v-else class="chat-notifications-menu" offset="8">
-    <template #default="{ toggleMenu }">
-      <base-button
-        ghost
-        circle
-        v-tooltip="{
-          content: $t('notifications.headerMenuButton.tooltip'),
-          placement: 'bottom-start',
-        }"
-        @click="toggleMenu"
-      >
-        <counter-icon icon="envelope" :count="unreadChatNotificationsCount" danger />
-        <img src="/img/empty/chat-bubble.svg" />
-      </base-button>
-    </template>
-    <template #popover="{}">
-      <div class="chat-notifications-menu-popover">
-        <div v-for="notification in notifications" v-bind:key="notification.roomid">
-          <ds-space>
-            <div
-              class="chat-notifications-menu-popover-item"
-              @click="
-                $store.commit('chat/SET_OPEN_CHAT', { showChat: true, roomID: notification.roomid })
-              "
-            >
-              <p>{{ notification.name }}</p>
-              {{ notification.title }}
-            </div>
-          </ds-space>
-        </div>
-        <!-- <notification-list :notifications="notifications" /> -->
-      </div>
-      <ds-flex class="chat-notifications-link-container">
-        <ds-flex-item
-          class="chat-notifications-link-container-item"
-          :width="{ base: '100%' }"
-          centered
-        >
-          <nuxt-link :to="{ name: 'chat' }">
-            <base-button ghost primary>All Chat Messages</base-button>
-          </nuxt-link>
-        </ds-flex-item>
-      </ds-flex>
-    </template>
-  </dropdown>
 </template>
 
 <script>
 import CounterIcon from '~/components/_new/generic/CounterIcon/CounterIcon'
-import Dropdown from '~/components/Dropdown'
-// import NotificationList from '../NotificationList/NotificationList'
 
 export default {
   name: 'ChatNotificationMenu',
   components: {
     CounterIcon,
-    Dropdown,
-    // NotificationList,
-  },
-  data() {
-    return {
-      notifications: [
-        { roomid: 'u1', name: 'Jenny', title: 'last Message from Jenny' },
-        { roomid: 'u2', name: 'Honey', title: 'last Message from Honey' },
-        { roomid: 'u3', name: 'Bob der Baumeister', title: 'last Message from Bob der Baumeister' },
-      ],
-    }
-  },
-  computed: {
-    unreadChatNotificationsCount() {
-      const result = this.notifications.reduce((count, notification) => {
-        return notification.read ? count : count + 1
-      }, 0)
-      return result
-    },
-    hasNotifications() {
-      return this.notifications.length
-    },
   },
 }
 </script>
-<style lang="scss">
-.chat-notifications-menu {
-  max-width: 500px;
-}
-.vue-popover-theme {
-  z-index: 1000000;
-}
-
-.counter-icon {
-  position: relative;
-
-  > .count {
-    position: absolute;
-    top: -$space-xx-small;
-    right: 0;
-
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    height: $size-icon-base;
-    min-width: $size-icon-base;
-    padding: 3px; // magic number to center count
-    border-radius: 50%;
-    transform: translateX(50%);
-
-    color: $color-neutral-100;
-    background-color: $color-primary;
-    font-size: 10px; // magic number to center count
-    line-height: 1;
-    text-align: center;
-
-    &.--danger {
-      background-color: $color-danger;
-    }
-
-    &.--inactive {
-      background-color: $color-neutral-60;
-    }
-
-    &.--soft {
-      background-color: $color-neutral-90;
-      color: $text-color-soft;
-    }
-  }
-}
-</style>
diff --git a/webapp/components/HeaderMenu/HeaderMenu.vue b/webapp/components/HeaderMenu/HeaderMenu.vue
index a08bec882..f4d48220e 100644
--- a/webapp/components/HeaderMenu/HeaderMenu.vue
+++ b/webapp/components/HeaderMenu/HeaderMenu.vue
@@ -263,10 +263,11 @@ import isEmpty from 'lodash/isEmpty'
 import { SHOW_GROUP_BUTTON_IN_HEADER } from '~/constants/groups.js'
 import { SHOW_CONTENT_FILTER_HEADER_MENU } from '~/constants/filter.js'
 import LOGOS from '~/constants/logos.js'
-import headerMenu from '~/constants/headerMenu.js'
 import AvatarMenu from '~/components/AvatarMenu/AvatarMenu'
+import ChatNotificationMenu from '~/components/ChatNotificationMenu/ChatNotificationMenu'
 import FilterMenu from '~/components/FilterMenu/FilterMenu.vue'
 import GroupButton from '~/components/Group/GroupButton'
+import headerMenu from '~/constants/headerMenu.js'
 import InviteButton from '~/components/InviteButton/InviteButton'
 import LocaleSwitch from '~/components/LocaleSwitch/LocaleSwitch'
 import Logo from '~/components/Logo/Logo'
@@ -275,7 +276,6 @@ import SearchField from '~/components/features/SearchField/SearchField.vue'
 import NotificationMenu from '~/components/NotificationMenu/NotificationMenu'
 import links from '~/constants/links.js'
 import PageParamsLink from '~/components/_new/features/PageParamsLink/PageParamsLink.vue'
-import ChatNotificationMenu from '~/components/ChatNotificationMenu/ChatNotificationMenu'
 
 export default {
   components: {
diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index d8bc537ff..b3d53908c 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -552,6 +552,9 @@
       },
       "groups": "Gruppen",
       "myProfile": "Mein Profil"
+    },
+    "chat": {
+      "tooltip": "Meine Chats"
     }
   },
   "index": {
@@ -691,10 +694,6 @@
       "unread": "Ungelesen"
     },
     "group": "Beschreibung",
-    "headerMenuButton": {
-      "chat": "Meine Chat",
-      "tooltip": "Meine Benachrichtigungen"
-    },
     "markAllAsRead": "Markiere alle als gelesen",
     "pageLink": "Alle Benachrichtigungen",
     "post": "Beitrag oder Gruppe",
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index e6fe4a624..23bd81ca8 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -552,6 +552,9 @@
       },
       "groups": "Groups",
       "myProfile": "My profile"
+    },
+    "chat": {
+      "tooltip": "My chats"
     }
   },
   "index": {

From 2a44b18aa6652e760b8453d9f35e8d63d3f2803c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Wed, 12 Jul 2023 16:08:43 +0200
Subject: [PATCH 3/8] Fix icon and set texts on chat button on user profile

---
 webapp/locales/de.json                  |  6 ++++++
 webapp/locales/en.json                  | 10 ++++++----
 webapp/pages/profile/_id/_slug.vue      |  7 ++++---
 webapp/static/img/empty/chat-bubble.svg |  1 -
 4 files changed, 16 insertions(+), 8 deletions(-)
 delete mode 100644 webapp/static/img/empty/chat-bubble.svg

diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index b3d53908c..9f2cb08b2 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -77,6 +77,12 @@
       }
     }
   },
+  "chat": {
+    "userProfileButton": {
+      "label": "Chat",
+      "tooltip": "Chatte mit diesem Nutzer"
+    }
+  },
   "client-only": {
     "loading": "Lade …"
   },
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index 23bd81ca8..f73909db5 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -77,6 +77,12 @@
       }
     }
   },
+  "chat": {
+    "userProfileButton": {
+      "label": "Chat",
+      "tooltip": "Chat with the user"
+    }
+  },
   "client-only": {
     "loading": "Loading …"
   },
@@ -694,10 +700,6 @@
       "unread": "Unread"
     },
     "group": "Description",
-    "headerMenuButton": {
-      "chat": "My Chat",
-      "tooltip": "My notifications"
-    },
     "markAllAsRead": "Mark all as read",
     "pageLink": "All notifications",
     "post": "Post or Group",
diff --git a/webapp/pages/profile/_id/_slug.vue b/webapp/pages/profile/_id/_slug.vue
index 62d2f1be7..60c503ad7 100644
--- a/webapp/pages/profile/_id/_slug.vue
+++ b/webapp/pages/profile/_id/_slug.vue
@@ -80,13 +80,14 @@
               @update="updateFollow"
             />
             <base-button
-              @click="$store.commit('chat/SET_OPEN_CHAT', { showChat: true, roomID: user.id })"
+              icon="chat-bubble"
               v-tooltip="{
-                content: $t('notifications.headerMenuButton.chat'),
+                content: $t('chat.userProfileButton.tooltip'),
                 placement: 'bottom-start',
               }"
+              @click="$store.commit('chat/SET_OPEN_CHAT', { showChat: true, roomID: user.id })"
             >
-              <img src="/img/empty/chat-bubble.svg" height="20" />
+              {{ $t('chat.userProfileButton.label') }}
             </base-button>
           </div>
           <template v-if="user.about">
diff --git a/webapp/static/img/empty/chat-bubble.svg b/webapp/static/img/empty/chat-bubble.svg
deleted file mode 100644
index b840e9c37..000000000
--- a/webapp/static/img/empty/chat-bubble.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" id="chat-bubble"><g data-name="Chat"><path fill="#9B9B9B" d="M27.23,24.91A9,9,0,0,0,22.44,9.52,8.57,8.57,0,0,0,21,9.41a8.94,8.94,0,0,0-8.92,10.14c0,.1,0,.2,0,.29a9,9,0,0,0,.22,1l0,.11a8.93,8.93,0,0,0,.38,1l.13.28a9,9,0,0,0,.45.83l.07.14a9.13,9.13,0,0,1-2.94-.36,1,1,0,0,0-.68,0L7,24.13l.54-1.9a1,1,0,0,0-.32-1,9,9,0,0,1,11.27-14,1,1,0,0,0,1.23-1.58A10.89,10.89,0,0,0,13,3.25a11,11,0,0,0-7.5,19l-1,3.34A1,1,0,0,0,5.9,26.82l4.35-1.93a11,11,0,0,0,4.68.16A9,9,0,0,0,21,27.41a8.81,8.81,0,0,0,2.18-.27l3.41,1.52A1,1,0,0,0,28,27.48Zm-1.77-1.1a1,1,0,0,0-.32,1L25.45,26l-1.79-.8a1,1,0,0,0-.41-.09,1,1,0,0,0-.29,0,6.64,6.64,0,0,1-2,.29,7,7,0,0,1,0-14,6.65,6.65,0,0,1,1.11.09,7,7,0,0,1,3.35,12.31Z"></path><path fill="#9B9B9B" d="M17.82 17.08H17a1 1 0 0 0 0 2h.82a1 1 0 0 0 0-2zM21.41 17.08h-.82a1 1 0 0 0 0 2h.82a1 1 0 0 0 0-2zM25 17.08h-.82a1 1 0 0 0 0 2H25a1 1 0 0 0 0-2z"></path></g></svg>
\ No newline at end of file

From a07a8b35e0aeb7e71ff7f5a89430391cfe62d451 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Thu, 13 Jul 2023 08:49:08 +0200
Subject: [PATCH 4/8] Update webapp/pages/profile/_id/_slug.vue

Co-authored-by: Alexander Friedland <fridolin@tutanota.com>
---
 webapp/pages/profile/_id/_slug.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/webapp/pages/profile/_id/_slug.vue b/webapp/pages/profile/_id/_slug.vue
index 60c503ad7..df670d542 100644
--- a/webapp/pages/profile/_id/_slug.vue
+++ b/webapp/pages/profile/_id/_slug.vue
@@ -82,7 +82,7 @@
             <base-button
               icon="chat-bubble"
               v-tooltip="{
-                content: $t('chat.userProfileButton.tooltip'),
+                content: $t('chat.userProfileButton.tooltip', {'USERNAME': userName}),
                 placement: 'bottom-start',
               }"
               @click="$store.commit('chat/SET_OPEN_CHAT', { showChat: true, roomID: user.id })"

From afcb2a1eeda97fd88b9671e5897146405c4f5600 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Thu, 13 Jul 2023 08:49:19 +0200
Subject: [PATCH 5/8] Update webapp/locales/en.json

Co-authored-by: Alexander Friedland <fridolin@tutanota.com>
---
 webapp/locales/en.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index f73909db5..2572dd160 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -80,7 +80,7 @@
   "chat": {
     "userProfileButton": {
       "label": "Chat",
-      "tooltip": "Chat with the user"
+      "tooltip": "Chat with {USERNAME}"
     }
   },
   "client-only": {

From f0826e6e443d5e072351f5b5c578e16f95a45e4d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Thu, 13 Jul 2023 08:49:34 +0200
Subject: [PATCH 6/8] Update webapp/locales/de.json

Co-authored-by: Alexander Friedland <fridolin@tutanota.com>
---
 webapp/locales/de.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index 9f2cb08b2..0564248f2 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -80,7 +80,7 @@
   "chat": {
     "userProfileButton": {
       "label": "Chat",
-      "tooltip": "Chatte mit diesem Nutzer"
+      "tooltip": "Chatte mit {USERNAME}"
     }
   },
   "client-only": {

From 40774b04985c3baf9c3d4b7ee03922934cee676b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Thu, 13 Jul 2023 08:59:51 +0200
Subject: [PATCH 7/8] Put user name in the tooltip of the chat button on the
 user profile

---
 webapp/locales/de.json             | 2 +-
 webapp/locales/en.json             | 2 +-
 webapp/pages/profile/_id/_slug.vue | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index 0564248f2..a9a8e9ed4 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -80,7 +80,7 @@
   "chat": {
     "userProfileButton": {
       "label": "Chat",
-      "tooltip": "Chatte mit {USERNAME}"
+      "tooltip": "Chatte mit „{name}“"
     }
   },
   "client-only": {
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index 2572dd160..9af3e11af 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -80,7 +80,7 @@
   "chat": {
     "userProfileButton": {
       "label": "Chat",
-      "tooltip": "Chat with {USERNAME}"
+      "tooltip": "Chat with “{name}”"
     }
   },
   "client-only": {
diff --git a/webapp/pages/profile/_id/_slug.vue b/webapp/pages/profile/_id/_slug.vue
index df670d542..f17a96d94 100644
--- a/webapp/pages/profile/_id/_slug.vue
+++ b/webapp/pages/profile/_id/_slug.vue
@@ -82,7 +82,7 @@
             <base-button
               icon="chat-bubble"
               v-tooltip="{
-                content: $t('chat.userProfileButton.tooltip', {'USERNAME': userName}),
+                content: $t('chat.userProfileButton.tooltip', { name: userName }),
                 placement: 'bottom-start',
               }"
               @click="$store.commit('chat/SET_OPEN_CHAT', { showChat: true, roomID: user.id })"

From 34bb207e8ecdf80c59f6baf85ab61d06b93d3f35 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Wolfgang=20Hu=C3=9F?= <wolle.huss@pjannto.com>
Date: Thu, 13 Jul 2023 09:30:19 +0200
Subject: [PATCH 8/8] Change store commits into 'mapMutations' on user profile

---
 webapp/pages/profile/_id/_slug.vue | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/webapp/pages/profile/_id/_slug.vue b/webapp/pages/profile/_id/_slug.vue
index f17a96d94..ce97cd53a 100644
--- a/webapp/pages/profile/_id/_slug.vue
+++ b/webapp/pages/profile/_id/_slug.vue
@@ -85,7 +85,7 @@
                 content: $t('chat.userProfileButton.tooltip', { name: userName }),
                 placement: 'bottom-start',
               }"
-              @click="$store.commit('chat/SET_OPEN_CHAT', { showChat: true, roomID: user.id })"
+              @click="showChat({ showChat: true, roomID: user.id })"
             >
               {{ $t('chat.userProfileButton.label') }}
             </base-button>
@@ -182,6 +182,7 @@
 
 <script>
 import uniqBy from 'lodash/uniqBy'
+import { mapMutations } from 'vuex'
 import postListActions from '~/mixins/postListActions'
 import PostTeaser from '~/components/PostTeaser/PostTeaser.vue'
 import HcFollowButton from '~/components/Button/FollowButton'
@@ -291,6 +292,10 @@ export default {
     },
   },
   methods: {
+    ...mapMutations({
+      commitModalData: 'modal/SET_OPEN',
+      showChat: 'chat/SET_OPEN_CHAT',
+    }),
     handleTab(tab) {
       if (this.tabActive !== tab) {
         this.tabActive = tab
@@ -366,7 +371,7 @@ export default {
       }
     },
     async deleteUser(userdata) {
-      this.$store.commit('modal/SET_OPEN', {
+      this.commitModalData({
         name: 'delete',
         data: {
           userdata: userdata,