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:
@@ -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 {
|
||||
|
||||
@@ -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 }],
|
||||
]);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -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',
|
||||
},
|
||||
];
|
||||
@@ -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([]);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user