From 2ce7438c7961d3ace6b2ee1002767cd1371a32b2 Mon Sep 17 00:00:00 2001 From: Pranav Raj S Date: Sat, 21 Dec 2019 22:54:35 +0530 Subject: [PATCH] [Refactor] Cleanup agent store and actions (#373) * Cleanup agent store and actions * Move set/create/update/destroy to helpers * Update mutation specs * Add specs for API helper * Fix edit/delete action visibility * Add actions specs * Remove unused API helpers * Remove duplicates * Remove duplicates * Fix duplicate --- app/javascript/dashboard/api/account.js | 126 +--------------- app/javascript/dashboard/api/agents.js | 9 ++ app/javascript/dashboard/api/auth.js | 64 +++----- app/javascript/dashboard/api/channels.js | 36 +---- app/javascript/dashboard/api/endPoints.js | 16 -- app/javascript/dashboard/api/reports.js | 26 +--- .../dashboard/api/specs/agents.spec.js | 13 ++ .../dashboard/components/ChatList.vue | 4 +- .../conversation/ConversationHeader.vue | 2 +- .../dashboard/settings/agents/AddAgent.vue | 94 ++++++------ .../dashboard/settings/agents/DeleteAgent.vue | 12 +- .../dashboard/settings/agents/EditAgent.vue | 84 ++++------- .../dashboard/settings/agents/Index.vue | 141 +++++++++--------- .../dashboard/settings/inbox/AddAgents.vue | 4 +- .../dashboard/settings/inbox/Settings.vue | 4 +- app/javascript/dashboard/store/getters.js | 4 - app/javascript/dashboard/store/index.js | 27 ++-- .../dashboard/store/modules/AccountState.js | 108 -------------- .../dashboard/store/modules/agents.js | 99 ++++++++++++ .../dashboard/store/modules/cannedResponse.js | 29 +--- .../modules/specs/agents/actions.spec.js | 94 ++++++++++++ .../store/modules/specs/agents/fixtures.js | 28 ++++ .../modules/specs/agents/getters.spec.js | 80 ++++++++++ .../modules/specs/agents/mutations.spec.js | 63 ++++++++ .../dashboard/store/mutation-types.js | 3 + .../shared/helpers/vuex/mutationHelpers.js | 19 +++ 26 files changed, 613 insertions(+), 576 deletions(-) create mode 100644 app/javascript/dashboard/api/agents.js create mode 100644 app/javascript/dashboard/api/specs/agents.spec.js delete mode 100755 app/javascript/dashboard/store/getters.js delete mode 100644 app/javascript/dashboard/store/modules/AccountState.js create mode 100644 app/javascript/dashboard/store/modules/agents.js create mode 100644 app/javascript/dashboard/store/modules/specs/agents/actions.spec.js create mode 100644 app/javascript/dashboard/store/modules/specs/agents/fixtures.js create mode 100644 app/javascript/dashboard/store/modules/specs/agents/getters.spec.js create mode 100644 app/javascript/dashboard/store/modules/specs/agents/mutations.spec.js create mode 100644 app/javascript/shared/helpers/vuex/mutationHelpers.js diff --git a/app/javascript/dashboard/api/account.js b/app/javascript/dashboard/api/account.js index 9f3444df1..114cb69ec 100644 --- a/app/javascript/dashboard/api/account.js +++ b/app/javascript/dashboard/api/account.js @@ -1,142 +1,32 @@ -/* eslint no-console: 0 */ /* global axios */ -/* eslint no-undef: "error" */ -/* eslint no-unused-expressions: ["error", { "allowShortCircuit": true }] */ import endPoints from './endPoints'; export default { - getAgents() { - const urlData = endPoints('fetchAgents'); - const fetchPromise = new Promise((resolve, reject) => { - axios - .get(urlData.url) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; - }, - - addAgent(agentInfo) { - const urlData = endPoints('addAgent'); - const fetchPromise = new Promise((resolve, reject) => { - axios - .post(urlData.url, agentInfo) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; - }, - editAgent(agentInfo) { - const urlData = endPoints('editAgent')(agentInfo.id); - const fetchPromise = new Promise((resolve, reject) => { - axios - .put(urlData.url, agentInfo) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; - }, - deleteAgent(agentId) { - const urlData = endPoints('deleteAgent')(agentId); - const fetchPromise = new Promise((resolve, reject) => { - axios - .delete(urlData.url) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; - }, getLabels() { const urlData = endPoints('fetchLabels'); - const fetchPromise = new Promise((resolve, reject) => { - axios - .get(urlData.url) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; + return axios.get(urlData.url); }, - // Get Inbox related to the account + getInboxes() { const urlData = endPoints('fetchInboxes'); - const fetchPromise = new Promise((resolve, reject) => { - axios - .get(urlData.url) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; + return axios.get(urlData.url); }, deleteInbox(id) { const urlData = endPoints('inbox').delete(id); - const fetchPromise = new Promise((resolve, reject) => { - axios - .delete(urlData.url) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; + return axios.delete(urlData.url); }, listInboxAgents(id) { const urlData = endPoints('inbox').agents.get(id); - const fetchPromise = new Promise((resolve, reject) => { - axios - .get(urlData.url) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; + return axios.get(urlData.url); }, updateInboxAgents(inboxId, agentList) { const urlData = endPoints('inbox').agents.post(); - const fetchPromise = new Promise((resolve, reject) => { - axios - .post(urlData.url, { - user_ids: agentList, - inbox_id: inboxId, - }) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); + return axios.post(urlData.url, { + user_ids: agentList, + inbox_id: inboxId, }); - return fetchPromise; }, }; diff --git a/app/javascript/dashboard/api/agents.js b/app/javascript/dashboard/api/agents.js new file mode 100644 index 000000000..62d8e6623 --- /dev/null +++ b/app/javascript/dashboard/api/agents.js @@ -0,0 +1,9 @@ +import ApiClient from './ApiClient'; + +class Agents extends ApiClient { + constructor() { + super('agents'); + } +} + +export default new Agents(); diff --git a/app/javascript/dashboard/api/auth.js b/app/javascript/dashboard/api/auth.js index 5e5a44af8..031d02b14 100644 --- a/app/javascript/dashboard/api/auth.js +++ b/app/javascript/dashboard/api/auth.js @@ -9,19 +9,29 @@ import Cookies from 'js-cookie'; import endPoints from './endPoints'; import { frontendURL } from '../helper/URLHelper'; +const setAuthCredentials = response => { + const expiryDate = moment.unix(response.headers.expiry); + Cookies.set('auth_data', response.headers, { + expires: expiryDate.diff(moment(), 'days'), + }); + Cookies.set('user', response.data.data, { + expires: expiryDate.diff(moment(), 'days'), + }); +}; + +const clearCookiesOnLogout = () => { + Cookies.remove('auth_data'); + Cookies.remove('user'); + window.location = frontendURL('login'); +}; + export default { login(creds) { return new Promise((resolve, reject) => { axios .post('auth/sign_in', creds) .then(response => { - const expiryDate = moment.unix(response.headers.expiry); - Cookies.set('auth_data', response.headers, { - expires: expiryDate.diff(moment(), 'days'), - }); - Cookies.set('user', response.data.data, { - expires: expiryDate.diff(moment(), 'days'), - }); + setAuthCredentials(response); resolve(); }) .catch(error => { @@ -39,13 +49,7 @@ export default { email: creds.email, }) .then(response => { - const expiryDate = moment.unix(response.headers.expiry); - Cookies.set('auth_data', response.headers, { - expires: expiryDate.diff(moment(), 'days'), - }); - Cookies.set('user', response.data.data, { - expires: expiryDate.diff(moment(), 'days'), - }); + setAuthCredentials(response); resolve(response); }) .catch(error => { @@ -64,9 +68,7 @@ export default { }) .catch(error => { if (error.response.status === 401) { - Cookies.remove('auth_data'); - Cookies.remove('user'); - window.location = frontendURL('login'); + clearCookiesOnLogout(); } reject(error); }); @@ -79,9 +81,7 @@ export default { axios .delete(urlData.url) .then(response => { - Cookies.remove('auth_data'); - Cookies.remove('user'); - window.location = frontendURL('login'); + clearCookiesOnLogout(); resolve(response); }) .catch(error => { @@ -122,17 +122,8 @@ export default { }, verifyPasswordToken({ confirmationToken }) { - return new Promise((resolve, reject) => { - axios - .post('auth/confirmation', { - confirmation_token: confirmationToken, - }) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(error.response); - }); + return axios.post('auth/confirmation', { + confirmation_token: confirmationToken, }); }, @@ -162,15 +153,6 @@ export default { resetPassword({ email }) { const urlData = endPoints('resetPassword'); - return new Promise((resolve, reject) => { - axios - .post(urlData.url, { email }) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(error.response); - }); - }); + return axios.post(urlData.url, { email }); }, }; diff --git a/app/javascript/dashboard/api/channels.js b/app/javascript/dashboard/api/channels.js index 5cc121117..8a8ac3918 100644 --- a/app/javascript/dashboard/api/channels.js +++ b/app/javascript/dashboard/api/channels.js @@ -8,49 +8,19 @@ export default { // Get Inbox related to the account createChannel(channel, channelParams) { const urlData = endPoints('createChannel')(channel, channelParams); - const fetchPromise = new Promise((resolve, reject) => { - axios - .post(urlData.url, urlData.params) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; + return axios.post(urlData.url, urlData.params); }, addAgentsToChannel(inboxId, agentsId) { const urlData = endPoints('addAgentsToChannel'); urlData.params.inbox_id = inboxId; urlData.params.user_ids = agentsId; - const fetchPromise = new Promise((resolve, reject) => { - axios - .post(urlData.url, urlData.params) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; + return axios.post(urlData.url, urlData.params); }, fetchFacebookPages(token) { const urlData = endPoints('fetchFacebookPages'); urlData.params.omniauth_token = token; - const fetchPromise = new Promise((resolve, reject) => { - axios - .post(urlData.url, urlData.params) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; + return axios.post(urlData.url, urlData.params); }, }; diff --git a/app/javascript/dashboard/api/endPoints.js b/app/javascript/dashboard/api/endPoints.js index fd7499848..062cbec1f 100644 --- a/app/javascript/dashboard/api/endPoints.js +++ b/app/javascript/dashboard/api/endPoints.js @@ -32,22 +32,6 @@ const endPoints = { url: 'api/v1/inboxes.json', }, - fetchAgents: { - url: 'api/v1/agents.json', - }, - - addAgent: { - url: 'api/v1/agents.json', - }, - - editAgent(id) { - return { url: `api/v1/agents/${id}` }; - }, - - deleteAgent({ id }) { - return { url: `api/v1/agents/${id}` }; - }, - createChannel(channel, channelParams) { return { url: `api/v1/callbacks/register_${channel}_page.json`, diff --git a/app/javascript/dashboard/api/reports.js b/app/javascript/dashboard/api/reports.js index f8d41ae44..94d6ac726 100644 --- a/app/javascript/dashboard/api/reports.js +++ b/app/javascript/dashboard/api/reports.js @@ -4,31 +4,11 @@ import endPoints from './endPoints'; export default { getAccountReports(metric, from, to) { - const urlData = endPoints('reports').account(metric, from, to); - const fetchPromise = new Promise((resolve, reject) => { - axios - .get(urlData.url) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; + const { url } = endPoints('reports').account(metric, from, to); + return axios.get(url); }, getAccountSummary(accountId, from, to) { const urlData = endPoints('reports').accountSummary(accountId, from, to); - const fetchPromise = new Promise((resolve, reject) => { - axios - .get(urlData.url) - .then(response => { - resolve(response); - }) - .catch(error => { - reject(Error(error)); - }); - }); - return fetchPromise; + return axios.get(urlData.url); }, }; diff --git a/app/javascript/dashboard/api/specs/agents.spec.js b/app/javascript/dashboard/api/specs/agents.spec.js new file mode 100644 index 000000000..7cf1bdd0e --- /dev/null +++ b/app/javascript/dashboard/api/specs/agents.spec.js @@ -0,0 +1,13 @@ +import agents from '../agents'; +import ApiClient from '../ApiClient'; + +describe('#AgentAPI', () => { + it('creates correct instance', () => { + expect(agents).toBeInstanceOf(ApiClient); + expect(agents).toHaveProperty('get'); + expect(agents).toHaveProperty('show'); + expect(agents).toHaveProperty('create'); + expect(agents).toHaveProperty('update'); + expect(agents).toHaveProperty('delete'); + }); +}); diff --git a/app/javascript/dashboard/components/ChatList.vue b/app/javascript/dashboard/components/ChatList.vue index 6c8bc3b7a..ac3afe4dd 100644 --- a/app/javascript/dashboard/components/ChatList.vue +++ b/app/javascript/dashboard/components/ChatList.vue @@ -14,7 +14,7 @@ class="tab--chat-type" @chatTabChange="getDataForTab" /> - +

-

-
+
-
-
-