scottk/chatwoot
1
0
Fork 0
mirror of https://github.com/lingble/chatwoot.git synced 2025-10-30 18:47:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: Moves portal slug as ID to query resources in vue store (#5359)

Browse Source
This commit is contained in:
Nithin David Thomas
2022-08-31 19:59:05 +05:30
committed by GitHub
parent d14beeb654
commit ebea5428bc
16 changed files with 121 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
app/javascript/dashboard/routes/dashboard/helpcenter/components/AddCategory.vue
View File

@@ -67,7 +67,6 @@
</template> </template>
<script> <script>
import { mapGetters } from 'vuex';
import alertMixin from 'shared/mixins/alertMixin'; import alertMixin from 'shared/mixins/alertMixin';
import { required, minLength } from 'vuelidate/lib/validators'; import { required, minLength } from 'vuelidate/lib/validators';
import { convertToCategorySlug } from 'dashboard/helper/commons.js'; import { convertToCategorySlug } from 'dashboard/helper/commons.js';
@@ -105,11 +104,8 @@ export default {
}, },
}, },
computed: { computed: {
...mapGetters({
selectedPortal: 'portals/getSelectedPortal',
}),
selectedPortalSlug() { selectedPortalSlug() {
return this.selectedPortal?.slug; return this.$route.params.portalSlug;
}, },
nameError() { nameError() {
if (this.$v.name.$error) { if (this.$v.name.$error) {

29
app/javascript/dashboard/routes/dashboard/helpcenter/components/HelpCenterLayout.vue
View File

@@ -32,7 +32,7 @@
<portal-popover <portal-popover
v-if="showPortalPopover" v-if="showPortalPopover"
:portals="portals" :portals="portals"
:active-portal="selectedPortal" :active-portal-slug="selectedPortalSlug"
@close-popover="closePortalPopover" @close-popover="closePortalPopover"
/> />
<add-category <add-category
@@ -77,18 +77,24 @@ export default {
showNotificationPanel: false, showNotificationPanel: false,
showPortalPopover: false, showPortalPopover: false,
showAddCategoryModal: false, showAddCategoryModal: false,
lastActivePortalSlug: '',
}; };
}, },
computed: { computed: {
...mapGetters({ ...mapGetters({
accountId: 'getCurrentAccountId', accountId: 'getCurrentAccountId',
selectedPortal: 'portals/getSelectedPortal',
portals: 'portals/allPortals', portals: 'portals/allPortals',
categories: 'categories/allCategories', categories: 'categories/allCategories',
meta: 'portals/getMeta', meta: 'portals/getMeta',
isFetching: 'portals/isFetchingPortals', isFetching: 'portals/isFetchingPortals',
}), }),
selectedPortal() {
const slug = this.$route.params.portalSlug || this.lastActivePortalSlug;
if (slug) return this.$store.getters['portals/portalBySlug'](slug);
return this.$store.getters['portals/allPortals'][0];
},
sidebarClassName() { sidebarClassName() {
if (this.isOnDesktop) { if (this.isOnDesktop) {
return ''; return '';
@@ -111,12 +117,15 @@ export default {
return this.selectedPortal ? this.selectedPortal.name : ''; return this.selectedPortal ? this.selectedPortal.name : '';
}, },
selectedPortalSlug() { selectedPortalSlug() {
return this.portalSlug || this.selectedPortal?.slug; return this.selectedPortal ? this.selectedPortal?.slug : '';
}, },
selectedPortalLocale() { selectedPortalLocale() {
return this.locale || this.selectedPortal?.meta?.default_locale; return this.selectedPortal
? this.selectedPortal?.meta?.default_locale
: '';
}, },
accessibleMenuItems() { accessibleMenuItems() {
if (!this.selectedPortal) return [];
const { const {
meta: { meta: {
all_articles_count: allArticlesCount, all_articles_count: allArticlesCount,
@@ -192,22 +201,30 @@ export default {
]; ];
}, },
currentRoute() { currentRoute() {
return ' '; return ' ';
}, },
headerTitle() { headerTitle() {
return this.selectedPortal.name; return this.selectedPortal ? this.selectedPortal.name : '';
}, },
}, },
mounted() { mounted() {
window.addEventListener('resize', this.handleResize); window.addEventListener('resize', this.handleResize);
this.handleResize(); this.handleResize();
bus.$on(BUS_EVENTS.TOGGLE_SIDEMENU, this.toggleSidebar); bus.$on(BUS_EVENTS.TOGGLE_SIDEMENU, this.toggleSidebar);
const slug = this.$route.params.portalSlug;
if (slug) this.lastActivePortalSlug = slug;
this.fetchPortalsAndItsCategories(); this.fetchPortalsAndItsCategories();
}, },
beforeDestroy() { beforeDestroy() {
bus.$off(BUS_EVENTS.TOGGLE_SIDEMENU, this.toggleSidebar); bus.$off(BUS_EVENTS.TOGGLE_SIDEMENU, this.toggleSidebar);
window.removeEventListener('resize', this.handleResize); window.removeEventListener('resize', this.handleResize);
}, },
updated() {
const slug = this.$route.params.portalSlug;
if (slug) this.lastActivePortalSlug = slug;
},
methods: { methods: {
handleResize() { handleResize() {
if (window.innerWidth > 1200) { if (window.innerWidth > 1200) {

8
app/javascript/dashboard/routes/dashboard/helpcenter/components/PortalListItem.vue
View File

@@ -194,7 +194,7 @@ export default {
this.$emit('open-site'); this.$emit('open-site');
}, },
openSettings() { openSettings() {
this.$emit('open'); this.navigateToPortalEdit();
}, },
swapLocale() { swapLocale() {
this.$emit('swap'); this.$emit('swap');
@@ -202,6 +202,12 @@ export default {
deleteLocale() { deleteLocale() {
this.$emit('delete'); this.$emit('delete');
}, },
navigateToPortalEdit() {
this.$router.push({
name: 'edit_portal_information',
params: { portalSlug: this.portal.slug },
});
},
}, },
}; };
</script> </script>

11
app/javascript/dashboard/routes/dashboard/helpcenter/components/PortalPopover.vue
View File

@@ -24,7 +24,7 @@
v-for="portal in portals" v-for="portal in portals"
:key="portal.id" :key="portal.id"
:portal="portal" :portal="portal"
:active="portal.id === activePortal.id" :active="portal.slug === activePortalSlug"
@open-portal-page="openPortalPage" @open-portal-page="openPortalPage"
/> />
</div> </div>
@@ -32,7 +32,7 @@
<woot-button variant="link" @click="closePortalPopover"> <woot-button variant="link" @click="closePortalPopover">
{{ $t('HELP_CENTER.PORTAL.POPOVER.CANCEL_BUTTON_LABEL') }} {{ $t('HELP_CENTER.PORTAL.POPOVER.CANCEL_BUTTON_LABEL') }}
</woot-button> </woot-button>
<woot-button> <woot-button @click="() => {}">
{{ $t('HELP_CENTER.PORTAL.POPOVER.CHOOSE_LOCALE_BUTTON') }} {{ $t('HELP_CENTER.PORTAL.POPOVER.CHOOSE_LOCALE_BUTTON') }}
</woot-button> </woot-button>
</footer> </footer>
@@ -52,11 +52,12 @@ export default {
type: Array, type: Array,
default: () => [], default: () => [],
}, },
activePortal: { activePortalSlug: {
type: Object, type: String,
default: () => ({}), default: '',
}, },
}, },
methods: { methods: {
closePortalPopover() { closePortalPopover() {
this.$emit('close-popover'); this.$emit('close-popover');

3
app/javascript/dashboard/routes/dashboard/helpcenter/pages/articles/EditArticle.vue
View File

@@ -58,7 +58,6 @@ export default {
...mapGetters({ ...mapGetters({
isFetching: 'articles/isFetching', isFetching: 'articles/isFetching',
articles: 'articles/articles', articles: 'articles/articles',
selectedPortal: 'portals/getSelectedPortal',
}), }),
article() { article() {
return this.$store.getters['articles/articleById'](this.articleId); return this.$store.getters['articles/articleById'](this.articleId);
@@ -67,7 +66,7 @@ export default {
return this.$route.params.articleSlug; return this.$route.params.articleSlug;
}, },
selectedPortalSlug() { selectedPortalSlug() {
return this.portalSlug || this.selectedPortal?.slug; return this.$route.params.portalSlug;
}, },
}, },
mounted() { mounted() {

3
app/javascript/dashboard/routes/dashboard/helpcenter/pages/articles/ListAllArticles.vue
View File

@@ -46,7 +46,6 @@ export default {
...mapGetters({ ...mapGetters({
articles: 'articles/allArticles', articles: 'articles/allArticles',
categories: 'categories/allCategories', categories: 'categories/allCategories',
selectedPortal: 'portals/getSelectedPortal',
uiFlags: 'articles/uiFlags', uiFlags: 'articles/uiFlags',
meta: 'articles/getMeta', meta: 'articles/getMeta',
isFetching: 'articles/isFetching', isFetching: 'articles/isFetching',
@@ -64,7 +63,7 @@ export default {
return this.isFetching && !this.articles.length; return this.isFetching && !this.articles.length;
}, },
selectedPortalSlug() { selectedPortalSlug() {
return this.selectedPortal?.slug; return this.$route.params.portalSlug;
}, },
selectedCategorySlug() { selectedCategorySlug() {
const { categorySlug } = this.$route.params; const { categorySlug } = this.$route.params;

3
app/javascript/dashboard/routes/dashboard/helpcenter/pages/articles/NewArticle.vue
View File

@@ -46,7 +46,6 @@ export default {
}, },
computed: { computed: {
...mapGetters({ ...mapGetters({
selectedPortal: 'portals/getSelectedPortal',
currentUserID: 'getCurrentUserID', currentUserID: 'getCurrentUserID',
articles: 'articles/articles', articles: 'articles/articles',
categories: 'categories/allCategories', categories: 'categories/allCategories',
@@ -58,7 +57,7 @@ export default {
return { title: this.articleTitle, content: this.articleContent }; return { title: this.articleTitle, content: this.articleContent };
}, },
selectedPortalSlug() { selectedPortalSlug() {
return this.portalSlug || this.selectedPortal?.slug; return this.$route.params.portalSlug;
}, },
categoryId() { categoryId() {
return this.categories.length ? this.categories[0].id : null; return this.categories.length ? this.categories[0].id : null;

2
app/javascript/dashboard/routes/dashboard/helpcenter/pages/portals/PortalCustomization.vue
View File

@@ -86,7 +86,7 @@ export default {
}), }),
createdPortalSlug() { createdPortalSlug() {
const { const {
params: { portal_slug: slug }, params: { portalSlug: slug },
} = this.$route; } = this.$route;
return slug; return slug;
}, },

54
app/javascript/dashboard/store/modules/helpCenterPortals/actions.js
View File

@@ -3,21 +3,17 @@ import { throwErrorMessage } from 'dashboard/store/utils/api';
import { types } from './mutations'; import { types } from './mutations';
const portalAPIs = new PortalAPI(); const portalAPIs = new PortalAPI();
export const actions = { export const actions = {
index: async ({ commit, state, dispatch }) => { index: async ({ commit }) => {
try { try {
commit(types.SET_UI_FLAG, { isFetching: true }); commit(types.SET_UI_FLAG, { isFetching: true });
const { const {
data: { payload, meta }, data: { payload, meta },
} = await portalAPIs.get(); } = await portalAPIs.get();
commit(types.CLEAR_PORTALS); commit(types.CLEAR_PORTALS);
const portalIds = payload.map(portal => portal.id); const portalSlugs = payload.map(portal => portal.slug);
commit(types.ADD_MANY_PORTALS_ENTRY, payload); commit(types.ADD_MANY_PORTALS_ENTRY, payload);
commit(types.ADD_MANY_PORTALS_IDS, portalIds); commit(types.ADD_MANY_PORTALS_IDS, portalSlugs);
const { selectedPortalId } = state;
// Check if selected portal is still in the portals list
if (!portalIds.includes(selectedPortalId)) {
dispatch('setPortalId', portalIds[0]);
}
commit(types.SET_PORTALS_META, meta); commit(types.SET_PORTALS_META, meta);
} catch (error) { } catch (error) {
throwErrorMessage(error); throwErrorMessage(error);
@@ -26,20 +22,13 @@ export const actions = {
} }
}, },
create: async ({ commit, state, dispatch }, params) => { create: async ({ commit }, params) => {
commit(types.SET_UI_FLAG, { isCreating: true }); commit(types.SET_UI_FLAG, { isCreating: true });
try { try {
const { data } = await portalAPIs.create(params); const { data } = await portalAPIs.create(params);
const { id: portalId } = data; const { slug: portalSlug } = data;
commit(types.ADD_PORTAL_ENTRY, data); commit(types.ADD_PORTAL_ENTRY, data);
commit(types.ADD_PORTAL_ID, portalId); commit(types.ADD_PORTAL_ID, portalSlug);
const {
portals: { selectedPortalId },
} = state;
// Check if there are any selected portal
if (!selectedPortalId) {
dispatch('setPortalId', portalId);
}
} catch (error) { } catch (error) {
throwErrorMessage(error); throwErrorMessage(error);
} finally { } finally {
@@ -47,47 +36,46 @@ export const actions = {
} }
}, },
update: async ({ commit }, params) => { update: async ({ commit }, { portalObj }) => {
const portalId = params.id; const portalSlug = portalObj.slug;
const portalSlug = params.slug;
commit(types.SET_HELP_PORTAL_UI_FLAG, { commit(types.SET_HELP_PORTAL_UI_FLAG, {
uiFlags: { isUpdating: true }, uiFlags: { isUpdating: true },
portalId, portalSlug,
}); });
try { try {
const { data } = await portalAPIs.updatePortal({ portalSlug, params }); const { data } = await portalAPIs.updatePortal({
portalSlug,
portalObj,
});
commit(types.UPDATE_PORTAL_ENTRY, data); commit(types.UPDATE_PORTAL_ENTRY, data);
} catch (error) { } catch (error) {
throwErrorMessage(error); throwErrorMessage(error);
} finally { } finally {
commit(types.SET_HELP_PORTAL_UI_FLAG, { commit(types.SET_HELP_PORTAL_UI_FLAG, {
uiFlags: { isUpdating: false }, uiFlags: { isUpdating: false },
portalId, portalSlug,
}); });
} }
}, },
delete: async ({ commit }, portalId) => { delete: async ({ commit }, { portalSlug }) => {
commit(types.SET_HELP_PORTAL_UI_FLAG, { commit(types.SET_HELP_PORTAL_UI_FLAG, {
uiFlags: { isDeleting: true }, uiFlags: { isDeleting: true },
portalId, portalSlug,
}); });
try { try {
await portalAPIs.delete(portalId); await portalAPIs.delete(portalSlug);
commit(types.REMOVE_PORTAL_ENTRY, portalId); commit(types.REMOVE_PORTAL_ENTRY, portalSlug);
commit(types.REMOVE_PORTAL_ID, portalId); commit(types.REMOVE_PORTAL_ID, portalSlug);
} catch (error) { } catch (error) {
throwErrorMessage(error); throwErrorMessage(error);
} finally { } finally {
commit(types.SET_HELP_PORTAL_UI_FLAG, { commit(types.SET_HELP_PORTAL_UI_FLAG, {
uiFlags: { isDeleting: false }, uiFlags: { isDeleting: false },
portalId, portalSlug,
}); });
} }
}, },
setPortalId: async ({ commit }, portalId) => {
commit(types.SET_SELECTED_PORTAL_ID, portalId);
},
updatePortal: async ({ commit }, portal) => { updatePortal: async ({ commit }, portal) => {
commit(types.UPDATE_PORTAL_ENTRY, portal); commit(types.UPDATE_PORTAL_ENTRY, portal);
}, },

13
app/javascript/dashboard/store/modules/helpCenterPortals/getters.js
View File

@@ -6,18 +6,16 @@ export const getters = {
}, },
isFetchingPortals: state => state.uiFlags.isFetching, isFetchingPortals: state => state.uiFlags.isFetching,
portalById: (...getterArguments) => portalId => { portalBySlug: (...getterArguments) => portalId => {
const [state] = getterArguments; const [state] = getterArguments;
const portal = state.portals.byId[portalId]; const portal = state.portals.byId[portalId];
return { return portal;
...portal,
};
}, },
allPortals: (...getterArguments) => { allPortals: (...getterArguments) => {
const [state, _getters] = getterArguments; const [state, _getters] = getterArguments;
const portals = state.portals.allIds.map(id => { const portals = state.portals.allIds.map(id => {
return _getters.portalById(id); return _getters.portalBySlug(id);
}); });
return portals; return portals;
}, },
@@ -25,9 +23,4 @@ export const getters = {
getMeta: state => { getMeta: state => {
return state.meta; return state.meta;
}, },
getSelectedPortal: (...getterArguments) => {
const [state, _getters] = getterArguments;
const { selectedPortalId } = state.portals;
return _getters.portalById(selectedPortalId);
},
}; };

1
app/javascript/dashboard/store/modules/helpCenterPortals/index.js
View File

@@ -25,7 +25,6 @@ const state = {
meta: { meta: {
byId: {}, byId: {},
}, },
selectedPortalId: null,
}, },
uiFlags: { uiFlags: {
allFetched: false, allFetched: false,

43
app/javascript/dashboard/store/modules/helpCenterPortals/mutations.js
View File

@@ -9,7 +9,6 @@ export const types = {
ADD_PORTAL_ID: 'addPortalId', ADD_PORTAL_ID: 'addPortalId',
CLEAR_PORTALS: 'clearPortals', CLEAR_PORTALS: 'clearPortals',
ADD_MANY_PORTALS_IDS: 'addManyPortalsIds', ADD_MANY_PORTALS_IDS: 'addManyPortalsIds',
SET_SELECTED_PORTAL_ID: 'setSelectedPortalId',
UPDATE_PORTAL_ENTRY: 'updatePortalEntry', UPDATE_PORTAL_ENTRY: 'updatePortalEntry',
REMOVE_PORTAL_ENTRY: 'removePortalEntry', REMOVE_PORTAL_ENTRY: 'removePortalEntry',
REMOVE_PORTAL_ID: 'removePortalId', REMOVE_PORTAL_ID: 'removePortalId',
@@ -25,7 +24,7 @@ export const mutations = {
}, },
[types.ADD_PORTAL_ENTRY]($state, portal) { [types.ADD_PORTAL_ENTRY]($state, portal) {
Vue.set($state.portals.byId, portal.id, { Vue.set($state.portals.byId, portal.slug, {
...portal, ...portal,
}); });
}, },
@@ -33,7 +32,7 @@ export const mutations = {
[types.ADD_MANY_PORTALS_ENTRY]($state, portals) { [types.ADD_MANY_PORTALS_ENTRY]($state, portals) {
const allPortals = { ...$state.portals.byId }; const allPortals = { ...$state.portals.byId };
portals.forEach(portal => { portals.forEach(portal => {
allPortals[portal.id] = portal; allPortals[portal.slug] = portal;
}); });
Vue.set($state.portals, 'byId', allPortals); Vue.set($state.portals, 'byId', allPortals);
}, },
@@ -41,7 +40,7 @@ export const mutations = {
[types.CLEAR_PORTALS]: $state => { [types.CLEAR_PORTALS]: $state => {
Vue.set($state.portals, 'byId', {}); Vue.set($state.portals, 'byId', {});
Vue.set($state.portals, 'allIds', []); Vue.set($state.portals, 'allIds', []);
Vue.set($state.portals, 'uiFlags.byId', {}); Vue.set($state.portals.uiFlags, 'byId', {});
}, },
[types.SET_PORTALS_META]: ($state, data) => { [types.SET_PORTALS_META]: ($state, data) => {
@@ -50,41 +49,39 @@ export const mutations = {
Vue.set($state.meta, 'currentPage', currentPage); Vue.set($state.meta, 'currentPage', currentPage);
}, },
[types.SET_SELECTED_PORTAL_ID]: ($state, portalId) => { [types.ADD_PORTAL_ID]($state, portalSlug) {
Vue.set($state.portals, 'selectedPortalId', portalId); $state.portals.allIds.push(portalSlug);
}, },
[types.ADD_PORTAL_ID]($state, portalId) { [types.ADD_MANY_PORTALS_IDS]($state, portalSlugs) {
$state.portals.allIds.push(portalId); $state.portals.allIds.push(...portalSlugs);
},
[types.ADD_MANY_PORTALS_IDS]($state, portalIds) {
$state.portals.allIds.push(...portalIds);
}, },
[types.UPDATE_PORTAL_ENTRY]($state, portal) { [types.UPDATE_PORTAL_ENTRY]($state, portal) {
const portalId = portal.id; const portalSlug = portal.slug;
if (!$state.portals.allIds.includes(portalId)) return; if (!$state.portals.allIds.includes(portalSlug)) return;
Vue.set($state.portals.byId, portalId, { Vue.set($state.portals.byId, portalSlug, {
...portal, ...portal,
}); });
}, },
[types.REMOVE_PORTAL_ENTRY]($state, portalId) { [types.REMOVE_PORTAL_ENTRY]($state, portalSlug) {
if (!portalId) return; if (!portalSlug) return;
const { [portalId]: toBeRemoved, ...newById } = $state.portals.byId; const { [portalSlug]: toBeRemoved, ...newById } = $state.portals.byId;
Vue.set($state.portals, 'byId', newById); Vue.set($state.portals, 'byId', newById);
}, },
[types.REMOVE_PORTAL_ID]($state, portalId) { [types.REMOVE_PORTAL_ID]($state, portalSlug) {
$state.portals.allIds = $state.portals.allIds.filter(id => id !== portalId); $state.portals.allIds = $state.portals.allIds.filter(
slug => slug !== portalSlug
);
}, },
[types.SET_HELP_PORTAL_UI_FLAG]($state, { portalId, uiFlags }) { [types.SET_HELP_PORTAL_UI_FLAG]($state, { portalSlug, uiFlags }) {
const flags = $state.portals.uiFlags.byId[portalId]; const flags = $state.portals.uiFlags.byId[portalSlug];
Vue.set($state.portals.uiFlags.byId, portalId, { Vue.set($state.portals.uiFlags.byId, portalSlug, {
...defaultPortalFlags, ...defaultPortalFlags,
...flags, ...flags,
...uiFlags, ...uiFlags,

53
app/javascript/dashboard/store/modules/helpCenterPortals/specs/actions.spec.js
View File

@@ -15,16 +15,13 @@ describe('#actions', () => {
await actions.index({ await actions.index({
commit, commit,
dispatch, dispatch,
state: { state: {},
selectedPortalId: 4,
},
}); });
expect(dispatch.mock.calls).toMatchObject([['setPortalId', 1]]);
expect(commit.mock.calls).toEqual([ expect(commit.mock.calls).toEqual([
[types.SET_UI_FLAG, { isFetching: true }], [types.SET_UI_FLAG, { isFetching: true }],
[types.CLEAR_PORTALS], [types.CLEAR_PORTALS],
[types.ADD_MANY_PORTALS_ENTRY, apiResponse.payload], [types.ADD_MANY_PORTALS_ENTRY, apiResponse.payload],
[types.ADD_MANY_PORTALS_IDS, [1, 2]], [types.ADD_MANY_PORTALS_IDS, ['domain', 'campaign']],
[types.SET_PORTALS_META, { current_page: 1, portals_count: 1 }], [types.SET_PORTALS_META, { current_page: 1, portals_count: 1 }],
[types.SET_UI_FLAG, { isFetching: false }], [types.SET_UI_FLAG, { isFetching: false }],
]); ]);
@@ -43,7 +40,7 @@ describe('#actions', () => {
it('sends correct actions if API is success', async () => { it('sends correct actions if API is success', async () => {
axios.post.mockResolvedValue({ data: apiResponse.payload[1] }); axios.post.mockResolvedValue({ data: apiResponse.payload[1] });
await actions.create( await actions.create(
{ commit, dispatch, state: { portals: { selectedPortalId: null } } }, { commit, dispatch, state: { portals: {} } },
{ {
color: 'red', color: 'red',
custom_domain: 'domain_for_help', custom_domain: 'domain_for_help',
@@ -53,17 +50,14 @@ describe('#actions', () => {
expect(commit.mock.calls).toEqual([ expect(commit.mock.calls).toEqual([
[types.SET_UI_FLAG, { isCreating: true }], [types.SET_UI_FLAG, { isCreating: true }],
[types.ADD_PORTAL_ENTRY, apiResponse.payload[1]], [types.ADD_PORTAL_ENTRY, apiResponse.payload[1]],
[types.ADD_PORTAL_ID, 2], [types.ADD_PORTAL_ID, 'campaign'],
[types.SET_UI_FLAG, { isCreating: false }], [types.SET_UI_FLAG, { isCreating: false }],
]); ]);
}); });
it('sends correct actions if API is error', async () => { it('sends correct actions if API is error', async () => {
axios.post.mockRejectedValue({ message: 'Incorrect header' }); axios.post.mockRejectedValue({ message: 'Incorrect header' });
await expect( await expect(
actions.create( actions.create({ commit, dispatch, state: { portals: {} } }, {})
{ commit, dispatch, state: { portals: { selectedPortalId: null } } },
{}
)
).rejects.toThrow(Error); ).rejects.toThrow(Error);
expect(commit.mock.calls).toEqual([ expect(commit.mock.calls).toEqual([
[types.SET_UI_FLAG, { isCreating: true }], [types.SET_UI_FLAG, { isCreating: true }],
@@ -75,32 +69,32 @@ describe('#actions', () => {
describe('#update', () => { describe('#update', () => {
it('sends correct actions if API is success', async () => { it('sends correct actions if API is success', async () => {
axios.patch.mockResolvedValue({ data: apiResponse.payload[1] }); axios.patch.mockResolvedValue({ data: apiResponse.payload[1] });
await actions.update({ commit }, apiResponse.payload[1]); await actions.update({ commit }, { portalObj: apiResponse.payload[1] });
expect(commit.mock.calls).toEqual([ expect(commit.mock.calls).toEqual([
[ [
types.SET_HELP_PORTAL_UI_FLAG, types.SET_HELP_PORTAL_UI_FLAG,
{ uiFlags: { isUpdating: true }, portalId: 2 }, { uiFlags: { isUpdating: true }, portalSlug: 'campaign' },
], ],
[types.UPDATE_PORTAL_ENTRY, apiResponse.payload[1]], [types.UPDATE_PORTAL_ENTRY, apiResponse.payload[1]],
[ [
types.SET_HELP_PORTAL_UI_FLAG, types.SET_HELP_PORTAL_UI_FLAG,
{ uiFlags: { isUpdating: false }, portalId: 2 }, { uiFlags: { isUpdating: false }, portalSlug: 'campaign' },
], ],
]); ]);
}); });
it('sends correct actions if API is error', async () => { it('sends correct actions if API is error', async () => {
axios.patch.mockRejectedValue({ message: 'Incorrect header' }); axios.patch.mockRejectedValue({ message: 'Incorrect header' });
await expect( await expect(
actions.update({ commit }, apiResponse.payload[1]) actions.update({ commit }, { portalObj: apiResponse.payload[1] })
).rejects.toThrow(Error); ).rejects.toThrow(Error);
expect(commit.mock.calls).toEqual([ expect(commit.mock.calls).toEqual([
[ [
types.SET_HELP_PORTAL_UI_FLAG, types.SET_HELP_PORTAL_UI_FLAG,
{ uiFlags: { isUpdating: true }, portalId: 2 }, { uiFlags: { isUpdating: true }, portalSlug: 'campaign' },
], ],
[ [
types.SET_HELP_PORTAL_UI_FLAG, types.SET_HELP_PORTAL_UI_FLAG,
{ uiFlags: { isUpdating: false }, portalId: 2 }, { uiFlags: { isUpdating: false }, portalSlug: 'campaign' },
], ],
]); ]);
}); });
@@ -109,40 +103,35 @@ describe('#actions', () => {
describe('#delete', () => { describe('#delete', () => {
it('sends correct actions if API is success', async () => { it('sends correct actions if API is success', async () => {
axios.delete.mockResolvedValue({}); axios.delete.mockResolvedValue({});
await actions.delete({ commit }, 2); await actions.delete({ commit }, { portalSlug: 'campaign' });
expect(commit.mock.calls).toEqual([ expect(commit.mock.calls).toEqual([
[ [
types.SET_HELP_PORTAL_UI_FLAG, types.SET_HELP_PORTAL_UI_FLAG,
{ uiFlags: { isDeleting: true }, portalId: 2 }, { uiFlags: { isDeleting: true }, portalSlug: 'campaign' },
], ],
[types.REMOVE_PORTAL_ENTRY, 2], [types.REMOVE_PORTAL_ENTRY, 'campaign'],
[types.REMOVE_PORTAL_ID, 2], [types.REMOVE_PORTAL_ID, 'campaign'],
[ [
types.SET_HELP_PORTAL_UI_FLAG, types.SET_HELP_PORTAL_UI_FLAG,
{ uiFlags: { isDeleting: false }, portalId: 2 }, { uiFlags: { isDeleting: false }, portalSlug: 'campaign' },
], ],
]); ]);
}); });
it('sends correct actions if API is error', async () => { it('sends correct actions if API is error', async () => {
axios.delete.mockRejectedValue({ message: 'Incorrect header' }); axios.delete.mockRejectedValue({ message: 'Incorrect header' });
await expect(actions.delete({ commit }, 2)).rejects.toThrow(Error); await expect(
actions.delete({ commit }, { portalSlug: 'campaign' })
).rejects.toThrow(Error);
expect(commit.mock.calls).toEqual([ expect(commit.mock.calls).toEqual([
[ [
types.SET_HELP_PORTAL_UI_FLAG, types.SET_HELP_PORTAL_UI_FLAG,
{ uiFlags: { isDeleting: true }, portalId: 2 }, { uiFlags: { isDeleting: true }, portalSlug: 'campaign' },
], ],
[ [
types.SET_HELP_PORTAL_UI_FLAG, types.SET_HELP_PORTAL_UI_FLAG,
{ uiFlags: { isDeleting: false }, portalId: 2 }, { uiFlags: { isDeleting: false }, portalSlug: 'campaign' },
], ],
]); ]);
}); });
}); });
describe('#setPortalId', () => {
it('sends correct actions', async () => {
axios.delete.mockResolvedValue({});
await actions.setPortalId({ commit }, 1);
expect(commit.mock.calls).toEqual([[types.SET_SELECTED_PORTAL_ID, 1]]);
});
});
}); });

1
app/javascript/dashboard/store/modules/helpCenterPortals/specs/fixtures.js
View File

@@ -40,7 +40,6 @@ export default {
1: { isFetching: false, isUpdating: true, isDeleting: false }, 1: { isFetching: false, isUpdating: true, isDeleting: false },
}, },
}, },
selectedPortalId: 1,
}, },
uiFlags: { uiFlags: {
allFetched: false, allFetched: false,

4
app/javascript/dashboard/store/modules/helpCenterPortals/specs/getters.spec.js
View File

@@ -16,9 +16,9 @@ describe('#getters', () => {
expect(getters.isFetchingPortals(state)).toEqual(true); expect(getters.isFetchingPortals(state)).toEqual(true);
}); });
it('portalById', () => { it('portalBySlug', () => {
const state = portal; const state = portal;
expect(getters.portalById(state)(1)).toEqual({ expect(getters.portalBySlug(state)(1)).toEqual({
id: 1, id: 1,
color: 'red', color: 'red',
custom_domain: 'domain_for_help', custom_domain: 'domain_for_help',

35
app/javascript/dashboard/store/modules/helpCenterPortals/specs/mutations.spec.js
View File

@@ -31,13 +31,13 @@ describe('#mutations', () => {
expect(state).toEqual(portal); expect(state).toEqual(portal);
}); });
it('does adds helpcenter object to state', () => { it('does adds helpcenter object to state', () => {
mutations[types.ADD_PORTAL_ENTRY](state, { id: 3 }); mutations[types.ADD_PORTAL_ENTRY](state, { slug: 'new' });
expect(state.portals.byId[3]).toEqual({ id: 3 }); expect(state.portals.byId.new).toEqual({ slug: 'new' });
}); });
}); });
describe('[types.ADD_PORTAL_ID]', () => { describe('[types.ADD_PORTAL_ID]', () => {
it('adds helpcenter id to state', () => { it('adds helpcenter slug to state', () => {
mutations[types.ADD_PORTAL_ID](state, 12); mutations[types.ADD_PORTAL_ID](state, 12);
expect(state.portals.allIds).toEqual([1, 2, 12]); expect(state.portals.allIds).toEqual([1, 2, 12]);
}); });
@@ -48,13 +48,13 @@ describe('#mutations', () => {
mutations[types.UPDATE_PORTAL_ENTRY](state, {}); mutations[types.UPDATE_PORTAL_ENTRY](state, {});
expect(state).toEqual(portal); expect(state).toEqual(portal);
}); });
it('does not updates if object id is not present ', () => { it('does not updates if object slug is not present ', () => {
mutations[types.UPDATE_PORTAL_ENTRY](state, { id: 5 }); mutations[types.UPDATE_PORTAL_ENTRY](state, { slug: 5 });
expect(state).toEqual(portal); expect(state).toEqual(portal);
}); });
it(' updates if object with id already present in the state', () => { it(' updates if object with slug already present in the state', () => {
mutations[types.UPDATE_PORTAL_ENTRY](state, { mutations[types.UPDATE_PORTAL_ENTRY](state, {
id: 2, slug: 2,
name: 'Updated name', name: 'Updated name',
}); });
expect(state.portals.byId[2].name).toEqual('Updated name'); expect(state.portals.byId[2].name).toEqual('Updated name');
@@ -62,7 +62,7 @@ describe('#mutations', () => {
}); });
describe('[types.REMOVE_PORTAL_ENTRY]', () => { describe('[types.REMOVE_PORTAL_ENTRY]', () => {
it('does not remove object entry if no id is passed', () => { it('does not remove object entry if no slug is passed', () => {
mutations[types.REMOVE_PORTAL_ENTRY](state, undefined); mutations[types.REMOVE_PORTAL_ENTRY](state, undefined);
expect(state).toEqual({ ...portal }); expect(state).toEqual({ ...portal });
}); });
@@ -73,7 +73,7 @@ describe('#mutations', () => {
}); });
describe('[types.REMOVE_PORTAL_ID]', () => { describe('[types.REMOVE_PORTAL_ID]', () => {
it('removes id from state', () => { it('removes slug from state', () => {
mutations[types.REMOVE_PORTAL_ID](state, 2); mutations[types.REMOVE_PORTAL_ID](state, 2);
expect(state.portals.allIds).toEqual([1, 12]); expect(state.portals.allIds).toEqual([1, 12]);
}); });
@@ -82,12 +82,12 @@ describe('#mutations', () => {
describe('[types.SET_HELP_PORTAL_UI_FLAG]', () => { describe('[types.SET_HELP_PORTAL_UI_FLAG]', () => {
it('sets correct flag in state', () => { it('sets correct flag in state', () => {
mutations[types.SET_HELP_PORTAL_UI_FLAG](state, { mutations[types.SET_HELP_PORTAL_UI_FLAG](state, {
portalId: 1, portalSlug: 'domain',
uiFlags: { isFetching: true }, uiFlags: { isFetching: true },
}); });
expect(state.portals.uiFlags.byId[1]).toEqual({ expect(state.portals.uiFlags.byId.domain).toEqual({
isFetching: true, isFetching: true,
isUpdating: true, isUpdating: false,
isDeleting: false, isDeleting: false,
}); });
}); });
@@ -99,9 +99,7 @@ describe('#mutations', () => {
expect(state.portals.allIds).toEqual([]); expect(state.portals.allIds).toEqual([]);
expect(state.portals.byId).toEqual({}); expect(state.portals.byId).toEqual({});
expect(state.portals.uiFlags).toEqual({ expect(state.portals.uiFlags).toEqual({
byId: { byId: {},
'1': { isFetching: true, isUpdating: true, isDeleting: false },
},
}); });
}); });
}); });
@@ -118,11 +116,4 @@ describe('#mutations', () => {
}); });
}); });
}); });
describe('#SET_SELECTED_PORTAL_ID', () => {
it('set selected portal id', () => {
mutations[types.SET_SELECTED_PORTAL_ID](state, 4);
expect(state.portals.selectedPortalId).toEqual(4);
});
});
}); });