feat: Sort contacts via name, email, phone_number, last_activity_at (#1870)

This commit is contained in:
Pranav Raj S
2021-05-13 13:32:19 +05:30
committed by GitHub
parent 368bab2553
commit 0e6cd699e8
24 changed files with 279 additions and 76 deletions

View File

@@ -6,12 +6,12 @@ import types from '../../mutation-types';
import ContactAPI from '../../../api/contacts';
export const actions = {
search: async ({ commit }, { search, page }) => {
search: async ({ commit }, { search, page, sortAttr }) => {
commit(types.SET_CONTACT_UI_FLAG, { isFetching: true });
try {
const {
data: { payload, meta },
} = await ContactAPI.search(search, page);
} = await ContactAPI.search(search, page, sortAttr);
commit(types.CLEAR_CONTACTS);
commit(types.SET_CONTACTS, payload);
commit(types.SET_CONTACT_META, meta);
@@ -21,12 +21,12 @@ export const actions = {
}
},
get: async ({ commit }, { page = 1 } = {}) => {
get: async ({ commit }, { page = 1, sortAttr } = {}) => {
commit(types.SET_CONTACT_UI_FLAG, { isFetching: true });
try {
const {
data: { payload, meta },
} = await ContactAPI.get(page);
} = await ContactAPI.get(page, sortAttr);
commit(types.CLEAR_CONTACTS);
commit(types.SET_CONTACTS, payload);
commit(types.SET_CONTACT_META, meta);

View File

@@ -1,6 +1,6 @@
export const getters = {
getContacts($state) {
return Object.values($state.records);
return $state.sortOrder.map(contactId => $state.records[contactId]);
},
getUIFlags($state) {
return $state.uiFlags;

View File

@@ -14,6 +14,7 @@ const state = {
isFetchingInboxes: false,
isUpdating: false,
},
sortOrder: [],
};
export default {

View File

@@ -11,6 +11,7 @@ export const mutations = {
[types.CLEAR_CONTACTS]: $state => {
Vue.set($state, 'records', {});
Vue.set($state, 'sortOrder', []);
},
[types.SET_CONTACT_META]: ($state, data) => {
@@ -20,12 +21,14 @@ export const mutations = {
},
[types.SET_CONTACTS]: ($state, data) => {
data.forEach(contact => {
const sortOrder = data.map(contact => {
Vue.set($state.records, contact.id, {
...($state.records[contact.id] || {}),
...contact,
});
return contact.id;
});
$state.sortOrder = sortOrder;
},
[types.SET_CONTACT_ITEM]: ($state, data) => {
@@ -33,6 +36,10 @@ export const mutations = {
...($state.records[data.id] || {}),
...data,
});
if (!$state.sortOrder.includes(data.id)) {
$state.sortOrder.push(data.id);
}
},
[types.EDIT_CONTACT]: ($state, data) => {

View File

@@ -6,9 +6,13 @@ const { getters } = Contacts;
describe('#getters', () => {
it('getContacts', () => {
const state = {
records: { 1: contactList[0] },
records: { 1: contactList[0], 3: contactList[2] },
sortOrder: [3, 1],
};
expect(getters.getContacts(state)).toEqual([contactList[0]]);
expect(getters.getContacts(state)).toEqual([
contactList[2],
contactList[0],
]);
});
it('getContact', () => {

View File

@@ -7,6 +7,7 @@ describe('#mutations', () => {
it('set contact records', () => {
const state = { records: {} };
mutations[types.SET_CONTACTS](state, [
{ id: 2, name: 'contact2', email: 'contact2@chatwoot.com' },
{ id: 1, name: 'contact1', email: 'contact1@chatwoot.com' },
]);
expect(state.records).toEqual({
@@ -15,7 +16,13 @@ describe('#mutations', () => {
name: 'contact1',
email: 'contact1@chatwoot.com',
},
2: {
id: 2,
name: 'contact2',
email: 'contact2@chatwoot.com',
},
});
expect(state.sortOrder).toEqual([2, 1]);
});
});
@@ -25,6 +32,7 @@ describe('#mutations', () => {
records: {
1: { id: 1, name: 'contact1', email: 'contact1@chatwoot.com' },
},
sortOrder: [1],
};
mutations[types.SET_CONTACT_ITEM](state, {
id: 2,
@@ -35,6 +43,7 @@ describe('#mutations', () => {
1: { id: 1, name: 'contact1', email: 'contact1@chatwoot.com' },
2: { id: 2, name: 'contact2', email: 'contact2@chatwoot.com' },
});
expect(state.sortOrder).toEqual([1, 2]);
});
});