Restructure omni services and add Chatwoot research snapshot
This commit is contained in:
Ruslan Bakiev
@@ -0,0 +1,169 @@
|
||||
import types from '../../mutation-types';
|
||||
import NotificationsAPI from '../../../api/notifications';
|
||||
|
||||
export const actions = {
|
||||
get: async ({ commit }, { page = 1 } = {}) => {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isFetching: true });
|
||||
try {
|
||||
const {
|
||||
data: {
|
||||
data: { payload, meta },
|
||||
},
|
||||
} = await NotificationsAPI.get({ page });
|
||||
commit(types.CLEAR_NOTIFICATIONS);
|
||||
commit(types.SET_NOTIFICATIONS, payload);
|
||||
commit(types.SET_NOTIFICATIONS_META, meta);
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isFetching: false });
|
||||
} catch (error) {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isFetching: false });
|
||||
}
|
||||
},
|
||||
index: async ({ commit }, { page = 1, status, type, sortOrder } = {}) => {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isFetching: true });
|
||||
try {
|
||||
const {
|
||||
data: {
|
||||
data: { payload, meta },
|
||||
},
|
||||
} = await NotificationsAPI.get({
|
||||
page,
|
||||
status,
|
||||
type,
|
||||
sortOrder,
|
||||
});
|
||||
commit(types.SET_NOTIFICATIONS, payload);
|
||||
commit(types.SET_NOTIFICATIONS_META, meta);
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isFetching: false });
|
||||
if (payload.length < 15) {
|
||||
commit(types.SET_ALL_NOTIFICATIONS_LOADED);
|
||||
}
|
||||
} catch (error) {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isFetching: false });
|
||||
}
|
||||
},
|
||||
unReadCount: async ({ commit } = {}) => {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdatingUnreadCount: true });
|
||||
try {
|
||||
const { data } = await NotificationsAPI.getUnreadCount();
|
||||
commit(types.SET_NOTIFICATIONS_UNREAD_COUNT, data);
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdatingUnreadCount: false });
|
||||
} catch (error) {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdatingUnreadCount: false });
|
||||
}
|
||||
},
|
||||
read: async (
|
||||
{ commit },
|
||||
{ id, primaryActorType, primaryActorId, unreadCount }
|
||||
) => {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdating: true });
|
||||
try {
|
||||
await NotificationsAPI.read(primaryActorType, primaryActorId);
|
||||
commit(types.SET_NOTIFICATIONS_UNREAD_COUNT, unreadCount - 1);
|
||||
commit(types.READ_NOTIFICATION, { id, read_at: new Date() });
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdating: false });
|
||||
} catch (error) {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdating: false });
|
||||
}
|
||||
},
|
||||
unread: async ({ commit }, { id }) => {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdating: true });
|
||||
try {
|
||||
await NotificationsAPI.unRead(id);
|
||||
commit(types.READ_NOTIFICATION, { id, read_at: null });
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdating: false });
|
||||
} catch (error) {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdating: false });
|
||||
}
|
||||
},
|
||||
readAll: async ({ commit }) => {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdating: true });
|
||||
try {
|
||||
await NotificationsAPI.readAll();
|
||||
commit(types.SET_NOTIFICATIONS_UNREAD_COUNT, 0);
|
||||
commit(types.UPDATE_ALL_NOTIFICATIONS);
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdating: false });
|
||||
} catch (error) {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdating: false });
|
||||
throw new Error(error);
|
||||
}
|
||||
},
|
||||
|
||||
delete: async ({ commit }, { notification, count, unreadCount }) => {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isDeleting: true });
|
||||
try {
|
||||
await NotificationsAPI.delete(notification.id);
|
||||
commit(types.SET_NOTIFICATIONS_UNREAD_COUNT, unreadCount - 1);
|
||||
commit(types.DELETE_NOTIFICATION, { notification, count, unreadCount });
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isDeleting: false });
|
||||
} catch (error) {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isDeleting: false });
|
||||
}
|
||||
},
|
||||
|
||||
deleteAllRead: async ({ commit }) => {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isDeleting: true });
|
||||
try {
|
||||
await NotificationsAPI.deleteAll({
|
||||
type: 'read',
|
||||
});
|
||||
commit(types.DELETE_READ_NOTIFICATIONS);
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isDeleting: false });
|
||||
} catch (error) {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isDeleting: false });
|
||||
}
|
||||
},
|
||||
deleteAll: async ({ commit }) => {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isDeleting: true });
|
||||
try {
|
||||
await NotificationsAPI.deleteAll({
|
||||
type: 'all',
|
||||
});
|
||||
commit(types.DELETE_ALL_NOTIFICATIONS);
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isDeleting: false });
|
||||
} catch (error) {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isDeleting: false });
|
||||
}
|
||||
},
|
||||
|
||||
snooze: async ({ commit }, { id, snoozedUntil }) => {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdating: true });
|
||||
try {
|
||||
const response = await NotificationsAPI.snooze({
|
||||
id,
|
||||
snoozedUntil,
|
||||
});
|
||||
|
||||
const {
|
||||
data: { snoozed_until = null },
|
||||
} = response;
|
||||
commit(types.SNOOZE_NOTIFICATION, {
|
||||
id,
|
||||
snoozed_until,
|
||||
});
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdating: false });
|
||||
} catch (error) {
|
||||
commit(types.SET_NOTIFICATIONS_UI_FLAG, { isUpdating: false });
|
||||
}
|
||||
},
|
||||
|
||||
updateNotification: async ({ commit }, data) => {
|
||||
commit(types.UPDATE_NOTIFICATION, data);
|
||||
},
|
||||
|
||||
addNotification({ commit }, data) {
|
||||
commit(types.ADD_NOTIFICATION, data);
|
||||
},
|
||||
deleteNotification({ commit }, data) {
|
||||
commit(types.DELETE_NOTIFICATION, data);
|
||||
},
|
||||
clear({ commit }) {
|
||||
commit(types.CLEAR_NOTIFICATIONS);
|
||||
},
|
||||
|
||||
setNotificationFilters: ({ commit }, filters) => {
|
||||
commit(types.SET_NOTIFICATION_FILTERS, filters);
|
||||
},
|
||||
updateNotificationFilters: ({ commit }, filters) => {
|
||||
commit(types.UPDATE_NOTIFICATION_FILTERS, filters);
|
||||
},
|
||||
};
|
||||
@@ -0,0 +1,44 @@
|
||||
import { sortComparator } from './helpers';
|
||||
import camelcaseKeys from 'camelcase-keys';
|
||||
|
||||
export const getters = {
|
||||
getNotifications($state) {
|
||||
return Object.values($state.records).sort((n1, n2) => n2.id - n1.id);
|
||||
},
|
||||
getFilteredNotifications: $state => filters => {
|
||||
const sortOrder = filters.sortOrder === 'desc' ? 'newest' : 'oldest';
|
||||
const sortedNotifications = Object.values($state.records).sort((n1, n2) =>
|
||||
sortComparator(n1, n2, sortOrder)
|
||||
);
|
||||
return sortedNotifications;
|
||||
},
|
||||
getFilteredNotificationsV4: $state => filters => {
|
||||
const sortOrder = filters.sortOrder === 'desc' ? 'newest' : 'oldest';
|
||||
const sortedNotifications = Object.values($state.records).sort((n1, n2) =>
|
||||
sortComparator(n1, n2, sortOrder)
|
||||
);
|
||||
return camelcaseKeys(sortedNotifications, { deep: true });
|
||||
},
|
||||
getNotificationById: $state => id => {
|
||||
return $state.records[id] || {};
|
||||
},
|
||||
getUIFlags($state) {
|
||||
return $state.uiFlags;
|
||||
},
|
||||
getNotification: $state => id => {
|
||||
const notification = $state.records[id];
|
||||
return notification || {};
|
||||
},
|
||||
getMeta: $state => {
|
||||
return $state.meta;
|
||||
},
|
||||
getNotificationFilters($state) {
|
||||
return $state.notificationFilters;
|
||||
},
|
||||
getHasUnreadNotifications: $state => {
|
||||
return $state.meta.unreadCount > 0;
|
||||
},
|
||||
getUnreadCount: $state => {
|
||||
return $state.meta.unreadCount;
|
||||
},
|
||||
};
|
||||
@@ -0,0 +1,17 @@
|
||||
const INBOX_SORT_OPTIONS = {
|
||||
newest: 'desc',
|
||||
oldest: 'asc',
|
||||
};
|
||||
|
||||
const sortConfig = {
|
||||
newest: (a, b) => b.created_at - a.created_at,
|
||||
oldest: (a, b) => a.created_at - b.created_at,
|
||||
};
|
||||
|
||||
export const sortComparator = (a, b, sortOrder) => {
|
||||
const sortDirection = INBOX_SORT_OPTIONS[sortOrder];
|
||||
if (sortOrder === 'newest' || sortOrder === 'oldest') {
|
||||
return sortConfig[sortOrder](a, b, sortDirection);
|
||||
}
|
||||
return 0;
|
||||
};
|
||||
@@ -0,0 +1,29 @@
|
||||
import { getters } from './getters';
|
||||
import { actions } from './actions';
|
||||
import { mutations } from './mutations';
|
||||
|
||||
const state = {
|
||||
meta: {
|
||||
count: 0,
|
||||
currentPage: 1,
|
||||
unreadCount: 0,
|
||||
},
|
||||
records: {},
|
||||
uiFlags: {
|
||||
isFetching: false,
|
||||
isFetchingItem: false,
|
||||
isUpdating: false,
|
||||
isDeleting: false,
|
||||
isUpdatingUnreadCount: false,
|
||||
isAllNotificationsLoaded: false,
|
||||
},
|
||||
notificationFilters: {},
|
||||
};
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
state,
|
||||
getters,
|
||||
actions,
|
||||
mutations,
|
||||
};
|
||||
@@ -0,0 +1,107 @@
|
||||
import types from '../../mutation-types';
|
||||
|
||||
export const mutations = {
|
||||
[types.SET_NOTIFICATIONS_UI_FLAG]($state, data) {
|
||||
$state.uiFlags = {
|
||||
...$state.uiFlags,
|
||||
...data,
|
||||
};
|
||||
},
|
||||
[types.CLEAR_NOTIFICATIONS]: $state => {
|
||||
$state.records = {};
|
||||
$state.uiFlags.isAllNotificationsLoaded = false;
|
||||
},
|
||||
[types.SET_NOTIFICATIONS_META]: ($state, data) => {
|
||||
const {
|
||||
count,
|
||||
current_page: currentPage,
|
||||
unread_count: unreadCount,
|
||||
} = data;
|
||||
|
||||
$state.meta = { ...$state.meta, count, currentPage, unreadCount };
|
||||
},
|
||||
[types.SET_NOTIFICATIONS_UNREAD_COUNT]: ($state, count) => {
|
||||
$state.meta.unreadCount = count < 0 ? 0 : count;
|
||||
},
|
||||
[types.SET_NOTIFICATIONS]: ($state, data) => {
|
||||
data.forEach(notification => {
|
||||
// Find existing notification with same primary_actor_id (primary_actor_id is unique)
|
||||
const existingNotification = Object.values($state.records).find(
|
||||
record => record.primary_actor_id === notification.primary_actor_id
|
||||
);
|
||||
// This is to handle the case where the same notification is received multiple times
|
||||
// On reconnect, if there is existing notification with same primary_actor_id,
|
||||
// it will be deleted and the new one will be added. So it will solve with duplicate notification
|
||||
if (existingNotification) {
|
||||
delete $state.records[existingNotification.id];
|
||||
}
|
||||
|
||||
$state.records[notification.id] = {
|
||||
...($state.records[notification.id] || {}),
|
||||
...notification,
|
||||
};
|
||||
});
|
||||
},
|
||||
[types.READ_NOTIFICATION]: ($state, { id, read_at }) => {
|
||||
$state.records[id].read_at = read_at;
|
||||
},
|
||||
[types.UPDATE_ALL_NOTIFICATIONS]: $state => {
|
||||
Object.values($state.records).forEach(item => {
|
||||
$state.records[item.id].read_at = true;
|
||||
});
|
||||
},
|
||||
|
||||
[types.ADD_NOTIFICATION]($state, data) {
|
||||
const { notification, unread_count: unreadCount, count } = data;
|
||||
|
||||
$state.records[notification.id] = {
|
||||
...($state.records[notification.id] || {}),
|
||||
...notification,
|
||||
};
|
||||
$state.meta.unreadCount = unreadCount;
|
||||
$state.meta.count = count;
|
||||
},
|
||||
[types.UPDATE_NOTIFICATION]($state, data) {
|
||||
const { notification, unread_count: unreadCount, count } = data;
|
||||
$state.records[notification.id] = {
|
||||
...($state.records[notification.id] || {}),
|
||||
...notification,
|
||||
};
|
||||
$state.meta.unreadCount = unreadCount;
|
||||
$state.meta.count = count;
|
||||
},
|
||||
[types.DELETE_NOTIFICATION]($state, data) {
|
||||
const { notification, unread_count: unreadCount, count } = data;
|
||||
delete $state.records[notification.id];
|
||||
$state.meta.unreadCount = unreadCount;
|
||||
$state.meta.count = count;
|
||||
},
|
||||
[types.SET_ALL_NOTIFICATIONS_LOADED]: $state => {
|
||||
$state.uiFlags.isAllNotificationsLoaded = true;
|
||||
},
|
||||
|
||||
[types.DELETE_READ_NOTIFICATIONS]: $state => {
|
||||
Object.values($state.records).forEach(item => {
|
||||
if (item.read_at) {
|
||||
delete $state.records[item.id];
|
||||
}
|
||||
});
|
||||
},
|
||||
[types.DELETE_ALL_NOTIFICATIONS]: $state => {
|
||||
$state.records = {};
|
||||
},
|
||||
|
||||
[types.SNOOZE_NOTIFICATION]: ($state, { id, snoozed_until }) => {
|
||||
$state.records[id].snoozed_until = snoozed_until;
|
||||
},
|
||||
|
||||
[types.SET_NOTIFICATION_FILTERS]: ($state, filters) => {
|
||||
$state.notificationFilters = filters;
|
||||
},
|
||||
[types.UPDATE_NOTIFICATION_FILTERS]: ($state, filters) => {
|
||||
$state.notificationFilters = {
|
||||
...$state.notificationFilters,
|
||||
...filters,
|
||||
};
|
||||
},
|
||||
};
|
||||
Reference in New Issue
Block a user