From 9c052ea1cdc0997b842ffede2a86fb1d474ba57c Mon Sep 17 00:00:00 2001
From: Ulf Gebhardt <ulf.gebhardt@webcraft-media.de>
Date: Mon, 17 Jul 2023 11:38:06 +0200
Subject: [PATCH] start with chat notifications

---
 backend/src/schema/resolvers/messages.ts      | 18 +++++++++++++++++-
 backend/src/schema/types/type/Message.gql     |  4 ++++
 backend/src/server.ts                         |  1 +
 .../ChatNotificationMenu.vue                  | 19 +++++++++++++++++++
 .../NotificationMenu/NotificationMenu.vue     |  1 +
 webapp/graphql/Messages.js                    | 13 +++++++++++++
 6 files changed, 55 insertions(+), 1 deletion(-)

diff --git a/backend/src/schema/resolvers/messages.ts b/backend/src/schema/resolvers/messages.ts
index a9937aac4..b0defe760 100644
--- a/backend/src/schema/resolvers/messages.ts
+++ b/backend/src/schema/resolvers/messages.ts
@@ -1,7 +1,19 @@
 import { neo4jgraphql } from 'neo4j-graphql-js'
 import Resolver from './helpers/Resolver'
+import { withFilter } from 'graphql-subscriptions'
+import { pubsub, CHAT_MESSAGE_ADDED } from '../../server'
 
 export default {
+  Subscription: {
+    chatMessageAdded: {
+      subscribe: withFilter(
+        () => pubsub.asyncIterator(CHAT_MESSAGE_ADDED),
+        (payload, variables) => {
+          return payload.chatMessageAdded.senderId !== variables.userId
+        },
+      ),
+    },
+  },
   Query: {
     Message: async (object, params, context, resolveInfo) => {
       const { roomId } = params
@@ -72,7 +84,7 @@ export default {
             distributed: false,
             seen: false
           })-[:INSIDE]->(room)
-          RETURN message { .* }
+          RETURN message { .*, room: properties(room), senderId: currentUser.id }
         `
         const createMessageTxResponse = await transaction.run(createMessageCypher, {
           currentUserId,
@@ -82,6 +94,10 @@ export default {
         const [message] = await createMessageTxResponse.records.map((record) =>
           record.get('message'),
         )
+
+        // send subscriptions
+        await pubsub.publish(CHAT_MESSAGE_ADDED, { chatMessageAdded: message })
+
         return message
       })
       try {
diff --git a/backend/src/schema/types/type/Message.gql b/backend/src/schema/types/type/Message.gql
index 671c5523a..e15a27d91 100644
--- a/backend/src/schema/types/type/Message.gql
+++ b/backend/src/schema/types/type/Message.gql
@@ -45,3 +45,7 @@ type Query {
     orderBy: [_MessageOrdering]
   ): [Message]
 }
+
+type Subscription {
+  chatMessageAdded(userId: ID!): Message
+}
diff --git a/backend/src/server.ts b/backend/src/server.ts
index b4d63c007..8192e44bc 100644
--- a/backend/src/server.ts
+++ b/backend/src/server.ts
@@ -14,6 +14,7 @@ import bodyParser from 'body-parser'
 import { graphqlUploadExpress } from 'graphql-upload'
 
 export const NOTIFICATION_ADDED = 'NOTIFICATION_ADDED'
+export const CHAT_MESSAGE_ADDED = 'CHAT_MESSAGE_ADDED'
 const { REDIS_DOMAIN, REDIS_PORT, REDIS_PASSWORD } = CONFIG
 let prodPubsub, devPubsub
 const options = {
diff --git a/webapp/components/ChatNotificationMenu/ChatNotificationMenu.vue b/webapp/components/ChatNotificationMenu/ChatNotificationMenu.vue
index 016410216..34368a787 100644
--- a/webapp/components/ChatNotificationMenu/ChatNotificationMenu.vue
+++ b/webapp/components/ChatNotificationMenu/ChatNotificationMenu.vue
@@ -14,8 +14,10 @@
 </template>
 
 <script>
+import { mapGetters } from 'vuex'
 import CounterIcon from '~/components/_new/generic/CounterIcon/CounterIcon'
 import { unreadRoomsQuery } from '~/graphql/Rooms'
+import { chatMessageAdded } from '~/graphql/Messages'
 
 export default {
   name: 'ChatNotificationMenu',
@@ -27,6 +29,11 @@ export default {
       count: 0,
     }
   },
+  computed: {
+    ...mapGetters({
+      user: 'auth/user',
+    }),
+  },
   apollo: {
     UnreadRooms: {
       query() {
@@ -35,6 +42,18 @@ export default {
       update({ UnreadRooms }) {
         this.count = UnreadRooms
       },
+      subscribeToMore: {
+        document: chatMessageAdded(),
+        variables() {
+          return {
+            userId: this.user.id,
+          }
+        },
+        updateQuery: (previousResult, { subscriptionData }) => {
+          // TODO emit chat reload
+          return { UnreadRooms: previousResult.UnreadRooms + 1}
+        },
+      },
     },
   },
 }
diff --git a/webapp/components/NotificationMenu/NotificationMenu.vue b/webapp/components/NotificationMenu/NotificationMenu.vue
index 72f539a42..9e94e07d7 100644
--- a/webapp/components/NotificationMenu/NotificationMenu.vue
+++ b/webapp/components/NotificationMenu/NotificationMenu.vue
@@ -146,6 +146,7 @@ export default {
           const {
             data: { notificationAdded: newNotification },
           } = subscriptionData
+
           return {
             notifications: unionBy(
               [newNotification],
diff --git a/webapp/graphql/Messages.js b/webapp/graphql/Messages.js
index d017f816c..408a4aabb 100644
--- a/webapp/graphql/Messages.js
+++ b/webapp/graphql/Messages.js
@@ -27,3 +27,16 @@ export const createMessageMutation = () => {
     }
   `
 }
+
+export const chatMessageAdded = () => {
+  return gql`
+    subscription chatMessageAdded($userId: ID!) {
+      chatMessageAdded(userId: $userId) {
+        id
+        room {
+          id
+        }
+      }
+    }
+  `
+}