feat: Init HelpCenter Routes (#5034)
This commit is contained in:
Pranav Raj S
GitHub
parent
d7be0ea08e
commit
8dd0d514fd
21 changed files with 276 additions and 0 deletions
|
|
@ -11,6 +11,7 @@
|
|||
@open-notification-panel="openNotificationPanel"
|
||||
/>
|
||||
<secondary-sidebar
|
||||
v-if="showSecondarySidebar"
|
||||
:account-id="accountId"
|
||||
:inboxes="inboxes"
|
||||
:labels="labels"
|
||||
|
|
@ -50,6 +51,12 @@ export default {
|
|||
SecondarySidebar,
|
||||
},
|
||||
mixins: [adminMixin, alertMixin, eventListenerMixins],
|
||||
props: {
|
||||
showSecondarySidebar: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showOptionsMenu: false,
|
||||
|
|
|
|||
|
|
@ -4,9 +4,11 @@ import conversation from './conversation/conversation.routes';
|
|||
import { routes as contactRoutes } from './contacts/routes';
|
||||
import { routes as notificationRoutes } from './notifications/routes';
|
||||
import { frontendURL } from '../../helper/URLHelper';
|
||||
import helpcenterRoutes from './helpcenter/helpcenter.routes';
|
||||
|
||||
export default {
|
||||
routes: [
|
||||
...helpcenterRoutes.routes,
|
||||
{
|
||||
path: frontendURL('accounts/:account_id'),
|
||||
component: AppContainer,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,70 @@
|
|||
<template>
|
||||
<div class="row app-wrapper">
|
||||
<sidebar
|
||||
:route="currentRoute"
|
||||
@open-notification-panel="openNotificationPanel"
|
||||
@open-key-shortcut-modal="toggleKeyShortcutModal"
|
||||
@close-key-shortcut-modal="closeKeyShortcutModal"
|
||||
/>
|
||||
|
||||
<!-- TO BE REPLACED WITH HELPCENTER SIDEBAR -->
|
||||
<div class="margin-right-small">
|
||||
{{ `Place the help center sidebar here. ` }}
|
||||
</div>
|
||||
<!-- END: TO BE REPLACED WITH HELPCENTER SIDEBAR -->
|
||||
|
||||
<section class="app-content columns">
|
||||
<router-view />
|
||||
<command-bar />
|
||||
<woot-key-shortcut-modal
|
||||
v-if="showShortcutModal"
|
||||
@close="closeKeyShortcutModal"
|
||||
@clickaway="closeKeyShortcutModal"
|
||||
/>
|
||||
<notification-panel
|
||||
v-if="showNotificationPanel"
|
||||
@close="closeNotificationPanel"
|
||||
/>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Sidebar from 'dashboard/components/layout/Sidebar';
|
||||
import CommandBar from 'dashboard/routes/dashboard/commands/commandbar.vue';
|
||||
import WootKeyShortcutModal from 'dashboard/components/widgets/modal/WootKeyShortcutModal';
|
||||
import NotificationPanel from 'dashboard/routes/dashboard/notifications/components/NotificationPanel.vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Sidebar,
|
||||
CommandBar,
|
||||
WootKeyShortcutModal,
|
||||
NotificationPanel,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showShortcutModal: false,
|
||||
showNotificationPanel: false,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
currentRoute() {
|
||||
return ' ';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
toggleKeyShortcutModal() {
|
||||
this.showShortcutModal = true;
|
||||
},
|
||||
closeKeyShortcutModal() {
|
||||
this.showShortcutModal = false;
|
||||
},
|
||||
openNotificationPanel() {
|
||||
this.showNotificationPanel = true;
|
||||
},
|
||||
closeNotificationPanel() {
|
||||
this.showNotificationPanel = false;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
@ -0,0 +1,134 @@
|
|||
import HelpCenterLayout from './components/HelpCenterLayout';
|
||||
import { getPortalRoute } from './helpers/routeHelper';
|
||||
|
||||
const ListAllPortals = () => import('./pages/portals/ListAllPortals');
|
||||
const NewPortal = () => import('./pages/portals/NewPortal');
|
||||
const EditPortal = () => import('./pages/portals/EditPortal');
|
||||
const ShowPortal = () => import('./pages/portals/ShowPortal');
|
||||
|
||||
const ListAllCategories = () => import('./pages/categories/ListAllCategories');
|
||||
const NewCategory = () => import('./pages/categories/NewCategory');
|
||||
const EditCategory = () => import('./pages/categories/EditCategory');
|
||||
const ShowCategory = () => import('./pages/categories/ShowCategory');
|
||||
const ListCategoryArticles = () =>
|
||||
import('./pages/articles/ListCategoryArticles');
|
||||
|
||||
const ListAllArticles = () => import('./pages/articles/ListAllArticles');
|
||||
const ListArchivedArticles = () =>
|
||||
import('./pages/articles/ListArchivedArticles');
|
||||
const ListDraftArticles = () => import('./pages/articles/ListDraftArticles');
|
||||
const ListMyArticles = () => import('./pages/articles/ListMyArticles');
|
||||
const NewArticle = () => import('./pages/articles/NewArticle');
|
||||
const EditArticle = () => import('./pages/articles/EditArticle');
|
||||
|
||||
const portalRoutes = [
|
||||
{
|
||||
path: getPortalRoute(''),
|
||||
name: 'list_all_portals',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: ListAllPortals,
|
||||
},
|
||||
{
|
||||
path: getPortalRoute('new'),
|
||||
name: 'new_portal',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: NewPortal,
|
||||
},
|
||||
{
|
||||
path: getPortalRoute(':portalSlug'),
|
||||
name: 'edit_portal',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: ShowPortal,
|
||||
},
|
||||
{
|
||||
path: getPortalRoute(':portalSlug/edit'),
|
||||
name: 'edit_portal',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: EditPortal,
|
||||
},
|
||||
];
|
||||
|
||||
const articleRoutes = [
|
||||
{
|
||||
path: getPortalRoute(':portalSlug/:locale/articles'),
|
||||
name: 'list_all_locale_articles',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: ListAllArticles,
|
||||
},
|
||||
{
|
||||
path: getPortalRoute(':portalSlug/:locale/articles/archived'),
|
||||
name: 'list_archived_articles',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: ListArchivedArticles,
|
||||
},
|
||||
|
||||
{
|
||||
path: getPortalRoute(':portalSlug/:locale/articles/draft'),
|
||||
name: 'list_draft_articles',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: ListDraftArticles,
|
||||
},
|
||||
{
|
||||
path: getPortalRoute(':portalSlug/:locale/articles/mine'),
|
||||
name: 'list_all_locale_articles',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: ListMyArticles,
|
||||
},
|
||||
{
|
||||
path: getPortalRoute(':portalSlug/:locale/articles/new'),
|
||||
name: 'new_article',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: NewArticle,
|
||||
},
|
||||
{
|
||||
path: getPortalRoute(':portalSlug/:locale/articles/:articleSlug'),
|
||||
name: 'edit_article',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: EditArticle,
|
||||
},
|
||||
];
|
||||
|
||||
const categoryRoutes = [
|
||||
{
|
||||
path: getPortalRoute(':portalSlug/:locale/categories'),
|
||||
name: 'list_all_locale_categories',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: ListAllCategories,
|
||||
},
|
||||
{
|
||||
path: getPortalRoute(':portalSlug/:locale/categories/new'),
|
||||
name: 'new_category_in_locale',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: NewCategory,
|
||||
},
|
||||
{
|
||||
path: getPortalRoute(':portalSlug/:locale/categories/:categorySlug'),
|
||||
name: 'show_category',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: ShowCategory,
|
||||
},
|
||||
{
|
||||
path: getPortalRoute(
|
||||
':portalSlug/:locale/categories/:categorySlug/articles'
|
||||
),
|
||||
name: 'show_category',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: ListCategoryArticles,
|
||||
},
|
||||
{
|
||||
path: getPortalRoute(':portalSlug/:locale/categories/:categorySlug'),
|
||||
name: 'edit_category',
|
||||
roles: ['administrator', 'agent'],
|
||||
component: EditCategory,
|
||||
},
|
||||
];
|
||||
|
||||
export default {
|
||||
routes: [
|
||||
{
|
||||
path: getPortalRoute(),
|
||||
component: HelpCenterLayout,
|
||||
children: [...portalRoutes, ...articleRoutes, ...categoryRoutes],
|
||||
},
|
||||
],
|
||||
};
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
import { frontendURL } from '../../../../helper/URLHelper';
|
||||
|
||||
export const getPortalRoute = (path = '') => {
|
||||
const slugToBeAdded = path ? `/${path}` : '';
|
||||
return frontendURL(`accounts/:accountId/portals${slugToBeAdded}`);
|
||||
};
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import { getPortalRoute } from '../routeHelper';
|
||||
|
||||
describe('', () => {
|
||||
it('returns correct portal URL', () => {
|
||||
expect(getPortalRoute('')).toEqual('/app/accounts/:accountId/portals');
|
||||
expect(getPortalRoute(':portalSlug')).toEqual(
|
||||
'/app/accounts/:accountId/portals/:portalSlug'
|
||||
);
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to edit an article</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to list all articles in a given locale in a portal</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to list archived articles in a portal</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to list articles in a category in a portal</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to list all drafts articles in a portal</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to list my articles in a portal</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component for New Article</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to edit a category</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to list all categories</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to create a category</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to show details of a category</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to edit portal</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to list all portals</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
<template>
|
||||
<div>
|
||||
Component to create a new portal
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<div>Component to view details of portal</div>
|
||||
</template>
|
||||
Loading…
Reference in a new issue