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

feat(v4): Update the help center portal design (#10296)

Browse Source 
Co-authored-by: Pranav <pranavrajs@gmail.com>
This commit is contained in:
Sivin Varghese
2024-10-24 10:39:36 +05:30
committed by GitHub
parent 6d3ecfe3c1
commit a3855a8d1d
144 changed files with 6376 additions and 6604 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,6 +1,7 @@
import articlesAPI from 'dashboard/api/helpCenter/articles';
import { uploadExternalImage, uploadFile } from 'dashboard/helper/uploadHelper';
import { throwErrorMessage } from 'dashboard/store/utils/api';
import camelcaseKeys from 'camelcase-keys';
import types from '../../mutation-types';
export const actions = {
@@ -10,9 +11,7 @@ export const actions = {
) => {
try {
commit(types.SET_UI_FLAG, { isFetching: true });
const {
data: { payload, meta },
} = await articlesAPI.getArticles({
const { data } = await articlesAPI.getArticles({
pageNumber,
portalSlug,
locale,
@@ -20,6 +19,8 @@ export const actions = {
authorId,
categorySlug,
});
const payload = camelcaseKeys(data.payload);
const meta = camelcaseKeys(data.meta);
const articleIds = payload.map(article => article.id);
commit(types.CLEAR_ARTICLES);
commit(types.ADD_MANY_ARTICLES, payload);
@@ -36,12 +37,11 @@ export const actions = {
create: async ({ commit, dispatch }, { portalSlug, ...articleObj }) => {
commit(types.SET_UI_FLAG, { isCreating: true });
try {
const {
data: { payload },
} = await articlesAPI.createArticle({
const { data } = await articlesAPI.createArticle({
portalSlug,
articleObj,
});
const payload = camelcaseKeys(data.payload);
const { id: articleId } = payload;
commit(types.ADD_ARTICLE, payload);
commit(types.ADD_ARTICLE_ID, articleId);
@@ -58,10 +58,8 @@ export const actions = {
show: async ({ commit }, { id, portalSlug }) => {
commit(types.SET_UI_FLAG, { isFetching: true });
try {
const response = await articlesAPI.getArticle({ id, portalSlug });
const {
data: { payload },
} = response;
const { data } = await articlesAPI.getArticle({ id, portalSlug });
const payload = camelcaseKeys(data.payload);
const { id: articleId } = payload;
commit(types.ADD_ARTICLE, payload);
commit(types.ADD_ARTICLE_ID, articleId);
@@ -80,14 +78,12 @@ export const actions = {
});
try {
const {
data: { payload },
} = await articlesAPI.updateArticle({
const { data } = await articlesAPI.updateArticle({
portalSlug,
articleId,
articleObj,
});
const payload = camelcaseKeys(data.payload);
commit(types.UPDATE_ARTICLE, payload);
return articleId;

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

@@ -30,10 +30,8 @@ export const mutations = {
$state.articles.allIds.push(...articleIds);
},
[types.SET_ARTICLES_META]: ($state, data) => {
const { articles_count: count, current_page: currentPage } = data;
$state.meta.count = count;
$state.meta.currentPage = currentPage;
[types.SET_ARTICLES_META]: ($state, meta) => {
$state.meta = meta;
},
[types.ADD_ARTICLE_ID]: ($state, articleId) => {
@@ -41,8 +39,7 @@ export const mutations = {
$state.articles.allIds.push(articleId);
},
[types.UPDATE_ARTICLE_FLAG]: ($state, { articleId, uiFlags }) => {
const flags =
Object.keys($state.articles.uiFlags.byId).includes(articleId) || {};
const flags = $state.articles.uiFlags.byId[articleId] || {};
$state.articles.uiFlags.byId[articleId] = {
...{
@@ -64,11 +61,19 @@ export const mutations = {
...uiFlags,
};
},
[types.UPDATE_ARTICLE]($state, article) {
const articleId = article.id;
if (!$state.articles.allIds.includes(articleId)) return;
[types.UPDATE_ARTICLE]: ($state, updatedArticle) => {
const articleId = updatedArticle.id;
if ($state.articles.byId[articleId]) {
// Preserve the original position
const originalPosition = $state.articles.byId[articleId].position;
$state.articles.byId[articleId] = { ...article };
// Update the article, keeping the original position
// This is not moved out of the original position when we update the article
$state.articles.byId[articleId] = {
...updatedArticle,
position: originalPosition,
};
}
},
[types.REMOVE_ARTICLE]($state, articleId) {
const { [articleId]: toBeRemoved, ...newById } = $state.articles.byId;

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

@@ -12,6 +12,13 @@ const articleList = [
title: 'Documents are required to complete KYC',
},
];
const camelCasedArticle = {
id: 1,
categoryId: 1,
title: 'Documents are required to complete KYC',
};
const commit = vi.fn();
const dispatch = vi.fn();
global.axios = axios;
@@ -41,14 +48,14 @@ describe('#actions', () => {
[
{
id: 1,
category_id: 1,
categoryId: 1,
title: 'Documents are required to complete KYC',
},
],
],
[
types.default.SET_ARTICLES_META,
{ current_page: '1', articles_count: 5 },
{ currentPage: '1', articlesCount: 5 },
],
[types.default.ADD_MANY_ARTICLES_ID, [1]],
[types.default.SET_UI_FLAG, { isFetching: false }],
@@ -71,11 +78,11 @@ describe('#actions', () => {
describe('#create', () => {
it('sends correct actions if API is success', async () => {
axios.post.mockResolvedValue({ data: { payload: articleList[0] } });
await actions.create({ commit, dispatch }, articleList[0]);
axios.post.mockResolvedValue({ data: { payload: camelCasedArticle } });
await actions.create({ commit, dispatch }, camelCasedArticle);
expect(commit.mock.calls).toEqual([
[types.default.SET_UI_FLAG, { isCreating: true }],
[types.default.ADD_ARTICLE, articleList[0]],
[types.default.ADD_ARTICLE, camelCasedArticle],
[types.default.ADD_ARTICLE_ID, 1],
[types.default.ADD_ARTICLE_FLAG, 1],
[types.default.SET_UI_FLAG, { isCreating: false }],
@@ -96,7 +103,7 @@ describe('#actions', () => {
describe('#update', () => {
it('sends correct actions if API is success', async () => {
axios.patch.mockResolvedValue({ data: { payload: articleList[0] } });
axios.patch.mockResolvedValue({ data: { payload: camelCasedArticle } });
await actions.update(
{ commit },
{
@@ -110,7 +117,7 @@ describe('#actions', () => {
types.default.UPDATE_ARTICLE_FLAG,
{ uiFlags: { isUpdating: true }, articleId: 1 },
],
[types.default.UPDATE_ARTICLE, articleList[0]],
[types.default.UPDATE_ARTICLE, camelCasedArticle],
[
types.default.UPDATE_ARTICLE_FLAG,
{ uiFlags: { isUpdating: false }, articleId: 1 },

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

@@ -53,8 +53,8 @@ describe('#mutations', () => {
current_page: 1,
});
expect(state.meta).toEqual({
count: 3,
currentPage: 1,
articles_count: 3,
current_page: 1,
});
});
});
@@ -71,22 +71,36 @@ describe('#mutations', () => {
});
describe('#UPDATE_ARTICLE', () => {
it('does not updates if empty object is passed', () => {
it('does not update if empty object is passed', () => {
mutations[types.UPDATE_ARTICLE](state, {});
expect(state).toEqual(article);
});
it('does not updates if object id is not present ', () => {
it('does not update if object id is not present in the state', () => {
mutations[types.UPDATE_ARTICLE](state, { id: 5 });
expect(state).toEqual(article);
});
it(' updates if object with id already present in the state', () => {
mutations[types.UPDATE_ARTICLE](state, {
it('updates if object with id is already present in the state', () => {
const updatedArticle = {
id: 2,
title: 'How do I change my registered email address',
});
expect(state.articles.byId[2].title).toEqual(
'How do I change my registered email address'
);
title: 'Updated Title',
content: 'Updated Content',
};
mutations[types.UPDATE_ARTICLE](state, updatedArticle);
expect(state.articles.byId[2].title).toEqual('Updated Title');
expect(state.articles.byId[2].content).toEqual('Updated Content');
});
it('preserves the original position when updating an article', () => {
const originalPosition = state.articles.byId[2].position;
const updatedArticle = {
id: 2,
title: 'Updated Title',
content: 'Updated Content',
};
mutations[types.UPDATE_ARTICLE](state, updatedArticle);
expect(state.articles.byId[2].position).toEqual(originalPosition);
});
});