LeadMagnet/leadchat
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

feat: Articles store integration (#5133)

Browse Source
This commit is contained in:
Muhsin Keloth
2022-08-02 17:14:10 +05:30
committed by GitHub
parent 82207c0d3e
commit 5735a8e377
22 changed files with 272 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
app/javascript/dashboard/store/actions.js
View File

2
app/javascript/dashboard/store/index.js
View File

@@ -35,6 +35,7 @@ import teamMembers from './modules/teamMembers';
import teams from './modules/teams';
import userNotificationSettings from './modules/userNotificationSettings';
import webhooks from './modules/webhooks';
import articles from './modules/helpCenterArticles';
Vue.use(Vuex);
export default new Vuex.Store({
@@ -73,5 +74,6 @@ export default new Vuex.Store({
teams,
userNotificationSettings,
webhooks,
articles,
},
});

35
app/javascript/dashboard/store/modules/helpCenterArticles/actions.js
View File

@@ -1,13 +1,22 @@
import articlesAPI from 'dashboard/api/helpCenter/articles.js';
import portalAPI from 'dashboard/api/helpCenter/portals';
import articlesAPI from 'dashboard/api/helpCenter/articles';
import { throwErrorMessage } from 'dashboard/store/utils/api';
import types from '../../mutation-types';
export const actions = {
index: async ({ commit }) => {
index: async ({ commit }, { pageNumber, portalSlug, locale }) => {
try {
commit(types.SET_UI_FLAG, { isFetching: true });
const { data } = await articlesAPI.get();
const articleIds = data.map(article => article.id);
commit(types.ADD_MANY_ARTICLES, data);
const {
data: { payload, meta },
} = await portalAPI.getArticles({
pageNumber,
portalSlug,
locale,
});
const articleIds = payload.map(article => article.id);
commit(types.CLEAR_ARTICLES);
commit(types.ADD_MANY_ARTICLES, payload);
commit(types.SET_ARTICLES_META, meta);
commit(types.ADD_MANY_ARTICLES_ID, articleIds);
return articleIds;
} catch (error) {
@@ -31,6 +40,22 @@ export const actions = {
commit(types.SET_UI_FLAG, { isCreating: false });
}
},
show: async ({ commit }, { id, portalSlug }) => {
commit(types.SET_UI_FLAG, { isFetching: true });
try {
const response = await portalAPI.getArticle({ id, portalSlug });
const {
data: { payload },
} = response;
const { id: articleId } = payload;
commit(types.ADD_ARTICLE, payload);
commit(types.ADD_ARTICLE_ID, articleId);
commit(types.SET_UI_FLAG, { isFetching: false });
} catch (error) {
commit(types.SET_UI_FLAG, { isFetching: false });
}
},
update: async ({ commit }, params) => {
const articleId = params.id;
commit(types.ADD_ARTICLE_FLAG, {

9
app/javascript/dashboard/store/modules/helpCenterArticles/getters.js
View File

@@ -1,16 +1,14 @@
export const getters = {
uiFlagsIn: state => helpCenterId => {
uiFlags: state => helpCenterId => {
const uiFlags = state.articles.uiFlags.byId[helpCenterId];
if (uiFlags) return uiFlags;
return { isFetching: false, isUpdating: false, isDeleting: false };
},
isFetchingHelpCenterArticles: state => state.uiFlags.isFetching,
isFetching: state => state.uiFlags.isFetching,
articleById: (...getterArguments) => articleId => {
const [state] = getterArguments;
const article = state.articles.byId[articleId];
if (!article) return undefined;
return article;
},
allArticles: (...getterArguments) => {
@@ -20,4 +18,7 @@ export const getters = {
});
return articles;
},
getMeta: state => {
return state.meta;
},
};

4
app/javascript/dashboard/store/modules/helpCenterArticles/index.js
View File

@@ -8,6 +8,10 @@ export const defaultHelpCenterFlags = {
isDeleting: false,
};
const state = {
meta: {
count: 0,
currentPage: 1,
},
articles: {
byId: {},
allIds: [],

15
app/javascript/dashboard/store/modules/helpCenterArticles/mutations.js
View File

@@ -16,19 +16,28 @@ export const mutations = {
...article,
});
},
[types.CLEAR_ARTICLES]: $state => {
Vue.set($state.articles, 'byId', {});
Vue.set($state.articles, 'allIds', []);
Vue.set($state.articles, 'uiFlags', {});
},
[types.ADD_MANY_ARTICLES]($state, articles) {
const allArticles = { ...$state.articles.byId };
articles.forEach(article => {
allArticles[article.id] = article;
});
Vue.set($state.articles, 'byId', {
allArticles,
});
Vue.set($state.articles, 'byId', allArticles);
},
[types.ADD_MANY_ARTICLES_ID]($state, articleIds) {
$state.articles.allIds.push(...articleIds);
},
[types.SET_ARTICLES_META]: ($state, data) => {
const { articles_count: count, current_page: currentPage } = data;
Vue.set($state.meta, 'count', count);
Vue.set($state.meta, 'currentPage', currentPage);
},
[types.ADD_ARTICLE_ID]: ($state, articleId) => {
$state.articles.allIds.push(articleId);
},

27
app/javascript/dashboard/store/modules/helpCenterArticles/specs/action.spec.js
View File

@@ -15,10 +15,22 @@ jest.mock('axios');
describe('#actions', () => {
describe('#index', () => {
it('sends correct actions if API is success', async () => {
axios.get.mockResolvedValue({ data: articleList });
await actions.index({ commit });
axios.get.mockResolvedValue({
data: {
payload: articleList,
meta: {
current_page: '1',
articles_count: 5,
},
},
});
await actions.index(
{ commit },
{ pageNumber: 1, portalSlug: 'test', locale: 'en' }
);
expect(commit.mock.calls).toEqual([
[types.default.SET_UI_FLAG, { isFetching: true }],
[types.default.CLEAR_ARTICLES],
[
types.default.ADD_MANY_ARTICLES,
[
@@ -29,13 +41,22 @@ describe('#actions', () => {
},
],
],
[
types.default.SET_ARTICLES_META,
{ current_page: '1', articles_count: 5 },
],
[types.default.ADD_MANY_ARTICLES_ID, [1]],
[types.default.SET_UI_FLAG, { isFetching: false }],
]);
});
it('sends correct actions if API is error', async () => {
axios.get.mockRejectedValue({ message: 'Incorrect header' });
await expect(actions.index({ commit })).rejects.toThrow(Error);
await expect(
actions.index(
{ commit },
{ pageNumber: 1, portalSlug: 'test', locale: 'en' }
)
).rejects.toThrow(Error);
expect(commit.mock.calls).toEqual([
[types.default.SET_UI_FLAG, { isFetching: true }],
[types.default.SET_UI_FLAG, { isFetching: false }],

4
app/javascript/dashboard/store/modules/helpCenterArticles/specs/fixtures.js
View File

@@ -1,4 +1,8 @@
export default {
meta: {
count: 123,
currentPage: 2,
},
articles: {
byId: {
1: {

8
app/javascript/dashboard/store/modules/helpCenterArticles/specs/getters.spec.js
View File

@@ -5,8 +5,8 @@ describe('#getters', () => {
beforeEach(() => {
state = articles;
});
it('uiFlagsIn', () => {
expect(getters.uiFlagsIn(state)(1)).toEqual({
it('uiFlags', () => {
expect(getters.uiFlags(state)(1)).toEqual({
isFetching: false,
isUpdating: true,
isDeleting: false,
@@ -34,7 +34,7 @@ describe('#getters', () => {
});
});
it('isFetchingHelpCenters', () => {
expect(getters.isFetchingHelpCenterArticles(state)).toEqual(true);
it('isFetchingArticles', () => {
expect(getters.isFetching(state)).toEqual(true);
});
});

22
app/javascript/dashboard/store/modules/helpCenterArticles/specs/mutation.spec.js
View File

@@ -46,6 +46,19 @@ describe('#mutations', () => {
});
});
describe('#ARTICLES_META', () => {
it('add meta to state', () => {
mutations[types.SET_ARTICLES_META](state, {
articles_count: 3,
current_page: 1,
});
expect(state.meta).toEqual({
count: 3,
currentPage: 1,
});
});
});
describe('#ADD_ARTICLE_ID', () => {
it('add valid article id to state', () => {
mutations[types.ADD_ARTICLE_ID](state, 3);
@@ -87,4 +100,13 @@ describe('#mutations', () => {
expect(state.articles.byId[2]).toEqual(undefined);
});
});
describe('#CLEAR_ARTICLES', () => {
it('clears articles', () => {
mutations[types.CLEAR_ARTICLES](state);
expect(state.articles.allIds).toEqual([]);
expect(state.articles.byId).toEqual({});
expect(state.articles.uiFlags).toEqual({});
});
});
});

2
app/javascript/dashboard/store/mutation-types.js
View File

@@ -226,8 +226,10 @@ export default {
ADD_ARTICLE_ID: 'ADD_ARTICLE_ID',
ADD_MANY_ARTICLES: 'ADD_MANY_ARTICLES',
ADD_MANY_ARTICLES_ID: 'ADD_MANY_ARTICLES_ID',
SET_ARTICLES_META: 'SET_ARTICLES_META',
ADD_ARTICLE_FLAG: 'ADD_ARTICLE_FLAG',
UPDATE_ARTICLE: 'UPDATE_ARTICLE',
CLEAR_ARTICLES: 'CLEAR_ARTICLES',
REMOVE_ARTICLE: 'REMOVE_ARTICLE',
REMOVE_ARTICLE_ID: 'REMOVE_ARTICLE_ID',
SET_UI_FLAG: 'SET_UI_FLAG',