feat: Add the ability to create dashboard apps from the UI (#4924)

Co-authored-by: Pranav Raj S <pranav@chatwoot.com>
This commit is contained in:
Fayaz Ahmed
2022-07-08 14:25:32 +05:30
committed by GitHub
parent e4b159dd54
commit ef1d117717
14 changed files with 713 additions and 64 deletions

View File

@@ -32,6 +32,40 @@ export const actions = {
commit(types.SET_DASHBOARD_APPS_UI_FLAG, { isFetching: false });
}
},
create: async function createApp({ commit }, appObj) {
commit(types.SET_DASHBOARD_APPS_UI_FLAG, { isCreating: true });
try {
const response = await DashboardAppsAPI.create(appObj);
commit(types.CREATE_DASHBOARD_APP, response.data);
} catch (error) {
const errorMessage = error?.response?.data?.message;
throw new Error(errorMessage);
} finally {
commit(types.SET_DASHBOARD_APPS_UI_FLAG, { isCreating: false });
}
},
update: async function updateApp({ commit }, { id, ...updateObj }) {
commit(types.SET_DASHBOARD_APPS_UI_FLAG, { isUpdating: true });
try {
const response = await DashboardAppsAPI.update(id, updateObj);
commit(types.EDIT_DASHBOARD_APP, response.data);
} catch (error) {
throw new Error(error);
} finally {
commit(types.SET_DASHBOARD_APPS_UI_FLAG, { isUpdating: false });
}
},
delete: async function deleteApp({ commit }, id) {
commit(types.SET_DASHBOARD_APPS_UI_FLAG, { isDeleting: true });
try {
await DashboardAppsAPI.delete(id);
commit(types.DELETE_DASHBOARD_APP, id);
} catch (error) {
throw new Error(error);
} finally {
commit(types.SET_DASHBOARD_APPS_UI_FLAG, { isDeleting: false });
}
},
};
export const mutations = {
@@ -43,6 +77,9 @@ export const mutations = {
},
[types.SET_DASHBOARD_APPS]: MutationHelpers.set,
[types.CREATE_DASHBOARD_APP]: MutationHelpers.create,
[types.EDIT_DASHBOARD_APP]: MutationHelpers.update,
[types.DELETE_DASHBOARD_APP]: MutationHelpers.destroy,
};
export default {

View File

@@ -1,7 +1,7 @@
import axios from 'axios';
import { actions } from '../../dashboardApps';
import types from '../../../mutation-types';
import { payload, automationsList } from './fixtures';
const commit = jest.fn();
global.axios = axios;
jest.mock('axios');
@@ -18,4 +18,68 @@ describe('#actions', () => {
]);
});
});
describe('#create', () => {
it('sends correct actions if API is success', async () => {
axios.post.mockResolvedValue({ data: payload });
await actions.create({ commit }, payload);
expect(commit.mock.calls).toEqual([
[types.SET_DASHBOARD_APPS_UI_FLAG, { isCreating: true }],
[types.CREATE_DASHBOARD_APP, payload],
[types.SET_DASHBOARD_APPS_UI_FLAG, { isCreating: false }],
]);
});
it('sends correct actions if API is error', async () => {
axios.post.mockRejectedValue({ message: 'Incorrect header' });
await expect(actions.create({ commit })).rejects.toThrow(Error);
expect(commit.mock.calls).toEqual([
[types.SET_DASHBOARD_APPS_UI_FLAG, { isCreating: true }],
[types.SET_DASHBOARD_APPS_UI_FLAG, { isCreating: false }],
]);
});
});
describe('#update', () => {
it('sends correct actions if API is success', async () => {
axios.patch.mockResolvedValue({ data: automationsList[0] });
await actions.update({ commit }, automationsList[0]);
expect(commit.mock.calls).toEqual([
[types.SET_DASHBOARD_APPS_UI_FLAG, { isUpdating: true }],
[types.EDIT_DASHBOARD_APP, automationsList[0]],
[types.SET_DASHBOARD_APPS_UI_FLAG, { isUpdating: false }],
]);
});
it('sends correct actions if API is error', async () => {
axios.patch.mockRejectedValue({ message: 'Incorrect header' });
await expect(
actions.update({ commit }, automationsList[0])
).rejects.toThrow(Error);
expect(commit.mock.calls).toEqual([
[types.SET_DASHBOARD_APPS_UI_FLAG, { isUpdating: true }],
[types.SET_DASHBOARD_APPS_UI_FLAG, { isUpdating: false }],
]);
});
});
describe('#delete', () => {
it('sends correct actions if API is success', async () => {
axios.delete.mockResolvedValue({ data: automationsList[0] });
await actions.delete({ commit }, automationsList[0].id);
expect(commit.mock.calls).toEqual([
[types.SET_DASHBOARD_APPS_UI_FLAG, { isDeleting: true }],
[types.DELETE_DASHBOARD_APP, automationsList[0].id],
[types.SET_DASHBOARD_APPS_UI_FLAG, { isDeleting: false }],
]);
});
it('sends correct actions if API is error', async () => {
axios.delete.mockRejectedValue({ message: 'Incorrect header' });
await expect(
actions.delete({ commit }, automationsList[0].id)
).rejects.toThrow(Error);
expect(commit.mock.calls).toEqual([
[types.SET_DASHBOARD_APPS_UI_FLAG, { isDeleting: true }],
[types.SET_DASHBOARD_APPS_UI_FLAG, { isDeleting: false }],
]);
});
});
});

View File

@@ -0,0 +1,19 @@
export const payload = {
title: 'Test',
content: [
{ url: 'https://example.com', type: 'frame' },
{ url: 'https://chatwoot.com', type: 'frame' },
],
};
export const automationsList = [
{
id: 15,
title: 'Test',
content: [
{ url: 'https://example.com', type: 'frame' },
{ url: 'https://chatwoot.com', type: 'frame' },
],
created_at: '2022-06-27T08:28:29.841Z',
},
];

View File

@@ -1,5 +1,6 @@
import types from '../../../mutation-types';
import { mutations } from '../../dashboardApps';
import { automationsList } from './fixtures';
describe('#mutations', () => {
describe('#SET_DASHBOARD_APPS_UI_FLAG', () => {
@@ -17,4 +18,31 @@ describe('#mutations', () => {
expect(state.records).toEqual([{ title: 'Title 1' }]);
});
});
describe('#ADD_DASHBOARD_APP', () => {
it('push newly created app to the store', () => {
const state = { records: [automationsList[0]] };
mutations[types.CREATE_DASHBOARD_APP](state, automationsList[1]);
expect(state.records).toEqual([automationsList[0], automationsList[1]]);
});
});
describe('#EDIT_DASHBOARD_APP', () => {
it('update label record', () => {
const state = { records: [automationsList[0]] };
mutations[types.EDIT_DASHBOARD_APP](state, {
id: 15,
title: 'updated-title',
});
expect(state.records[0].title).toEqual('updated-title');
});
});
describe('#DELETE_DASHBOARD_APP', () => {
it('delete label record', () => {
const state = { records: [automationsList[0]] };
mutations[types.DELETE_DASHBOARD_APP](state, 15);
expect(state.records).toEqual([]);
});
});
});