Load sidebar and navigation via router

Signed-off-by: dartcafe <github@dartcafe.de>

4 files changed, 22 insertions, 11 deletions

diff --git a/src/js/App.vue b/src/js/App.vue
index ed501bcf..fd1edf51 100644
--- a/src/js/App.vue
+++ b/src/js/App.vue
@@ -22,13 +22,16 @@
 
 <template>
 	<Content app-name="polls" :style="appStyle" :class="[transitionClass, { 'edit': acl.allowEdit, 'experimental': settings.experimental, 'bgimage': settings.useImage, 'bgcolored': settings.experimental }]">
-		<SettingsDlg />
-		<Navigation v-if="getCurrentUser()" :class="{ 'glassy': settings.glassyNavigation }" />
+		<router-view v-if="getCurrentUser()"
+			name="navigation"
+			:class="{ 'glassy': settings.glassyNavigation }" />
 		<router-view />
-		<SideBar v-if="sideBarOpen && $store.state.poll.id && (acl.allowEdit || poll.allowComment)"
+		<router-view v-if="sideBarOpen && $store.state.poll.id && (acl.allowEdit || poll.allowComment)"
+			name="sidebar"
 			:active="activeTab"
 			:class="{ 'glassy': settings.glassySidebar }" />
 		<LoadingOverlay v-if="loading" />
+		<SettingsDlg />
 	</Content>
 </template>
 
@@ -55,9 +58,9 @@ export default {
 	components: {
 		Content,
 		LoadingOverlay: () => import('./components/Base/LoadingOverlay'),
-		Navigation: () => import('./components/Navigation/Navigation'),
+		// Navigation: () => import('./components/Navigation/Navigation'),
 		SettingsDlg,
-		SideBar: () => import('./components/SideBar/SideBar'),
+		// SideBar: () => import('./components/SideBar/SideBar'),
 	},
 
 	mixins: [watchPolls],
diff --git a/src/js/router.js b/src/js/router.js
index d39aaca4..c4b3fff7 100644
--- a/src/js/router.js
+++ b/src/js/router.js
@@ -31,6 +31,8 @@ const List = () => import('./views/PollList')
 const Administration = () => import('./views/Administration')
 const Vote = () => import('./views/Vote')
 const NotFound = () => import('./views/NotFound')
+const SideBar = () => import('./views/SideBar')
+const Navigation = () => import('./views/Navigation')
 
 Vue.use(Router)
 
@@ -52,6 +54,7 @@ export default new Router({
 			path: '/list/:type?',
 			components: {
 				default: List,
+				navigation: Navigation,
 			},
 			props: true,
 			name: 'list',
@@ -60,6 +63,7 @@ export default new Router({
 			path: '/administration',
 			components: {
 				default: Administration,
+				navigation: Navigation,
 			},
 			name: 'administration',
 		},
@@ -67,6 +71,7 @@ export default new Router({
 			path: '/not-found',
 			components: {
 				default: NotFound,
+				navigation: Navigation,
 			},
 			name: 'notfound',
 		},
@@ -74,6 +79,8 @@ export default new Router({
 			path: '/vote/:id',
 			components: {
 				default: Vote,
+				navigation: Navigation,
+				sidebar: SideBar,
 			},
 			props: true,
 			name: 'vote',
@@ -86,6 +93,7 @@ export default new Router({
 			path: '/s/:token',
 			components: {
 				default: Vote,
+				sidebar: SideBar,
 			},
 			props: true,
 			name: 'publicVote',
diff --git a/src/js/components/Navigation/Navigation.vue b/src/js/views/Navigation.vue
index 680b9bc8..bd8603bc 100644
--- a/src/js/components/Navigation/Navigation.vue
+++ b/src/js/views/Navigation.vue
@@ -59,8 +59,8 @@ import { AppNavigation, AppNavigationNew, AppNavigationItem } from '@nextcloud/v
 import { mapGetters, mapState } from 'vuex'
 import { showError } from '@nextcloud/dialogs'
 import { getCurrentUser } from '@nextcloud/auth'
-import CreateDlg from '../Create/CreateDlg'
-import PollNavigationItems from './PollNavigationItems'
+import CreateDlg from '../components/Create/CreateDlg'
+import PollNavigationItems from '../components/Navigation/PollNavigationItems'
 import { emit } from '@nextcloud/event-bus'
 
 export default {
diff --git a/src/js/components/SideBar/SideBar.vue b/src/js/views/SideBar.vue
index 49d71747..81b0e528 100644
--- a/src/js/components/SideBar/SideBar.vue
+++ b/src/js/views/SideBar.vue
@@ -68,10 +68,10 @@ export default {
 	name: 'SideBar',
 
 	components: {
-		SideBarTabConfiguration: () => import('./SideBarTabConfiguration'),
-		SideBarTabComments: () => import('./SideBarTabComments'),
-		SideBarTabOptions: () => import('./SideBarTabOptions'),
-		SideBarTabShare: () => import('./SideBarTabShare'),
+		SideBarTabConfiguration: () => import('../components/SideBar/SideBarTabConfiguration'),
+		SideBarTabComments: () => import('../components/SideBar/SideBarTabComments'),
+		SideBarTabOptions: () => import('../components/SideBar/SideBarTabOptions'),
+		SideBarTabShare: () => import('../components/SideBar/SideBarTabShare'),
 		AppSidebar,
 		AppSidebarTab,
 	},