diff --git a/front/src/App.vue b/front/src/App.vue index 3beccfd3f..a534848da 100644 --- a/front/src/App.vue +++ b/front/src/App.vue @@ -11,9 +11,7 @@ import { useStore } from '~/store' import useLogger from '~/composables/useLogger' -import { useRoute } from 'vue-router' - -const route = useRoute() +import { useLocalStorage } from '@vueuse/core' const logger = useLogger() logger.debug('App setup()') @@ -71,10 +69,12 @@ const { width } = useWindowSize() // NOTE: We're not checking if we're authenticated in the store, // because we want to learn if we are authenticated at all store.dispatch('auth/fetchUser') + +const isUIv2 = useLocalStorage('ui-v2', false) diff --git a/front/src/router/index.ts b/front/src/router/index.ts index ce71293fa..8589d6249 100644 --- a/front/src/router/index.ts +++ b/front/src/router/index.ts @@ -1,6 +1,12 @@ +import { useLocalStorage } from '@vueuse/core' import { createRouter, createWebHistory } from 'vue-router' import { forceInstanceChooser } from './guards' -import routes from './routes' + +import routesV1 from './routes' +import routesV2 from '~/ui/routes' + +const isUIv2 = useLocalStorage('ui-v2', false) +const routes = isUIv2.value ? routesV2 : routesV1 const router = createRouter({ history: createWebHistory(import.meta.env.VUE_APP_ROUTER_BASE_URL as string ?? '/'), diff --git a/front/src/router/routes/index.ts b/front/src/router/routes/index.ts index 6bad9918c..d125d99d6 100644 --- a/front/src/router/routes/index.ts +++ b/front/src/router/routes/index.ts @@ -7,11 +7,9 @@ import manage from './manage' import store from '~/store' import auth from './auth' import user from './user' -import ui from './ui' import { requireLoggedIn } from '~/router/guards' export default [ - ...ui, { path: '/', name: 'index', diff --git a/front/src/router/routes/ui.ts b/front/src/router/routes/ui.ts index 9b5c44e02..f4994b901 100644 --- a/front/src/router/routes/ui.ts +++ b/front/src/router/routes/ui.ts @@ -9,18 +9,18 @@ export default [ children: [ { path: 'upload', - name: 'ui.upload', + name: 'upload', component: () => import('~/ui/pages/upload.vue'), children: [ { path: '', - name: 'ui.upload.index', + name: 'upload.index', component: () => import('~/ui/pages/upload/index.vue') }, { path: 'running', - name: 'ui.upload.running', + name: 'upload.running', component: () => import('~/ui/pages/upload/running.vue'), beforeEnter: (_to, _from, next) => { const uploads = useUploadsStore() @@ -34,13 +34,13 @@ export default [ { path: 'history', - name: 'ui.upload.history', + name: 'upload.history', component: () => import('~/ui/pages/upload/history.vue') }, { path: 'all', - name: 'ui.upload.all', + name: 'upload.all', component: () => import('~/ui/pages/upload/all.vue') } ] diff --git a/front/src/ui/components/CoverArt.vue b/front/src/ui/components/CoverArt.vue index 2b425130f..c39529271 100644 --- a/front/src/ui/components/CoverArt.vue +++ b/front/src/ui/components/CoverArt.vue @@ -15,8 +15,14 @@ const coverUrl = computed(() => { diff --git a/front/src/ui/components/Sidebar.vue b/front/src/ui/components/Sidebar.vue index 47f2e725c..8022a02bb 100644 --- a/front/src/ui/components/Sidebar.vue +++ b/front/src/ui/components/Sidebar.vue @@ -1,7 +1,7 @@