From 034a1ce5977d728f58776b44c69116f5e3b43b0a Mon Sep 17 00:00:00 2001 From: Muhsin Keloth Date: Wed, 27 Jul 2022 15:39:52 +0530 Subject: [PATCH] add getAllArticles getter --- .../dashboard/api/helpCenter/portals.js | 7 ++ .../dashboard/i18n/locale/en/helpCenter.json | 80 +++++++++++++++---- .../pages/articles/ListAllArticles.vue | 68 ++++++---------- app/javascript/dashboard/store/actions.js | 0 app/javascript/dashboard/store/index.js | 2 + .../modules/helpCenterArticles/actions.js | 17 ++-- .../modules/helpCenterArticles/getters.js | 8 +- 7 files changed, 111 insertions(+), 71 deletions(-) delete mode 100755 app/javascript/dashboard/store/actions.js diff --git a/app/javascript/dashboard/api/helpCenter/portals.js b/app/javascript/dashboard/api/helpCenter/portals.js index 8b8e8f797..2a15fa7bd 100644 --- a/app/javascript/dashboard/api/helpCenter/portals.js +++ b/app/javascript/dashboard/api/helpCenter/portals.js @@ -1,9 +1,16 @@ +/* global axios */ import ApiClient from '../ApiClient'; class PortalsAPI extends ApiClient { constructor() { super('portals', { accountScoped: true }); } + + getArticles({ pageNumber, portalSlug, locale }) { + return axios.get( + `${this.url}/${portalSlug}/articles?page=${pageNumber}&locale=${locale}` + ); + } } export default new PortalsAPI(); diff --git a/app/javascript/dashboard/i18n/locale/en/helpCenter.json b/app/javascript/dashboard/i18n/locale/en/helpCenter.json index e7bb8c4ee..9fe1ed65c 100644 --- a/app/javascript/dashboard/i18n/locale/en/helpCenter.json +++ b/app/javascript/dashboard/i18n/locale/en/helpCenter.json @@ -4,7 +4,18 @@ "FILTER": "Filter by", "SORT": "Sort by", "SETTINGS_BUTTON": "Settings", - "NEW_BUTTON": "New Article" + "NEW_BUTTON": "New Article", + "DROPDOWN_OPTIONS": { + "PUBLISHED": "Published", + "DRAFT": "Draft", + "ARCHIVED": "Archived" + }, + "TITLES": { + "ALL_ARTICLES": "All Articles", + "MINE": "My Articles", + "DRAFT": "Draft Articles", + "ARCHIVED": "Archived Articles" + } }, "EDIT_HEADER": { "PUBLISH_BUTTON": "Publish", @@ -15,23 +26,58 @@ "SAVING": "Draft saving...", "SAVED": "Draft saved" }, - "PORTAL": { - "ACTIVE_BADGE": "active", - "CHOOSE_LOCALE_LABEL": "Choose a locale", - "ARTICLES_LABEL": "articles", - "ADD_NEW_LOCALE": "Add a new locale", - "POPOVER": { - "TITLE": "Portals", - "NEW_PORTAL_LINK": "New Portal", - "SUBTITLE": "You have multiple portals and can have different locales for each portal.", - "CANCEL_BUTTON_LABEL": "Cancel", - "CHOOSE_LOCALE_BUTTON": "Choose Locale" + "TABLE": { + "LOADING_MESSAGE": "Loading articles...", + "404": "No articles matches your search 🔍", + "NO_ARTICLES": "There are no available articles", + "HEADERS": { + "TITLE": "Title", + "CATEGORY": "Category", + "READ_COUNT": "Read count", + "STATUS": "Status", + "LAST_EDITED": "Last edited" + }, + "COLUMNS": { + "BY": "by" + } + }, + "EDIT_ARTICLE": { + "TITLE_PLACEHOLDER": "Article title goes here", + "CONTENT_PLACEHOLDER": "Write your article here" + }, + "SIDEBAR": { + "SEARCH": { + "PLACEHOLDER": "Search for articles" + } + }, + "CATEGORY": { + "ADD": { + "TITLE": "Create a category", + "SUB_TITLE": "The category will be used in the public facing portal to categorize articles.", + "PORTAL": "Portal", + "LOCALE": "Locale", + "NAME": { + "LABEL": "Name", + "PLACEHOLDER": "Category name", + "HELP_TEXT": "The category name will be used in the public facing portal to categorize articles.", + "ERROR": "Name is required" + }, + "SLUG": { + "LABEL": "Slug", + "PLACEHOLDER": "Category slug for urls", + "HELP_TEXT": "app.chatwoot.com/portal/my-portal/en-US/categories/my-slug", + "ERROR": "Slug is required" + }, + "DESCRIPTION": { + "LABEL": "Description", + "PLACEHOLDER": "Give a short description about the category.", + "ERROR": "Description is required" + }, + "BUTTONS": { + "CREATE": "Create category", + "CANCEL": "Cancel" + } } - } - }, - "TABLE": { - "COLUMNS": { - "BY": "by" } } } diff --git a/app/javascript/dashboard/routes/dashboard/helpcenter/pages/articles/ListAllArticles.vue b/app/javascript/dashboard/routes/dashboard/helpcenter/pages/articles/ListAllArticles.vue index 8cdf907e2..1b0db458e 100644 --- a/app/javascript/dashboard/routes/dashboard/helpcenter/pages/articles/ListAllArticles.vue +++ b/app/javascript/dashboard/routes/dashboard/helpcenter/pages/articles/ListAllArticles.vue @@ -7,21 +7,19 @@ @newArticlePage="newArticlePage" /> - - -
+
{{ $t('HELP_CENTER.TABLE.LOADING_MESSAGE') }}
+
diff --git a/app/javascript/dashboard/store/actions.js b/app/javascript/dashboard/store/actions.js deleted file mode 100755 index e69de29bb..000000000 diff --git a/app/javascript/dashboard/store/index.js b/app/javascript/dashboard/store/index.js index 4957a27cc..c4823ec2b 100755 --- a/app/javascript/dashboard/store/index.js +++ b/app/javascript/dashboard/store/index.js @@ -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, }, }); diff --git a/app/javascript/dashboard/store/modules/helpCenterArticles/actions.js b/app/javascript/dashboard/store/modules/helpCenterArticles/actions.js index d484dd40c..dfcacade5 100644 --- a/app/javascript/dashboard/store/modules/helpCenterArticles/actions.js +++ b/app/javascript/dashboard/store/modules/helpCenterArticles/actions.js @@ -1,13 +1,20 @@ -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 }, + } = await portalAPI.getArticles({ + pageNumber, + portalSlug, + locale, + }); + const articleIds = payload.map(article => article.id); + commit(types.ADD_MANY_ARTICLES, payload); commit(types.ADD_MANY_ARTICLES_ID, articleIds); return articleIds; } catch (error) { diff --git a/app/javascript/dashboard/store/modules/helpCenterArticles/getters.js b/app/javascript/dashboard/store/modules/helpCenterArticles/getters.js index 1cd5d94b0..33e61ceaf 100644 --- a/app/javascript/dashboard/store/modules/helpCenterArticles/getters.js +++ b/app/javascript/dashboard/store/modules/helpCenterArticles/getters.js @@ -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, + isFetchingArticles: state => state.uiFlags.isFetching, articleById: (...getterArguments) => articleId => { const [state] = getterArguments; - const article = state.articles.byId[articleId]; - + const article = state.articles.byId.allArticles[articleId]; if (!article) return undefined; - return article; }, allArticles: (...getterArguments) => {