panel navigator refactoring

public/mix-manifest.json

@@ -8,7 +8,7 @@
     "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~3e4fdd8b.js": "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~3e4fdd8b.js?id=d36b3eb20b4899f2d899",
     "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.js": "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.js?id=c4764a39a8045b039a47",
     "/chunks/admin~chunks/files~chunks/settings~chunks/shared/file-browser.js": "/chunks/admin~chunks/files~chunks/settings~chunks/shared/file-browser.js?id=6632ba96ef28b8ec0c98",
-    "/chunks/admin~chunks/platform.js": "/chunks/admin~chunks/platform.js?id=383e66eea761fbf3ae9c",
+    "/chunks/admin~chunks/platform.js": "/chunks/admin~chunks/platform.js?id=2399d0628b27e1d915c2",
     "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.js": "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.js?id=a80b8af62fd725c60bdb",
     "/chunks/admin~chunks/platform~chunks/shared.js": "/chunks/admin~chunks/platform~chunks/shared.js?id=673ff118200894d37cd5",
     "/chunks/app-appearance.js": "/chunks/app-appearance.js?id=5f8d3e698c1fd5b9b5a5",
@@ -56,7 +56,7 @@
     "/chunks/plan-settings.js": "/chunks/plan-settings.js?id=17469545c5b6a16c3bbf",
     "/chunks/plan-subscribers.js": "/chunks/plan-subscribers.js?id=0dd0a5efe0e3cb511c48",
     "/chunks/plans.js": "/chunks/plans.js?id=5a3c28288952fcad96e5",
-    "/chunks/platform.js": "/chunks/platform.js?id=aac851b167c665d19d7e",
+    "/chunks/platform.js": "/chunks/platform.js?id=516203dc89a47f1d1d17",
     "/chunks/platform~chunks/shared.js": "/chunks/platform~chunks/shared.js?id=3434322e91f37e1887a6",
     "/chunks/profile.js": "/chunks/profile.js?id=658aa03af778cc2cc100",
     "/chunks/profile~chunks/settings-password.js": "/chunks/profile~chunks/settings-password.js?id=ddb7be518c092ed392ca",
@@ -113,7 +113,7 @@
     "/chunks/app-language~chunks/dashboard~chunks/invoices~chunks/pages~chunks/plans~chunks/platform~chunk~4546fed3.js": "/chunks/app-language~chunks/dashboard~chunks/invoices~chunks/pages~chunks/plans~chunks/platform~chunk~4546fed3.js?id=dcb0f3eb29f9bb036a83",
     "/chunks/app-language~chunks/dashboard~chunks/invoices~chunks/pages~chunks/plans~chunks/settings~chunk~4e1df859.js": "/chunks/app-language~chunks/dashboard~chunks/invoices~chunks/pages~chunks/plans~chunks/settings~chunk~4e1df859.js?id=ce01da2eb15ee1ebede4",
     "/chunks/files.61f541e551bb6ae551ff.hot-update.js": "/chunks/files.61f541e551bb6ae551ff.hot-update.js",
-    "/chunks/platform~chunks/shared/file-browser.js": "/chunks/platform~chunks/shared/file-browser.js?id=a86bdb2b38d254a62eab",
+    "/chunks/platform~chunks/shared/file-browser.js": "/chunks/platform~chunks/shared/file-browser.js?id=40ad3638485c345cced0",
     "/chunks/platform~chunks/shared~chunks/shared/file-browser.js": "/chunks/platform~chunks/shared~chunks/shared/file-browser.js?id=6ba92eab6a45cbab3af5",
     "/chunks/platform~chunks/shared~chunks/shared/file-browser~chunks/shared/single-file.js": "/chunks/platform~chunks/shared~chunks/shared/file-browser~chunks/shared/single-file.js?id=c9e60ce6e02af680eeaa",
     "/chunks/settings-subscription~chunks/shared/file-browser~chunks/user-subscription.js": "/chunks/settings-subscription~chunks/shared/file-browser~chunks/user-subscription.js?id=439e216b216fc2572483",
@@ -542,5 +542,21 @@
     "/chunks/admin~chunks/platform.a66331813c64be592be5.hot-update.js": "/chunks/admin~chunks/platform.a66331813c64be592be5.hot-update.js",
     "/chunks/files~chunks/my-shared-items~chunks/recent-uploads~chunks/shared/file-browser~chunks/trash.a66331813c64be592be5.hot-update.js": "/chunks/files~chunks/my-shared-items~chunks/recent-uploads~chunks/shared/file-browser~chunks/trash.a66331813c64be592be5.hot-update.js",
     "/chunks/platform.a66331813c64be592be5.hot-update.js": "/chunks/platform.a66331813c64be592be5.hot-update.js",
-    "/chunks/platform~chunks/shared/file-browser.a66331813c64be592be5.hot-update.js": "/chunks/platform~chunks/shared/file-browser.a66331813c64be592be5.hot-update.js"
+    "/chunks/platform~chunks/shared/file-browser.a66331813c64be592be5.hot-update.js": "/chunks/platform~chunks/shared/file-browser.a66331813c64be592be5.hot-update.js",
+    "/chunks/admin~chunks/platform.d3ef9a4ba93368ae47ec.hot-update.js": "/chunks/admin~chunks/platform.d3ef9a4ba93368ae47ec.hot-update.js",
+    "/chunks/platform.747540e0ebed25c92035.hot-update.js": "/chunks/platform.747540e0ebed25c92035.hot-update.js",
+    "/chunks/platform.2a44d048336870abab76.hot-update.js": "/chunks/platform.2a44d048336870abab76.hot-update.js",
+    "/chunks/platform.f6ebaf3075a18c94cdf0.hot-update.js": "/chunks/platform.f6ebaf3075a18c94cdf0.hot-update.js",
+    "/chunks/platform.f1677dd6d745e3222083.hot-update.js": "/chunks/platform.f1677dd6d745e3222083.hot-update.js",
+    "/chunks/platform~chunks/shared/file-browser.2b867f008d088939c0a0.hot-update.js": "/chunks/platform~chunks/shared/file-browser.2b867f008d088939c0a0.hot-update.js",
+    "/chunks/platform~chunks/shared/file-browser.141c02232946f004cd74.hot-update.js": "/chunks/platform~chunks/shared/file-browser.141c02232946f004cd74.hot-update.js",
+    "/chunks/platform~chunks/shared/file-browser.95c15c560bc58ec33ad0.hot-update.js": "/chunks/platform~chunks/shared/file-browser.95c15c560bc58ec33ad0.hot-update.js",
+    "/chunks/platform~chunks/shared/file-browser.f2390439cb4bd900ebf9.hot-update.js": "/chunks/platform~chunks/shared/file-browser.f2390439cb4bd900ebf9.hot-update.js",
+    "/chunks/platform~chunks/shared/file-browser.3815a7c9cf5288450475.hot-update.js": "/chunks/platform~chunks/shared/file-browser.3815a7c9cf5288450475.hot-update.js",
+    "/chunks/platform~chunks/shared/file-browser.af651aa96fe288b66cfe.hot-update.js": "/chunks/platform~chunks/shared/file-browser.af651aa96fe288b66cfe.hot-update.js",
+    "/chunks/platform~chunks/shared/file-browser.f821c2bdb9891a05e574.hot-update.js": "/chunks/platform~chunks/shared/file-browser.f821c2bdb9891a05e574.hot-update.js",
+    "/chunks/platform~chunks/shared/file-browser.d61eaf1096b58a661b80.hot-update.js": "/chunks/platform~chunks/shared/file-browser.d61eaf1096b58a661b80.hot-update.js",
+    "/chunks/platform~chunks/shared/file-browser.2250f2e6c77d124dfbba.hot-update.js": "/chunks/platform~chunks/shared/file-browser.2250f2e6c77d124dfbba.hot-update.js",
+    "/chunks/platform~chunks/shared/file-browser.a512553f25e9cd9088f4.hot-update.js": "/chunks/platform~chunks/shared/file-browser.a512553f25e9cd9088f4.hot-update.js",
+    "/chunks/platform~chunks/shared/file-browser.8a3660e247a02eaa1d71.hot-update.js": "/chunks/platform~chunks/shared/file-browser.8a3660e247a02eaa1d71.hot-update.js"
 }

resources/js/components/Others/TreeMenuNavigator.vue

@@ -1,17 +1,17 @@
 <template>
     <transition name="folder">
         <div class="folder-item-wrapper">
-
             <div
+				@click="goToFolder"
 				class="folder-item text-theme dark-text-theme"
-				:class="{'is-selected': isSelected , 'is-dragenter': area, 'is-inactive': disabledFolder || disabled && draggedItem.length > 0  }"
+				:class="{'is-selected': isSelected, 'is-dragenter': area, 'is-inactive': disabledFolder || disabled && draggedItem.length > 0  }"
-				:style="indent" @click="getFolder"
+				:style="indent"
 				@dragover.prevent="dragEnter"
 				@dragleave="dragLeave"
 				@drop="dragFinish()"
 			>
                 <chevron-right-icon
-					@click.stop="showTree"
+					@click.stop.prevent="showTree"
 					size="17"
 					class="icon-arrow"
 					:class="{'is-opened': isVisible, 'is-visible': nodes.folders.length !== 0}"
@@ -19,7 +19,6 @@
                 <folder-icon size="17" class="icon text-theme dark-text-theme" />
                 <span class="label">{{ nodes.name }}</span>
             </div>
-
             <TreeMenuNavigator :disabled="disableChildren" :depth="depth + 1" v-if="isVisible" :nodes="item" v-for="item in nodes.folders" :key="item.id" />
         </div>
     </transition>
@@ -34,7 +33,9 @@
 	export default {
 		name: 'TreeMenuNavigator',
 		props: [
-			'nodes', 'depth', 'disabled',
+			'disabled',
+			'nodes',
+			'depth',
 		],
 		components: {
 			TreeMenuNavigator,
@@ -42,8 +43,9 @@
 			FolderIcon,
 		},
 		computed: {
-			...mapGetters(['clipboard']),
+			...mapGetters([
-
+				'clipboard'
+			]),
 			disabledFolder() {
 				let disableFolder = false
 				if (this.draggedItem.length > 0) {
@@ -72,21 +74,24 @@
 
 				let offset = window.innerWidth <= 1024 ? 17 : 22;
 
-				let value = this.depth == 0 ? offset : offset + (this.depth * 20);
+				let value = this.depth === 0 ? offset : offset + (this.depth * 20);
 
 				return {paddingLeft: value + 'px'}
 			},
 		},
 		data() {
 			return {
-				isVisible: false,
-				isSelected: false,
-				area: false,
-				draggedItem: [],
 				disableChildren: false,
+				isSelected: false,
+				isVisible: false,
+				draggedItem: [],
+				area: false,
 			}
 		},
 		methods: {
+			goToFolder() {
+				this.$router.push({name: 'Files', params: {id: this.nodes.id}})
+			},
 			dragFinish() {
 				// Move no selected item
 				if (!this.clipboard.includes(this.draggedItem[0])) {
@@ -109,16 +114,6 @@
 			dragLeave() {
 				this.area = false
 			},
-			getFolder() {
-				events.$emit('show-folder', this.nodes)
-
-				// Go to folder
-				if (this.$isThisLocation('public')) {
-					this.$store.dispatch('browseShared', [{folder: this.nodes, back: false, init: false}])
-				} else {
-					this.$store.dispatch('getFolder', [{folder: this.nodes, back: false, init: false}])
-				}
-			},
 			showTree() {
 				this.isVisible = !this.isVisible
 			}
@@ -140,14 +135,6 @@
 					this.draggedItem = this.clipboard
 				}
 			})
-
-			// Select clicked folder
-			events.$on('show-folder', node => {
-				this.isSelected = false
-
-				if (this.nodes.id == node.id)
-					this.isSelected = true
-			})
 		}
 	}
 </script>

resources/js/components/Sidebar/SidebarNavigation.vue

@@ -74,8 +74,8 @@
         },
         computed: {
             ...mapGetters([
+				'isDarkMode',
 				'user',
-				'isDarkMode'
 			]),
             isUserProfileRoute() {
                 return this.$isThisRoute(this.$route, ['Profile', 'Password', 'Storage', 'Invoice', 'Subscription', 'PaymentMethods'])

resources/js/views/FileView/NavigationPanel.vue

@@ -1,5 +1,5 @@
 <template>
-	<div>
+	<div v-if="user">
 		<!--Empty storage warning-->
 		<ContentGroup v-if="config.storageLimit && storage.used > 95">
 			<UpgradeSidebarBanner/>

resources/js/views/Platform.vue

@@ -1,9 +1,8 @@
 <template>
     <div id="application-wrapper">
 
-        <!--File preview window-->
+        <!--On Top of App Components-->
         <FilePreview />
-
 		<Spotlight />
 
         <!--Popups-->
@@ -38,7 +37,7 @@
 
 		<!--Sidebar-->
 		<ContentSidebar>
-			<NavigationPanel v-if="user" />
+			<NavigationPanel />
 		</ContentSidebar>
 
 		<div @contextmenu.prevent.capture="contextMenu($event, undefined)" id="files-view">
@@ -98,14 +97,6 @@
 			Spotlight,
             DragUI,
         },
-        computed: {
-            ...mapGetters([
-				'currentFolder',
-				'clipboard',
-				'config',
-				'user',
-            ]),
-        },
         data() {
             return {
                 isScaledDown: false