diff --git a/app/javascript/dashboard/api/customViews.js b/app/javascript/dashboard/api/customViews.js index 03bb9dee8..3fd4e12a7 100644 --- a/app/javascript/dashboard/api/customViews.js +++ b/app/javascript/dashboard/api/customViews.js @@ -9,6 +9,10 @@ class CustomViewsAPI extends ApiClient { getCustomViewsByFilterType(type) { return axios.get(`${this.url}?filter_type=${type}`); } + + deleteCustomViews(id, type) { + return axios.delete(`${this.url}/${id}?filter_type=${type}`); + } } export default new CustomViewsAPI(); diff --git a/app/javascript/dashboard/i18n/locale/en/advancedFilters.json b/app/javascript/dashboard/i18n/locale/en/advancedFilters.json index 4dc077427..492c27620 100644 --- a/app/javascript/dashboard/i18n/locale/en/advancedFilters.json +++ b/app/javascript/dashboard/i18n/locale/en/advancedFilters.json @@ -52,8 +52,8 @@ "CONFIRM": { "TITLE": "Confirm Deletion", "MESSAGE": "Are you sure to delete the filter ", - "YES": "Yes, Delete ", - "NO": "No, Keep " + "YES": "Yes, Delete", + "NO": "No, Keep it" } }, "API": { diff --git a/app/javascript/dashboard/i18n/locale/en/contact.json b/app/javascript/dashboard/i18n/locale/en/contact.json index 76e47697c..3824d9593 100644 --- a/app/javascript/dashboard/i18n/locale/en/contact.json +++ b/app/javascript/dashboard/i18n/locale/en/contact.json @@ -180,6 +180,7 @@ "SEARCH_INPUT_PLACEHOLDER": "Search for contacts", "FILTER_CONTACTS": "Filter", "FILTER_CONTACTS_SAVE": "Save filter", + "FILTER_CONTACTS_DELETE": "Delete filter", "LIST": { "LOADING_MESSAGE": "Loading contacts...", "404": "No contacts matches your search 🔍", diff --git a/app/javascript/dashboard/routes/dashboard/contacts/components/ContactsView.vue b/app/javascript/dashboard/routes/dashboard/contacts/components/ContactsView.vue index 6ca94b3cf..39bc16b08 100644 --- a/app/javascript/dashboard/routes/dashboard/contacts/components/ContactsView.vue +++ b/app/javascript/dashboard/routes/dashboard/contacts/components/ContactsView.vue @@ -12,6 +12,7 @@ :on-toggle-filter="onToggleFilters" :header-title="pageTitle" @on-toggle-save-filter="onToggleSaveFilters" + @on-toggle-delete-filter="onToggleDeleteFilters" /> + + + + + + {{ $t('CONTACTS_PAGE.FILTER_CONTACTS_DELETE') }} + +
+ diff --git a/app/javascript/dashboard/routes/dashboard/customviews/DeleteCustomViews.vue b/app/javascript/dashboard/routes/dashboard/customviews/DeleteCustomViews.vue index 979a7f9bb..6d01e387c 100644 --- a/app/javascript/dashboard/routes/dashboard/customviews/DeleteCustomViews.vue +++ b/app/javascript/dashboard/routes/dashboard/customviews/DeleteCustomViews.vue @@ -30,31 +30,49 @@ export default { type: [String, Number], default: 0, }, + activeFilterType: { + type: Number, + default: 0, + }, }, computed: { + activeCustomViews() { + if (this.activeFilterType === 0) { + return 'conversation'; + } + if (this.activeFilterType === 1) { + return 'contact'; + } + return ''; + }, deleteMessage() { return `${this.$t( 'FILTER.CUSTOM_VIEWS.DELETE.MODAL.CONFIRM.MESSAGE' )} ${this.activeCustomView && this.activeCustomView.name} ?`; }, deleteConfirmText() { - return `${this.$t('FILTER.CUSTOM_VIEWS.DELETE.MODAL.CONFIRM.YES')} ${this - .activeCustomView && this.activeCustomView.name}`; + return `${this.$t('FILTER.CUSTOM_VIEWS.DELETE.MODAL.CONFIRM.YES')}`; }, deleteRejectText() { - return `${this.$t('FILTER.CUSTOM_VIEWS.DELETE.MODAL.CONFIRM.NO')} ${this - .activeCustomView && this.activeCustomView.name}`; + return `${this.$t('FILTER.CUSTOM_VIEWS.DELETE.MODAL.CONFIRM.NO')}`; + }, + isFolderSection() { + return this.activeFilterType === 0 && this.$route.name !== 'home'; + }, + isSegmentSection() { + return ( + this.activeFilterType === 1 && this.$route.name !== 'contacts_dashboard' + ); }, }, methods: { async deleteSavedCustomViews() { try { - await this.$store.dispatch( - 'customViews/delete', - Number(this.customViewsId) - ); + const id = Number(this.customViewsId); + const filterType = this.activeCustomViews; + await this.$store.dispatch('customViews/delete', { id, filterType }); this.closeDeletePopup(); this.showAlert( this.$t('FILTER.CUSTOM_VIEWS.DELETE.API.SUCCESS_MESSAGE') @@ -65,9 +83,12 @@ export default { this.$t('FILTER.CUSTOM_VIEWS.DELETE.API.ERROR_MESSAGE'); this.showAlert(errorMessage); } - if (this.$route.name !== 'home') { + if (this.isFolderSection) { this.$router.push({ name: 'home' }); } + if (this.isSegmentSection) { + this.$router.push({ name: 'contacts_dashboard' }); + } }, closeDeletePopup() { this.$emit('close'); diff --git a/app/javascript/dashboard/store/modules/customViews.js b/app/javascript/dashboard/store/modules/customViews.js index 252db4107..40b126663 100644 --- a/app/javascript/dashboard/store/modules/customViews.js +++ b/app/javascript/dashboard/store/modules/customViews.js @@ -49,10 +49,10 @@ export const actions = { commit(types.SET_CUSTOM_VIEW_UI_FLAG, { isCreating: false }); } }, - delete: async ({ commit }, id) => { + delete: async ({ commit }, { id, filterType }) => { commit(types.SET_CUSTOM_VIEW_UI_FLAG, { isDeleting: true }); try { - await CustomViewsAPI.delete(id); + await CustomViewsAPI.deleteCustomViews(id, filterType); commit(types.DELETE_CUSTOM_VIEW, id); } catch (error) { throw new Error(error); diff --git a/app/javascript/dashboard/store/modules/specs/customViews/actions.spec.js b/app/javascript/dashboard/store/modules/specs/customViews/actions.spec.js index 32d748a1b..5de9732c6 100644 --- a/app/javascript/dashboard/store/modules/specs/customViews/actions.spec.js +++ b/app/javascript/dashboard/store/modules/specs/customViews/actions.spec.js @@ -51,18 +51,16 @@ describe('#actions', () => { describe('#delete', () => { it('sends correct actions if API is success', async () => { axios.delete.mockResolvedValue({ data: customViewList[0] }); - await actions.delete({ commit }, customViewList[0].id); + await actions.delete({ commit }, { id: 1, filterType: 'contact' }); expect(commit.mock.calls).toEqual([ [types.default.SET_CUSTOM_VIEW_UI_FLAG, { isDeleting: true }], - [types.default.DELETE_CUSTOM_VIEW, customViewList[0].id], + [types.default.DELETE_CUSTOM_VIEW, 1], [types.default.SET_CUSTOM_VIEW_UI_FLAG, { isDeleting: false }], ]); }); it('sends correct actions if API is error', async () => { axios.delete.mockRejectedValue({ message: 'Incorrect header' }); - await expect( - actions.delete({ commit }, customViewList[0].id) - ).rejects.toThrow(Error); + await expect(actions.delete({ commit }, 1)).rejects.toThrow(Error); expect(commit.mock.calls).toEqual([ [types.default.SET_CUSTOM_VIEW_UI_FLAG, { isDeleting: true }], [types.default.SET_CUSTOM_VIEW_UI_FLAG, { isDeleting: false }],