From 6a614a520bfbdc3f41ede8baa64756de1ef2c9c2 Mon Sep 17 00:00:00 2001 From: Nithin David Thomas Date: Thu, 4 Feb 2021 13:19:59 +0530 Subject: [PATCH] chore: Sets up store for teams settings page (#1727) Co-authored-by: Pranav Raj S --- .../dashboard/api/specs/teams.spec.js | 15 +++ app/javascript/dashboard/api/teams.js | 20 ++++ app/javascript/dashboard/store/index.js | 4 + .../modules/specs/teamMembers/actions.spec.js | 59 ++++++++++ .../modules/specs/teamMembers/fixtures.js | 28 +++++ .../modules/specs/teamMembers/getters.spec.js | 30 +++++ .../specs/teamMembers/mutations.spec.js | 12 ++ .../store/modules/specs/teams/actions.spec.js | 103 ++++++++++++++++++ .../store/modules/specs/teams/fixtures.js | 8 ++ .../store/modules/specs/teams/getters.spec.js | 40 +++++++ .../modules/specs/teams/mutations.spec.js | 53 +++++++++ .../dashboard/store/modules/teamMembers.js | 69 ++++++++++++ .../dashboard/store/modules/teams/actions.js | 78 +++++++++++++ .../dashboard/store/modules/teams/getters.js | 12 ++ .../dashboard/store/modules/teams/index.js | 22 ++++ .../store/modules/teams/mutations.js | 47 ++++++++ .../dashboard/store/modules/teams/types.js | 8 ++ 17 files changed, 608 insertions(+) create mode 100644 app/javascript/dashboard/api/specs/teams.spec.js create mode 100644 app/javascript/dashboard/api/teams.js create mode 100644 app/javascript/dashboard/store/modules/specs/teamMembers/actions.spec.js create mode 100644 app/javascript/dashboard/store/modules/specs/teamMembers/fixtures.js create mode 100644 app/javascript/dashboard/store/modules/specs/teamMembers/getters.spec.js create mode 100644 app/javascript/dashboard/store/modules/specs/teamMembers/mutations.spec.js create mode 100644 app/javascript/dashboard/store/modules/specs/teams/actions.spec.js create mode 100644 app/javascript/dashboard/store/modules/specs/teams/fixtures.js create mode 100644 app/javascript/dashboard/store/modules/specs/teams/getters.spec.js create mode 100644 app/javascript/dashboard/store/modules/specs/teams/mutations.spec.js create mode 100644 app/javascript/dashboard/store/modules/teamMembers.js create mode 100644 app/javascript/dashboard/store/modules/teams/actions.js create mode 100644 app/javascript/dashboard/store/modules/teams/getters.js create mode 100644 app/javascript/dashboard/store/modules/teams/index.js create mode 100644 app/javascript/dashboard/store/modules/teams/mutations.js create mode 100644 app/javascript/dashboard/store/modules/teams/types.js diff --git a/app/javascript/dashboard/api/specs/teams.spec.js b/app/javascript/dashboard/api/specs/teams.spec.js new file mode 100644 index 000000000..7622a5417 --- /dev/null +++ b/app/javascript/dashboard/api/specs/teams.spec.js @@ -0,0 +1,15 @@ +import teams from '../teams'; +import ApiClient from '../ApiClient'; + +describe('#TeamsAPI', () => { + it('creates correct instance', () => { + expect(teams).toBeInstanceOf(ApiClient); + expect(teams).toHaveProperty('get'); + expect(teams).toHaveProperty('show'); + expect(teams).toHaveProperty('create'); + expect(teams).toHaveProperty('update'); + expect(teams).toHaveProperty('delete'); + expect(teams).toHaveProperty('getAgents'); + expect(teams).toHaveProperty('addAgents'); + }); +}); diff --git a/app/javascript/dashboard/api/teams.js b/app/javascript/dashboard/api/teams.js new file mode 100644 index 000000000..9c117c71b --- /dev/null +++ b/app/javascript/dashboard/api/teams.js @@ -0,0 +1,20 @@ +/* global axios */ +import ApiClient from './ApiClient'; + +export class TeamsAPI extends ApiClient { + constructor() { + super('teams', { accountScoped: true }); + } + + getAgents({ teamId }) { + return axios.get(`${this.url}/${teamId}/team_members`); + } + + addAgents({ teamId, agentsList }) { + return axios.post(`${this.url}/${teamId}/team_members`, { + user_ids: agentsList, + }); + } +} + +export default new TeamsAPI(); diff --git a/app/javascript/dashboard/store/index.js b/app/javascript/dashboard/store/index.js index bf128e94a..851d65a67 100755 --- a/app/javascript/dashboard/store/index.js +++ b/app/javascript/dashboard/store/index.js @@ -23,6 +23,8 @@ import labels from './modules/labels'; import reports from './modules/reports'; import userNotificationSettings from './modules/userNotificationSettings'; import webhooks from './modules/webhooks'; +import teams from './modules/teams'; +import teamMembers from './modules/teamMembers'; Vue.use(Vuex); export default new Vuex.Store({ @@ -49,5 +51,7 @@ export default new Vuex.Store({ reports, userNotificationSettings, webhooks, + teams, + teamMembers, }, }); diff --git a/app/javascript/dashboard/store/modules/specs/teamMembers/actions.spec.js b/app/javascript/dashboard/store/modules/specs/teamMembers/actions.spec.js new file mode 100644 index 000000000..07cb244a9 --- /dev/null +++ b/app/javascript/dashboard/store/modules/specs/teamMembers/actions.spec.js @@ -0,0 +1,59 @@ +import axios from 'axios'; +import { + actions, + SET_TEAM_MEMBERS_UI_FLAG, + ADD_AGENTS_TO_TEAM, +} from '../../teamMembers'; +import teamMembers from './fixtures'; + +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: teamMembers[1] }); + await actions.get({ commit }, { teamId: 1 }); + expect(commit.mock.calls).toEqual([ + [SET_TEAM_MEMBERS_UI_FLAG, { isFetching: true }], + [ADD_AGENTS_TO_TEAM, { data: teamMembers[1], teamId: 1 }], + [SET_TEAM_MEMBERS_UI_FLAG, { isFetching: false }], + ]); + }); + it('sends correct actions if API is error', async () => { + axios.get.mockRejectedValue({ message: 'Incorrect header' }); + await expect(actions.get({ commit }, { teamId: 1 })).rejects.toThrow( + Error + ); + expect(commit.mock.calls).toEqual([ + [SET_TEAM_MEMBERS_UI_FLAG, { isFetching: true }], + [SET_TEAM_MEMBERS_UI_FLAG, { isFetching: false }], + ]); + }); + }); + + describe('#create', () => { + it('sends correct actions if API is success', async () => { + axios.post.mockResolvedValue({ data: teamMembers }); + await actions.create({ commit }, { agentsList: teamMembers, teamId: 1 }); + + expect(commit.mock.calls).toEqual([ + [SET_TEAM_MEMBERS_UI_FLAG, { isCreating: true }], + [ADD_AGENTS_TO_TEAM, { data: teamMembers, teamId: 1 }], + [SET_TEAM_MEMBERS_UI_FLAG, { isCreating: false }], + ]); + }); + it('sends correct actions if API is error', async () => { + axios.post.mockRejectedValue({ message: 'Incorrect header' }); + await expect( + actions.create({ commit }, { agentsList: teamMembers, teamId: 1 }) + ).rejects.toThrow(Error); + + expect(commit.mock.calls).toEqual([ + [SET_TEAM_MEMBERS_UI_FLAG, { isCreating: true }], + [SET_TEAM_MEMBERS_UI_FLAG, { isCreating: false }], + ]); + }); + }); +}); diff --git a/app/javascript/dashboard/store/modules/specs/teamMembers/fixtures.js b/app/javascript/dashboard/store/modules/specs/teamMembers/fixtures.js new file mode 100644 index 000000000..c7b968e33 --- /dev/null +++ b/app/javascript/dashboard/store/modules/specs/teamMembers/fixtures.js @@ -0,0 +1,28 @@ +export default [ + { + id: 1, + provider: 'email', + uid: 'agent1@chatwoot.com', + name: 'Agent1', + email: 'agent1@chatwoot.com', + account_id: 1, + created_at: '2019-11-18T02:21:06.225Z', + updated_at: '2019-12-20T07:43:35.794Z', + pubsub_token: 'random-1', + role: 'agent', + confirmed: true, + }, + { + id: 2, + provider: 'email', + uid: 'agent2@chatwoot.com', + name: 'Agent2', + email: 'agent2@chatwoot.com', + account_id: 1, + created_at: '2019-11-18T02:21:06.225Z', + updated_at: '2019-12-20T07:43:35.794Z', + pubsub_token: 'random-2', + role: 'agent', + confirmed: true, + }, +]; diff --git a/app/javascript/dashboard/store/modules/specs/teamMembers/getters.spec.js b/app/javascript/dashboard/store/modules/specs/teamMembers/getters.spec.js new file mode 100644 index 000000000..e029786d1 --- /dev/null +++ b/app/javascript/dashboard/store/modules/specs/teamMembers/getters.spec.js @@ -0,0 +1,30 @@ +import { getters } from '../../teamMembers'; +import teamMembers from './fixtures'; + +describe('#getters', () => { + it('getTeamMembers', () => { + const state = { + records: { + 1: [teamMembers[0]], + }, + }; + expect(getters.getTeamMembers(state)(1)).toEqual([teamMembers[0]]); + }); + + it('getUIFlags', () => { + const state = { + uiFlags: { + isFetching: false, + isCreating: false, + isUpdating: false, + isDeleting: false, + }, + }; + expect(getters.getUIFlags(state)).toEqual({ + isFetching: false, + isCreating: false, + isUpdating: false, + isDeleting: false, + }); + }); +}); diff --git a/app/javascript/dashboard/store/modules/specs/teamMembers/mutations.spec.js b/app/javascript/dashboard/store/modules/specs/teamMembers/mutations.spec.js new file mode 100644 index 000000000..cf1072f97 --- /dev/null +++ b/app/javascript/dashboard/store/modules/specs/teamMembers/mutations.spec.js @@ -0,0 +1,12 @@ +import { mutations, ADD_AGENTS_TO_TEAM } from '../../teamMembers'; +import teamMembers from './fixtures'; + +describe('#mutations', () => { + describe('#ADD_AGENTS_TO_TEAM', () => { + it('Adds team members to records', () => { + const state = { records: {} }; + mutations[ADD_AGENTS_TO_TEAM](state, { data: teamMembers[0], teamId: 1 }); + expect(state.records).toEqual({ 1: teamMembers[0] }); + }); + }); +}); diff --git a/app/javascript/dashboard/store/modules/specs/teams/actions.spec.js b/app/javascript/dashboard/store/modules/specs/teams/actions.spec.js new file mode 100644 index 000000000..855322105 --- /dev/null +++ b/app/javascript/dashboard/store/modules/specs/teams/actions.spec.js @@ -0,0 +1,103 @@ +import axios from 'axios'; +import { actions } from '../../teams/actions'; +import { + SET_TEAM_UI_FLAG, + CLEAR_TEAMS, + SET_TEAMS, + SET_TEAM_ITEM, + EDIT_TEAM, + DELETE_TEAM, +} from '../../teams/types'; +import teamsList from './fixtures'; + +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: teamsList[1] }); + await actions.get({ commit }); + expect(commit.mock.calls).toEqual([ + [SET_TEAM_UI_FLAG, { isFetching: true }], + [CLEAR_TEAMS], + [SET_TEAMS, teamsList[1]], + [SET_TEAM_UI_FLAG, { isFetching: false }], + ]); + }); + it('sends correct actions if API is error', async () => { + axios.get.mockRejectedValue({ message: 'Incorrect header' }); + await expect(actions.get({ commit })).rejects.toThrow(Error); + expect(commit.mock.calls).toEqual([ + [SET_TEAM_UI_FLAG, { isFetching: true }], + [SET_TEAM_UI_FLAG, { isFetching: false }], + ]); + }); + }); + + describe('#create', () => { + it('sends correct actions if API is success', async () => { + axios.post.mockResolvedValue({ data: teamsList[1] }); + await actions.create({ commit }, teamsList[1]); + + expect(commit.mock.calls).toEqual([ + [SET_TEAM_UI_FLAG, { isCreating: true }], + [SET_TEAM_ITEM, teamsList[1]], + [SET_TEAM_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([ + [SET_TEAM_UI_FLAG, { isCreating: true }], + [SET_TEAM_UI_FLAG, { isCreating: false }], + ]); + }); + }); + + describe('#update', () => { + it('sends correct actions if API is success', async () => { + axios.patch.mockResolvedValue({ data: { payload: teamsList[1] } }); + await actions.update({ commit }, teamsList[1]); + + expect(commit.mock.calls).toEqual([ + [SET_TEAM_UI_FLAG, { isUpdating: true }], + [EDIT_TEAM, teamsList[1]], + [SET_TEAM_UI_FLAG, { isUpdating: false }], + ]); + }); + it('sends correct actions if API is error', async () => { + axios.patch.mockRejectedValue({ message: 'Incorrect header' }); + await expect(actions.update({ commit }, teamsList[1])).rejects.toThrow( + Error + ); + expect(commit.mock.calls).toEqual([ + [SET_TEAM_UI_FLAG, { isUpdating: true }], + [SET_TEAM_UI_FLAG, { isUpdating: false }], + ]); + }); + }); + + describe('#delete', () => { + it('sends correct actions if API is success', async () => { + axios.delete.mockResolvedValue(); + await actions.delete({ commit }, 1); + expect(commit.mock.calls).toEqual([ + [SET_TEAM_UI_FLAG, { isDeleting: true }], + [DELETE_TEAM, 1], + [SET_TEAM_UI_FLAG, { isDeleting: false }], + ]); + }); + it('sends correct actions if API is error', async () => { + axios.delete.mockRejectedValue({ message: 'Incorrect header' }); + await expect(actions.delete({ commit }, 1)).rejects.toThrow(Error); + expect(commit.mock.calls).toEqual([ + [SET_TEAM_UI_FLAG, { isDeleting: true }], + [SET_TEAM_UI_FLAG, { isDeleting: false }], + ]); + }); + }); +}); diff --git a/app/javascript/dashboard/store/modules/specs/teams/fixtures.js b/app/javascript/dashboard/store/modules/specs/teams/fixtures.js new file mode 100644 index 000000000..54c897414 --- /dev/null +++ b/app/javascript/dashboard/store/modules/specs/teams/fixtures.js @@ -0,0 +1,8 @@ +export default { + 1: { + id: 1, + account_id: 1, + name: 'Test', + description: 'Some team', + }, +}; diff --git a/app/javascript/dashboard/store/modules/specs/teams/getters.spec.js b/app/javascript/dashboard/store/modules/specs/teams/getters.spec.js new file mode 100644 index 000000000..250af0dab --- /dev/null +++ b/app/javascript/dashboard/store/modules/specs/teams/getters.spec.js @@ -0,0 +1,40 @@ +import { getters } from '../../teams/getters'; +import teamsList from './fixtures'; + +describe('#getters', () => { + it('getTeams', () => { + const state = { + records: teamsList, + }; + expect(getters.getTeams(state)).toEqual([teamsList[1]]); + }); + + it('getTeam', () => { + const state = { + records: teamsList, + }; + expect(getters.getTeam(state)(1)).toEqual({ + id: 1, + account_id: 1, + name: 'Test', + description: 'Some team', + }); + }); + + it('getUIFlags', () => { + const state = { + uiFlags: { + isFetching: false, + isCreating: false, + isUpdating: false, + isDeleting: false, + }, + }; + expect(getters.getUIFlags(state)).toEqual({ + isFetching: false, + isCreating: false, + isUpdating: false, + isDeleting: false, + }); + }); +}); diff --git a/app/javascript/dashboard/store/modules/specs/teams/mutations.spec.js b/app/javascript/dashboard/store/modules/specs/teams/mutations.spec.js new file mode 100644 index 000000000..52f9580c6 --- /dev/null +++ b/app/javascript/dashboard/store/modules/specs/teams/mutations.spec.js @@ -0,0 +1,53 @@ +import { + CLEAR_TEAMS, + SET_TEAMS, + SET_TEAM_ITEM, + EDIT_TEAM, + DELETE_TEAM, +} from '../../teams/types'; +import { mutations } from '../../teams/mutations'; +import teams from './fixtures'; +describe('#mutations', () => { + describe('#SET_teams', () => { + it('set teams records', () => { + const state = { records: {} }; + mutations[SET_TEAMS](state, [teams[1]]); + expect(state.records).toEqual(teams); + }); + }); + + describe('#ADD_TEAM', () => { + it('push newly created teams to the store', () => { + const state = { records: {} }; + mutations[SET_TEAM_ITEM](state, teams[1]); + expect(state.records).toEqual({ 1: teams[1] }); + }); + }); + + describe('#EDIT_TEAM', () => { + it('update teams record', () => { + const state = { records: [teams[1]] }; + mutations[EDIT_TEAM](state, { + id: 1, + name: 'customer-support', + }); + expect(state.records[1].name).toEqual('customer-support'); + }); + }); + + describe('#DELETE_TEAM', () => { + it('delete teams record', () => { + const state = { records: { 1: teams[1] } }; + mutations[DELETE_TEAM](state, 1); + expect(state.records).toEqual({}); + }); + }); + + describe('#CLEAR_TEAMS', () => { + it('delete teams record', () => { + const state = { records: { 1: teams[1] } }; + mutations[CLEAR_TEAMS](state); + expect(state.records).toEqual({}); + }); + }); +}); diff --git a/app/javascript/dashboard/store/modules/teamMembers.js b/app/javascript/dashboard/store/modules/teamMembers.js new file mode 100644 index 000000000..581cac4f8 --- /dev/null +++ b/app/javascript/dashboard/store/modules/teamMembers.js @@ -0,0 +1,69 @@ +import Vue from 'vue'; +import TeamsAPI from '../../api/teams'; + +export const SET_TEAM_MEMBERS_UI_FLAG = 'SET_TEAM_MEMBERS_UI_FLAG'; +export const ADD_AGENTS_TO_TEAM = 'ADD_AGENTS_TO_TEAM'; + +export const state = { + records: {}, + uiFlags: { + isFetching: false, + isCreating: false, + isUpdating: false, + isDeleting: false, + }, +}; + +export const getters = { + getUIFlags(_state) { + return _state.uiFlags; + }, + getTeamMembers: $state => id => { + return $state.records[id] || []; + }, +}; + +export const actions = { + get: async ({ commit }, { teamId }) => { + commit(SET_TEAM_MEMBERS_UI_FLAG, { isFetching: true }); + try { + const { data } = await TeamsAPI.getAgents({ teamId }); + commit(ADD_AGENTS_TO_TEAM, { data, teamId }); + } catch (error) { + throw new Error(error); + } finally { + commit(SET_TEAM_MEMBERS_UI_FLAG, { isFetching: false }); + } + }, + create: async ({ commit }, { agentsList, teamId }) => { + commit(SET_TEAM_MEMBERS_UI_FLAG, { isCreating: true }); + try { + const { data } = await TeamsAPI.addAgents({ agentsList, teamId }); + commit(ADD_AGENTS_TO_TEAM, { teamId, data }); + } catch (error) { + throw new Error(error); + } finally { + commit(SET_TEAM_MEMBERS_UI_FLAG, { isCreating: false }); + } + }, +}; + +export const mutations = { + [SET_TEAM_MEMBERS_UI_FLAG]($state, data) { + $state.uiFlags = { + ...$state.uiFlags, + ...data, + }; + }, + [ADD_AGENTS_TO_TEAM]($state, { data, teamId }) { + Vue.set($state.records, teamId, data); + }, +}; + +export default { + namespaced: true, + state, + getters, + actions, + mutations, +}; diff --git a/app/javascript/dashboard/store/modules/teams/actions.js b/app/javascript/dashboard/store/modules/teams/actions.js new file mode 100644 index 000000000..39bc38df2 --- /dev/null +++ b/app/javascript/dashboard/store/modules/teams/actions.js @@ -0,0 +1,78 @@ +import { + SET_TEAM_UI_FLAG, + CLEAR_TEAMS, + SET_TEAMS, + SET_TEAM_ITEM, + EDIT_TEAM, + DELETE_TEAM, +} from './types'; +import TeamsAPI from '../../../api/teams'; + +export const actions = { + create: async ({ commit }, teamInfo) => { + commit(SET_TEAM_UI_FLAG, { isCreating: true }); + try { + const response = await TeamsAPI.create(teamInfo); + const team = response.data; + commit(SET_TEAM_ITEM, team); + return team; + } catch (error) { + throw new Error(error); + } finally { + commit(SET_TEAM_UI_FLAG, { isCreating: false }); + } + }, + get: async ({ commit }) => { + commit(SET_TEAM_UI_FLAG, { isFetching: true }); + try { + const { data } = await TeamsAPI.get(); + commit(CLEAR_TEAMS); + commit(SET_TEAMS, data); + } catch (error) { + throw new Error(error); + } finally { + commit(SET_TEAM_UI_FLAG, { isFetching: false }); + } + }, + + show: async ({ commit }, { id }) => { + commit(SET_TEAM_UI_FLAG, { isFetchingItem: true }); + try { + const response = await TeamsAPI.show(id); + commit(SET_TEAM_ITEM, response.data.payload); + commit(SET_TEAM_UI_FLAG, { + isFetchingItem: false, + }); + } catch (error) { + throw new Error(error); + } finally { + commit(SET_TEAM_UI_FLAG, { + isFetchingItem: false, + }); + } + }, + + update: async ({ commit }, { id, ...updateObj }) => { + commit(SET_TEAM_UI_FLAG, { isUpdating: true }); + try { + const response = await TeamsAPI.update(id, updateObj); + commit(EDIT_TEAM, response.data.payload); + } catch (error) { + throw new Error(error); + } finally { + commit(SET_TEAM_UI_FLAG, { isUpdating: false }); + } + }, + + delete: async ({ commit }, teamId) => { + commit(SET_TEAM_UI_FLAG, { isDeleting: true }); + try { + await TeamsAPI.delete(teamId); + commit(DELETE_TEAM, teamId); + } catch (error) { + throw new Error(error); + } finally { + commit(SET_TEAM_UI_FLAG, { isDeleting: false }); + } + }, +}; diff --git a/app/javascript/dashboard/store/modules/teams/getters.js b/app/javascript/dashboard/store/modules/teams/getters.js new file mode 100644 index 000000000..8b32c970e --- /dev/null +++ b/app/javascript/dashboard/store/modules/teams/getters.js @@ -0,0 +1,12 @@ +export const getters = { + getTeams($state) { + return Object.values($state.records).sort((a, b) => a.id - b.id); + }, + getUIFlags($state) { + return $state.uiFlags; + }, + getTeam: $state => id => { + const team = $state.records[id]; + return team || {}; + }, +}; diff --git a/app/javascript/dashboard/store/modules/teams/index.js b/app/javascript/dashboard/store/modules/teams/index.js new file mode 100644 index 000000000..4b1debb71 --- /dev/null +++ b/app/javascript/dashboard/store/modules/teams/index.js @@ -0,0 +1,22 @@ +import { getters } from './getters'; +import { actions } from './actions'; +import { mutations } from './mutations'; + +const state = { + meta: {}, + records: {}, + uiFlags: { + isFetching: false, + isCreating: false, + isUpdating: false, + isDeleting: false, + }, +}; + +export default { + namespaced: true, + state, + getters, + actions, + mutations, +}; diff --git a/app/javascript/dashboard/store/modules/teams/mutations.js b/app/javascript/dashboard/store/modules/teams/mutations.js new file mode 100644 index 000000000..82a1a6811 --- /dev/null +++ b/app/javascript/dashboard/store/modules/teams/mutations.js @@ -0,0 +1,47 @@ +import Vue from 'vue'; +import { + SET_TEAM_UI_FLAG, + CLEAR_TEAMS, + SET_TEAMS, + SET_TEAM_ITEM, + EDIT_TEAM, + DELETE_TEAM, +} from './types'; + +export const mutations = { + [SET_TEAM_UI_FLAG]($state, data) { + $state.uiFlags = { + ...$state.uiFlags, + ...data, + }; + }, + + [CLEAR_TEAMS]: $state => { + Vue.set($state, 'records', {}); + }, + + [SET_TEAMS]: ($state, data) => { + data.forEach(team => { + Vue.set($state.records, team.id, { + ...($state.records[team.id] || {}), + ...team, + }); + }); + }, + + [SET_TEAM_ITEM]: ($state, data) => { + Vue.set($state.records, data.id, { + ...($state.records[data.id] || {}), + ...data, + }); + }, + + [EDIT_TEAM]: ($state, data) => { + Vue.set($state.records, data.id, data); + }, + + [DELETE_TEAM]: ($state, teamId) => { + const { [teamId]: toDelete, ...records } = $state.records; + Vue.set($state, 'records', records); + }, +}; diff --git a/app/javascript/dashboard/store/modules/teams/types.js b/app/javascript/dashboard/store/modules/teams/types.js new file mode 100644 index 000000000..7c0a3e8f4 --- /dev/null +++ b/app/javascript/dashboard/store/modules/teams/types.js @@ -0,0 +1,8 @@ +export const SET_TEAM_UI_FLAG = 'SET_TEAM_UI_FLAG'; +export const CLEAR_TEAMS = 'CLEAR_TEAMS'; +export const SET_TEAMS = 'SET_TEAMS'; +export const SET_TEAM_ITEM = 'SET_TEAM_ITEM'; +export const EDIT_TEAM = 'EDIT_TEAM'; +export const DELETE_TEAM = 'DELETE_TEAM'; +export const ADD_AGENTS_TO_TEAM = 'ADD_AGENTS_TO_TEAM'; +export const UPDATE_TEAMS_PRESENCE = 'UPDATE_TEAMS_PRESENCE';