LeadMagnet/leadchat
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

chore: Fix loading state in the inbox settings page (#4926)

Browse Source
This commit is contained in:
Pranav Raj S
2022-06-24 23:15:46 +05:30
committed by GitHub
parent 263b8240d3
commit c0249a1b5b
12 changed files with 106 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
app/javascript/dashboard/store/modules/inboxes.js
View File

@@ -5,6 +5,7 @@ import InboxesAPI from '../../api/inboxes';
import WebChannel from '../../api/channel/webChannel';
import FBChannel from '../../api/channel/fbChannel';
import TwilioChannel from '../../api/channel/twilioChannel';
import { parseAPIErrorResponse } from '../utils/api';
const buildInboxData = inboxParams => {
const formData = new FormData();
@@ -36,13 +37,17 @@ export const state = {
isFetchingItem: false,
isCreating: false,
isUpdating: false,
isUpdatingAutoAssignment: false,
isDeleting: false,
isUpdatingIMAP: false,
isUpdatingSMTP: false,
},
};
const throwErrorMessage = error => {
const errorMessage = parseAPIErrorResponse(error);
throw new Error(errorMessage);
};
export const getters = {
getInboxes($state) {
return $state.records;
@@ -149,7 +154,7 @@ export const actions = {
return response.data;
} catch (error) {
commit(types.default.SET_INBOXES_UI_FLAG, { isCreating: false });
throw new Error(error);
return throwErrorMessage(error);
}
},
createTwilioChannel: async ({ commit }, params) => {
@@ -177,73 +182,39 @@ export const actions = {
}
},
updateInbox: async ({ commit }, { id, formData = true, ...inboxParams }) => {
commit(types.default.SET_INBOXES_UI_FLAG, {
isUpdatingAutoAssignment: true,
});
commit(types.default.SET_INBOXES_UI_FLAG, { isUpdating: true });
try {
const response = await InboxesAPI.update(
id,
formData ? buildInboxData(inboxParams) : inboxParams
);
commit(types.default.EDIT_INBOXES, response.data);
commit(types.default.SET_INBOXES_UI_FLAG, {
isUpdatingAutoAssignment: false,
});
commit(types.default.SET_INBOXES_UI_FLAG, { isUpdating: false });
} catch (error) {
commit(types.default.SET_INBOXES_UI_FLAG, {
isUpdatingAutoAssignment: false,
});
throw new Error(error);
commit(types.default.SET_INBOXES_UI_FLAG, { isUpdating: false });
throwErrorMessage(error);
}
},
updateInboxIMAP: async (
{ commit },
{ id, formData = true, ...inboxParams }
) => {
commit(types.default.SET_INBOXES_UI_FLAG, {
isUpdatingIMAP: true,
});
updateInboxIMAP: async ({ commit }, { id, ...inboxParams }) => {
commit(types.default.SET_INBOXES_UI_FLAG, { isUpdatingIMAP: true });
try {
const response = await InboxesAPI.update(
id,
formData ? buildInboxData(inboxParams) : inboxParams
);
const response = await InboxesAPI.update(id, inboxParams);
commit(types.default.EDIT_INBOXES, response.data);
commit(types.default.SET_INBOXES_UI_FLAG, {
isUpdatingIMAP: false,
});
commit(types.default.SET_INBOXES_UI_FLAG, { isUpdatingIMAP: false });
} catch (error) {
commit(types.default.SET_INBOXES_UI_FLAG, {
isUpdatingIMAP: false,
});
if (error.response?.data?.message) {
throw new Error(error.response?.data?.message);
} else {
throw new Error(error);
}
commit(types.default.SET_INBOXES_UI_FLAG, { isUpdatingIMAP: false });
throwErrorMessage(error);
}
},
updateInboxSMTP: async (
{ commit },
{ id, formData = true, ...inboxParams }
) => {
commit(types.default.SET_INBOXES_UI_FLAG, {
isUpdatingSMTP: true,
});
updateInboxSMTP: async ({ commit }, { id, ...inboxParams }) => {
commit(types.default.SET_INBOXES_UI_FLAG, { isUpdatingSMTP: true });
try {
const response = await InboxesAPI.update(
id,
formData ? buildInboxData(inboxParams) : inboxParams
);
const response = await InboxesAPI.update(id, inboxParams);
commit(types.default.EDIT_INBOXES, response.data);
commit(types.default.SET_INBOXES_UI_FLAG, {
isUpdatingSMTP: false,
});
commit(types.default.SET_INBOXES_UI_FLAG, { isUpdatingSMTP: false });
} catch (error) {
commit(types.default.SET_INBOXES_UI_FLAG, {
isUpdatingSMTP: false,
});
throw new Error(error);
commit(types.default.SET_INBOXES_UI_FLAG, { isUpdatingSMTP: false });
throwErrorMessage(error);
}
},
delete: async ({ commit }, inboxId) => {

14
app/javascript/dashboard/store/modules/specs/inboxes/actions.spec.js
View File

@@ -81,12 +81,9 @@ describe('#actions', () => {
{ id: updatedInbox.id, inbox: { enable_auto_assignment: false } }
);
expect(commit.mock.calls).toEqual([
[types.default.SET_INBOXES_UI_FLAG, { isUpdatingAutoAssignment: true }],
[types.default.SET_INBOXES_UI_FLAG, { isUpdating: true }],
[types.default.EDIT_INBOXES, updatedInbox],
[
types.default.SET_INBOXES_UI_FLAG,
{ isUpdatingAutoAssignment: false },
],
[types.default.SET_INBOXES_UI_FLAG, { isUpdating: false }],
]);
});
it('sends correct actions if API is error', async () => {
@@ -98,11 +95,8 @@ describe('#actions', () => {
)
).rejects.toThrow(Error);
expect(commit.mock.calls).toEqual([
[types.default.SET_INBOXES_UI_FLAG, { isUpdatingAutoAssignment: true }],
[
types.default.SET_INBOXES_UI_FLAG,
{ isUpdatingAutoAssignment: false },
],
[types.default.SET_INBOXES_UI_FLAG, { isUpdating: true }],
[types.default.SET_INBOXES_UI_FLAG, { isUpdating: false }],
]);
});
});

2
app/javascript/dashboard/store/modules/specs/inboxes/getters.spec.js
View File

@@ -53,7 +53,6 @@ describe('#getters', () => {
isFetchingItem: false,
isCreating: false,
isUpdating: false,
isUpdatingAutoAssignment: false,
isDeleting: false,
},
};
@@ -62,7 +61,6 @@ describe('#getters', () => {
isFetchingItem: false,
isCreating: false,
isUpdating: false,
isUpdatingAutoAssignment: false,
isDeleting: false,
});
});

10
app/javascript/dashboard/store/utils/api.js
View File

@@ -45,3 +45,13 @@ export const clearCookiesOnLogout = () => {
const logoutRedirectLink = globalConfig.LOGOUT_REDIRECT_LINK || '/';
window.location = logoutRedirectLink;
};
export const parseAPIErrorResponse = error => {
if (error?.response?.data?.message) {
return error?.response?.data?.message;
}
if (error?.response?.data?.error) {
return error?.response?.data?.error;
}
return error;
};

26
app/javascript/dashboard/store/utils/specs/api.spec.js
View File

@@ -1,4 +1,8 @@
import { getLoadingStatus, setLoadingStatus } from '../api';
import {
getLoadingStatus,
parseAPIErrorResponse,
setLoadingStatus,
} from '../api';
describe('#getLoadingStatus', () => {
it('returns correct status', () => {
@@ -13,3 +17,23 @@ describe('#setLoadingStatus', () => {
expect(state.fetchAPIloadingStatus).toBe(false);
});
});
describe('#parseAPIErrorResponse', () => {
it('returns correct values', () => {
expect(
parseAPIErrorResponse({
response: { data: { message: 'Error Message [message]' } },
})
).toBe('Error Message [message]');
expect(
parseAPIErrorResponse({
response: { data: { error: 'Error Message [error]' } },
})
).toBe('Error Message [error]');
expect(parseAPIErrorResponse('Error: 422 Failed')).toBe(
'Error: 422 Failed'
);
});
});