GH-1551 Return to base directory when clicking "Overview" (Resolve #1551

)
dzikoysk · Oct 31, 2022 · c8cc38d · c8cc38d
1 parent 3322541
commit c8cc38d
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 4 deletions.
diff --git a/reposilite-frontend/src/helpers/qualifier.js b/reposilite-frontend/src/helpers/qualifier.js
@@ -15,7 +15,7 @@
  */
 
 import { watch, reactive } from 'vue'
-import { useRoute } from 'vue-router'
+import { useRoute, useRouter } from 'vue-router'
 import { useSession } from '../store/session'
 
 const qualifier = reactive({
@@ -35,6 +35,11 @@ watch(
 
 export default function useQualifier() {
   const route = useRoute()
+  const router = useRouter()
+
+  const redirectTo = (path) => {
+    router.push(path)
+  }
 
   watch(
     () => route.params.qualifier,
@@ -47,6 +52,7 @@ export default function useQualifier() {
 
   return {
     qualifier,
-    refreshQualifier
+    refreshQualifier,
+    redirectTo
   }
 }
diff --git a/reposilite-frontend/src/pages/IndexPage.vue b/reposilite-frontend/src/pages/IndexPage.vue
@@ -17,6 +17,7 @@
 <script setup>
 import { computed, ref, watchEffect } from 'vue'
 import { useSession } from '../store/session'
+import useQualifier from '../helpers/qualifier'
 import DefaultHeader from '../components/header/DefaultHeader.vue'
 import FileBrowserView from '../components/browser/FileBrowserView.vue'
 import ConsoleView from '../components/console/ConsoleView.vue'
@@ -37,6 +38,7 @@ const listOfTabs = [
 ]
 
 const { isManager } = useSession()
+const { redirectTo } = useQualifier()
 
 const menuTabs = computed(() =>
   listOfTabs
@@ -45,7 +47,16 @@ const menuTabs = computed(() =>
 )
 
 const selectedTab = ref(localStorage.getItem('selectedTab') || 'Overview')
-watchEffect(() => localStorage.setItem('selectedTab', selectedTab.value))
+
+watchEffect(() => {
+  localStorage.setItem('selectedTab', selectedTab.value)
+})
+
+const createTabClick = (newTab) => {
+  if (newTab == 'Overview') {
+    redirectTo('/')
+  }
+}
 
 const selectHomepage = () => 
   selectedTab.value = 'Overview'
@@ -56,7 +67,10 @@ const selectHomepage = () =>
     <DefaultHeader :logoClickCallback="selectHomepage" />
     <div class="bg-gray-100 dark:bg-black overflow-y-visible">
       <div class="container mx-auto <sm:px-0">
-        <Tabs v-model="selectedTab">
+        <Tabs 
+          v-model="selectedTab"
+          @update:modelValue="createTabClick"
+        >
           <Tab
             v-for="(tab, i) in menuTabs"
             class="item font-normal"