feat: Handle notification.deleted action cable event (#8501)

app/javascript/dashboard/store/modules/notifications/actions.js

@@ -56,4 +56,7 @@ export const actions = {
   addNotification({ commit }, data) {
     commit(types.ADD_NOTIFICATION, data);
   },
+  deleteNotification({ commit }, data) {
+    commit(types.DELETE_NOTIFICATION, data);
+  },
 };

app/javascript/dashboard/store/modules/notifications/mutations.js

@@ -55,4 +55,10 @@ export const mutations = {
     Vue.set($state.meta, 'unreadCount', unreadCount);
     Vue.set($state.meta, 'count', count);
   },
+  [types.DELETE_NOTIFICATION]($state, data) {
+    const { notification, unread_count: unreadCount, count } = data;
+    Vue.delete($state.records, notification.id);
+    Vue.set($state.meta, 'unreadCount', unreadCount);
+    Vue.set($state.meta, 'count', count);
+  },
 };

app/javascript/dashboard/store/modules/specs/notifications/actions.spec.js

@@ -98,4 +98,13 @@ describe('#actions', () => {
       ]);
     });
   });
+
+  describe('#deleteNotification', () => {
+    it('sends correct actions', async () => {
+      await actions.deleteNotification({ commit }, { data: 1 });
+      expect(commit.mock.calls).toEqual([
+        [types.DELETE_NOTIFICATION, { data: 1 }],
+      ]);
+    });
+  });
 });

app/javascript/dashboard/store/modules/specs/notifications/mutations.spec.js

@@ -118,4 +118,27 @@ describe('#mutations', () => {
       expect(state.meta.count).toEqual(232);
     });
   });
+
+  describe('#DELETE_NOTIFICATION', () => {
+    it('delete notification', () => {
+      const state = {
+        meta: { unreadCount: 4, count: 231 },
+        records: {
+          1: { id: 1, primary_actor_id: 1 },
+          2: { id: 2, primary_actor_id: 2 },
+        },
+      };
+      const data = {
+        notification: { id: 1, primary_actor_id: 1 },
+        unread_count: 5,
+        count: 232,
+      };
+      mutations[types.DELETE_NOTIFICATION](state, data);
+      expect(state.records).toEqual({
+        2: { id: 2, primary_actor_id: 2 },
+      });
+      expect(state.meta.unreadCount).toEqual(5);
+      expect(state.meta.count).toEqual(232);
+    });
+  });
 });

app/javascript/dashboard/store/mutation-types.js

@@ -133,6 +133,7 @@ export default {
   SET_NOTIFICATIONS_UI_FLAG: 'SET_NOTIFICATIONS_UI_FLAG',
   UPDATE_NOTIFICATION: 'UPDATE_NOTIFICATION',
   ADD_NOTIFICATION: 'ADD_NOTIFICATION',
+  DELETE_NOTIFICATION: 'DELETE_NOTIFICATION',
   UPDATE_ALL_NOTIFICATIONS: 'UPDATE_ALL_NOTIFICATIONS',
   SET_NOTIFICATIONS_ITEM: 'SET_NOTIFICATIONS_ITEM',
   SET_NOTIFICATIONS: 'SET_NOTIFICATIONS',