chore: Use availability in dashboard presence toggle (#3212)

This commit is contained in:
Sojan Jose 2021-10-15 00:30:48 +05:30 committed by GitHub
parent ed25435ac2
commit cebd34053b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 22 additions and 19 deletions

View file

@ -1,7 +1,7 @@
<template> <template>
<div class="status"> <div class="status">
<div class="status-view"> <div class="status-view">
<availability-status-badge :status="currentUserAvailabilityStatus" /> <availability-status-badge :status="currentUserAvailability" />
<div class="status-view--title"> <div class="status-view--title">
{{ availabilityDisplayLabel }} {{ availabilityDisplayLabel }}
</div> </div>
@ -77,12 +77,12 @@ export default {
computed: { computed: {
...mapGetters({ ...mapGetters({
getCurrentUserAvailabilityStatus: 'getCurrentUserAvailabilityStatus', getCurrentUserAvailability: 'getCurrentUserAvailability',
getCurrentAccountId: 'getCurrentAccountId', getCurrentAccountId: 'getCurrentAccountId',
}), }),
availabilityDisplayLabel() { availabilityDisplayLabel() {
const availabilityIndex = AVAILABILITY_STATUS_KEYS.findIndex( const availabilityIndex = AVAILABILITY_STATUS_KEYS.findIndex(
key => key === this.currentUserAvailabilityStatus key => key === this.currentUserAvailability
); );
return this.$t('PROFILE_SETTINGS.FORM.AVAILABILITY.STATUSES_LIST')[ return this.$t('PROFILE_SETTINGS.FORM.AVAILABILITY.STATUSES_LIST')[
availabilityIndex availabilityIndex
@ -91,8 +91,8 @@ export default {
currentAccountId() { currentAccountId() {
return this.getCurrentAccountId; return this.getCurrentAccountId;
}, },
currentUserAvailabilityStatus() { currentUserAvailability() {
return this.getCurrentUserAvailabilityStatus; return this.getCurrentUserAvailability;
}, },
availabilityStatuses() { availabilityStatuses() {
return this.$t('PROFILE_SETTINGS.FORM.AVAILABILITY.STATUSES_LIST').map( return this.$t('PROFILE_SETTINGS.FORM.AVAILABILITY.STATUSES_LIST').map(
@ -100,7 +100,7 @@ export default {
label: statusLabel, label: statusLabel,
value: AVAILABILITY_STATUS_KEYS[index], value: AVAILABILITY_STATUS_KEYS[index],
disabled: disabled:
this.currentUserAvailabilityStatus === this.currentUserAvailability ===
AVAILABILITY_STATUS_KEYS[index], AVAILABILITY_STATUS_KEYS[index],
}) })
); );

View file

@ -17,7 +17,7 @@ const i18nConfig = new VueI18n({
}); });
describe('AvailabilityStatus', () => { describe('AvailabilityStatus', () => {
const currentAvailabilityStatus = 'online' ; const currentAvailability = 'online';
const currentAccountId = '1'; const currentAccountId = '1';
let store = null; let store = null;
let actions = null; let actions = null;
@ -34,7 +34,7 @@ describe('AvailabilityStatus', () => {
modules = { modules = {
auth: { auth: {
getters: { getters: {
getCurrentUserAvailabilityStatus: () => currentAvailabilityStatus, getCurrentUserAvailability: () => currentAvailability,
getCurrentAccountId: () => currentAccountId, getCurrentAccountId: () => currentAccountId,
}, },
}, },

View file

@ -34,7 +34,7 @@ class ActionCableConnector extends BaseActionCableConnector {
onPresenceUpdate = data => { onPresenceUpdate = data => {
this.app.$store.dispatch('contacts/updatePresence', data.contacts); this.app.$store.dispatch('contacts/updatePresence', data.contacts);
this.app.$store.dispatch('agents/updatePresence', data.users); this.app.$store.dispatch('agents/updatePresence', data.users);
this.app.$store.dispatch('setCurrentUserAvailabilityStatus', data.users); this.app.$store.dispatch('setCurrentUserAvailability', data.users);
}; };
onConversationContactChange = payload => { onConversationContactChange = payload => {

View file

@ -39,12 +39,12 @@ export const getters = {
return _state.currentUser.ui_settings || {}; return _state.currentUser.ui_settings || {};
}, },
getCurrentUserAvailabilityStatus(_state) { getCurrentUserAvailability(_state) {
const { accounts = [] } = _state.currentUser; const { accounts = [] } = _state.currentUser;
const [currentAccount = {}] = accounts.filter( const [currentAccount = {}] = accounts.filter(
account => account.id === _state.currentAccountId account => account.id === _state.currentAccountId
); );
return currentAccount.availability_status; return currentAccount.availability;
}, },
getCurrentAccountId(_state) { getCurrentAccountId(_state) {
@ -146,7 +146,7 @@ export const actions = {
commit(types.default.SET_CURRENT_ACCOUNT_ID, accountId); commit(types.default.SET_CURRENT_ACCOUNT_ID, accountId);
}, },
setCurrentUserAvailabilityStatus({ commit, state: $state }, data) { setCurrentUserAvailability({ commit, state: $state }, data) {
if (data[$state.currentUser.id]) { if (data[$state.currentUser.id]) {
commit( commit(
types.default.SET_CURRENT_USER_AVAILABILITY, types.default.SET_CURRENT_USER_AVAILABILITY,
@ -158,8 +158,8 @@ export const actions = {
// mutations // mutations
export const mutations = { export const mutations = {
[types.default.SET_CURRENT_USER_AVAILABILITY](_state, status) { [types.default.SET_CURRENT_USER_AVAILABILITY](_state, availability) {
Vue.set(_state.currentUser, 'availability_status', status); Vue.set(_state.currentUser, 'availability', availability);
}, },
[types.default.CLEAR_USER](_state) { [types.default.CLEAR_USER](_state) {
_state.currentUser.id = null; _state.currentUser.id = null;

View file

@ -115,9 +115,9 @@ describe('#actions', () => {
}); });
}); });
describe('#setCurrentUserAvailabilityStatus', () => { describe('#setCurrentUserAvailability', () => {
it('sends correct mutations if user id is available', async () => { it('sends correct mutations if user id is available', async () => {
actions.setCurrentUserAvailabilityStatus( actions.setCurrentUserAvailability(
{ {
commit, commit,
state: { currentUser: { id: 1 } }, state: { currentUser: { id: 1 } },
@ -130,7 +130,7 @@ describe('#actions', () => {
}); });
it('does not send correct mutations if user id is not available', async () => { it('does not send correct mutations if user id is not available', async () => {
actions.setCurrentUserAvailabilityStatus( actions.setCurrentUserAvailability(
{ {
commit, commit,
state: { currentUser: { id: 1 } }, state: { currentUser: { id: 1 } },

View file

@ -20,11 +20,11 @@ describe('#getters', () => {
it('get', () => { it('get', () => {
expect( expect(
getters.getCurrentUserAvailabilityStatus({ getters.getCurrentUserAvailability({
currentAccountId: 1, currentAccountId: 1,
currentUser: { currentUser: {
id: 1, id: 1,
accounts: [{ id: 1, availability_status: 'busy' }], accounts: [{ id: 1, availability: 'busy' }],
}, },
}) })
).toEqual('busy'); ).toEqual('busy');

View file

@ -21,6 +21,9 @@ json.accounts do
json.name account_user.account.name json.name account_user.account.name
json.active_at account_user.active_at json.active_at account_user.active_at
json.role account_user.role json.role account_user.role
# the actual availability user has configured
json.availability account_user.availability
# availability derived from presence
json.availability_status account_user.availability_status json.availability_status account_user.availability_status
json.auto_offline account_user.auto_offline json.auto_offline account_user.auto_offline
end end