Feature: Add UI to update email notification preferences (#579)

This commit is contained in:
Pranav Raj S
2020-03-01 17:47:08 +05:30
committed by GitHub
parent 629c73d3ce
commit d6237dfc59
11 changed files with 369 additions and 3 deletions

View File

@@ -0,0 +1,69 @@
import axios from 'axios';
import { actions } from '../../userNotificationSettings';
import * as types from '../../../mutation-types';
const commit = jest.fn();
global.axios = axios;
jest.mock('axios');
describe('#actions', () => {
describe('#get', () => {
it('sends correct actions if API is success', async () => {
axios.get.mockResolvedValue({
data: { selected_email_flags: ['conversation_creation'] },
});
await actions.get({ commit });
expect(commit.mock.calls).toEqual([
[types.default.SET_USER_NOTIFICATION_UI_FLAG, { isFetching: true }],
[
types.default.SET_USER_NOTIFICATION,
{ selected_email_flags: ['conversation_creation'] },
],
[types.default.SET_USER_NOTIFICATION_UI_FLAG, { isFetching: false }],
]);
});
it('sends correct actions if API is error', async () => {
axios.get.mockRejectedValue({ message: 'Incorrect header' });
await actions.get({ commit });
expect(commit.mock.calls).toEqual([
[types.default.SET_USER_NOTIFICATION_UI_FLAG, { isFetching: true }],
[types.default.SET_USER_NOTIFICATION_UI_FLAG, { isFetching: false }],
]);
});
});
describe('#update', () => {
it('sends correct actions if API is success', async () => {
axios.patch.mockResolvedValue({
data: { selected_email_flags: ['conversation_creation'] },
});
await actions.update(
{ commit },
{ selected_email_flags: ['conversation_creation'] }
);
expect(commit.mock.calls).toEqual([
[types.default.SET_USER_NOTIFICATION_UI_FLAG, { isUpdating: true }],
[
types.default.SET_USER_NOTIFICATION,
{ selected_email_flags: ['conversation_creation'] },
],
[types.default.SET_USER_NOTIFICATION_UI_FLAG, { isUpdating: false }],
]);
});
it('sends correct actions if API is error', async () => {
axios.patch.mockRejectedValue({ message: 'Incorrect header' });
await expect(
actions.update(
{ commit },
{ selected_email_flags: ['conversation_creation'] }
)
).rejects.toEqual({
message: 'Incorrect header',
});
expect(commit.mock.calls).toEqual([
[types.default.SET_USER_NOTIFICATION_UI_FLAG, { isUpdating: true }],
[types.default.SET_USER_NOTIFICATION_UI_FLAG, { isUpdating: false }],
]);
});
});
});

View File

@@ -0,0 +1,33 @@
import { getters } from '../../userNotificationSettings';
describe('#getters', () => {
it('getSelectedEmailFlags', () => {
const state = {
record: {
selected_email_flags: ['conversation_creation'],
},
};
expect(getters.getSelectedEmailFlags(state)).toEqual([
'conversation_creation',
]);
});
it('getUIFlags', () => {
const state = {
uiFlags: {
fetchingList: false,
fetchingItem: false,
creatingItem: false,
updatingItem: false,
deletingItem: false,
},
};
expect(getters.getUIFlags(state)).toEqual({
fetchingList: false,
fetchingItem: false,
creatingItem: false,
updatingItem: false,
deletingItem: false,
});
});
});

View File

@@ -0,0 +1,30 @@
import * as types from '../../../mutation-types';
import { mutations } from '../../userNotificationSettings';
describe('#mutations', () => {
describe('#SET_USER_NOTIFICATION', () => {
it('set user notification record', () => {
const state = { record: {} };
mutations[types.default.SET_USER_NOTIFICATION](state, {
selected_email_flags: ['conversation_creation'],
});
expect(state.record).toEqual({
selected_email_flags: ['conversation_creation'],
});
});
});
describe('#SET_USER_NOTIFICATION_UI_FLAG', () => {
it('set UIFlag notification', () => {
const state = {
uiFlags: { isFetching: false },
};
mutations[types.default.SET_USER_NOTIFICATION_UI_FLAG](state, {
isFetching: true,
});
expect(state.uiFlags).toEqual({
isFetching: true,
});
});
});
});

View File

@@ -0,0 +1,77 @@
import Vue from 'vue';
import * as types from '../mutation-types';
import UserNotificationSettings from '../../api/userNotificationSettings';
const state = {
record: {},
uiFlags: {
isFetching: false,
isUpdating: false,
},
};
export const getters = {
getUIFlags($state) {
return $state.uiFlags;
},
getSelectedEmailFlags: $state => {
return $state.record.selected_email_flags;
},
};
export const actions = {
get: async ({ commit }) => {
commit(types.default.SET_USER_NOTIFICATION_UI_FLAG, { isFetching: true });
try {
const response = await UserNotificationSettings.get();
commit(types.default.SET_USER_NOTIFICATION, response.data);
commit(types.default.SET_USER_NOTIFICATION_UI_FLAG, {
isFetching: false,
});
} catch (error) {
commit(types.default.SET_USER_NOTIFICATION_UI_FLAG, {
isFetching: false,
});
}
},
update: async ({ commit }, params) => {
commit(types.default.SET_USER_NOTIFICATION_UI_FLAG, { isUpdating: true });
try {
const response = await UserNotificationSettings.update({
notification_settings: {
selected_email_flags: params,
},
});
commit(types.default.SET_USER_NOTIFICATION, response.data);
commit(types.default.SET_USER_NOTIFICATION_UI_FLAG, {
isUpdating: false,
});
} catch (error) {
commit(types.default.SET_USER_NOTIFICATION_UI_FLAG, {
isUpdating: false,
});
throw error;
}
},
};
export const mutations = {
[types.default.SET_USER_NOTIFICATION_UI_FLAG]($state, data) {
$state.uiFlags = {
...$state.uiFlags,
...data,
};
},
[types.default.SET_USER_NOTIFICATION]: ($state, data) => {
Vue.set($state, 'record', data);
},
};
export default {
namespaced: true,
state,
getters,
actions,
mutations,
};