mirror of
https://github.com/Dvorinka/swingmusic-extended.git
synced 2026-06-04 20:43:04 +00:00
move the Routes enum to router/routes.ts
+ fix context menu not being normalized + fix nav bar padding-right on no sidebar
This commit is contained in:
committed by
Mungai Njoroge
parent
cb51107ffd
commit
7f344b51db
+140
-116
@@ -5,131 +5,155 @@ import usePlaylistPageStore from "@/stores/pages/playlist";
|
||||
import usePlaylistListPageStore from "@/stores/pages/playlists";
|
||||
import useArtistPageStore from "@/stores/pages/artist";
|
||||
|
||||
const routes = [
|
||||
{
|
||||
path: "/",
|
||||
name: "Home",
|
||||
redirect: "/folder/$home",
|
||||
},
|
||||
{
|
||||
path: "/folder/:path",
|
||||
name: "FolderView",
|
||||
component: () => import("@/views/FolderView.vue"),
|
||||
beforeEnter: async (to: any) => {
|
||||
state.loading.value = true;
|
||||
await useFolderPageStore()
|
||||
.fetchAll(to.params.path)
|
||||
.then(() => {
|
||||
state.loading.value = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/playlists",
|
||||
name: "PlaylistList",
|
||||
component: () => import("@/views/PlaylistList.vue"),
|
||||
beforeEnter: async () => {
|
||||
state.loading.value = true;
|
||||
await usePlaylistListPageStore()
|
||||
.fetchAll()
|
||||
.then(() => {
|
||||
state.loading.value = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/playlist/:pid",
|
||||
name: "PlaylistView",
|
||||
component: () => import("@/views/PlaylistView/index.vue"),
|
||||
beforeEnter: async (to: any) => {
|
||||
state.loading.value = true;
|
||||
await usePlaylistPageStore()
|
||||
.fetchAll(to.params.pid)
|
||||
.then(() => {
|
||||
state.loading.value = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/albums",
|
||||
name: "AlbumsView",
|
||||
component: () => import("@/views/AlbumsExplorer.vue"),
|
||||
},
|
||||
{
|
||||
path: "/albums/:hash",
|
||||
name: "AlbumView",
|
||||
component: () => import("@/views/AlbumView/index.vue"),
|
||||
beforeEnter: async (to: any) => {
|
||||
state.loading.value = true;
|
||||
const store = useAlbumPageStore();
|
||||
const home = {
|
||||
path: "/",
|
||||
name: "Home",
|
||||
redirect: "/folder/$home",
|
||||
};
|
||||
|
||||
await store.fetchTracksAndArtists(to.params.hash).then(() => {
|
||||
const folder = {
|
||||
path: "/folder/:path",
|
||||
name: "FolderView",
|
||||
component: () => import("@/views/FolderView.vue"),
|
||||
beforeEnter: async (to: any) => {
|
||||
state.loading.value = true;
|
||||
await useFolderPageStore()
|
||||
.fetchAll(to.params.path)
|
||||
.then(() => {
|
||||
state.loading.value = false;
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/artists",
|
||||
name: "ArtistsView",
|
||||
component: () => import("@/views/ArtistsExplorer.vue"),
|
||||
},
|
||||
{
|
||||
path: "/artists/:hash",
|
||||
name: "ArtistView",
|
||||
component: () => import("@/views/ArtistView"),
|
||||
beforeEnter: async (to: any) => {
|
||||
state.loading.value = true;
|
||||
};
|
||||
|
||||
await useArtistPageStore()
|
||||
.getData(to.params.hash)
|
||||
.then(() => {
|
||||
state.loading.value = false;
|
||||
});
|
||||
},
|
||||
const playlists = {
|
||||
path: "/playlists",
|
||||
name: "PlaylistList",
|
||||
component: () => import("@/views/PlaylistList.vue"),
|
||||
beforeEnter: async () => {
|
||||
state.loading.value = true;
|
||||
await usePlaylistListPageStore()
|
||||
.fetchAll()
|
||||
.then(() => {
|
||||
state.loading.value = false;
|
||||
});
|
||||
},
|
||||
{
|
||||
path: "/settings",
|
||||
name: "SettingsView",
|
||||
component: () => import("@/views/SettingsView.vue"),
|
||||
};
|
||||
|
||||
const playlistView = {
|
||||
path: "/playlist/:pid",
|
||||
name: "PlaylistView",
|
||||
component: () => import("@/views/PlaylistView/index.vue"),
|
||||
beforeEnter: async (to: any) => {
|
||||
state.loading.value = true;
|
||||
await usePlaylistPageStore()
|
||||
.fetchAll(to.params.pid)
|
||||
.then(() => {
|
||||
state.loading.value = false;
|
||||
});
|
||||
},
|
||||
{
|
||||
path: "/search/:page",
|
||||
name: "SearchView",
|
||||
component: () => import("@/views/SearchView"),
|
||||
};
|
||||
|
||||
const albums = {
|
||||
path: "/albums",
|
||||
name: "AlbumsView",
|
||||
component: () => import("@/views/AlbumsExplorer.vue"),
|
||||
};
|
||||
|
||||
const albumView = {
|
||||
path: "/albums/:hash",
|
||||
name: "AlbumView",
|
||||
component: () => import("@/views/AlbumView/index.vue"),
|
||||
beforeEnter: async (to: any) => {
|
||||
state.loading.value = true;
|
||||
const store = useAlbumPageStore();
|
||||
|
||||
await store.fetchTracksAndArtists(to.params.hash).then(() => {
|
||||
state.loading.value = false;
|
||||
});
|
||||
},
|
||||
{
|
||||
path: "/queue",
|
||||
name: "QueueView",
|
||||
component: () => import("@/views/QueueView.vue"),
|
||||
},
|
||||
{
|
||||
name: "NotFound",
|
||||
path: "/:pathMatch(.*)",
|
||||
component: () => import("@/views/NotFound.vue"),
|
||||
};
|
||||
|
||||
const artists = {
|
||||
path: "/artists",
|
||||
name: "ArtistsView",
|
||||
component: () => import("@/views/ArtistsExplorer.vue"),
|
||||
};
|
||||
|
||||
const artistView = {
|
||||
path: "/artists/:hash",
|
||||
name: "ArtistView",
|
||||
component: () => import("@/views/ArtistView"),
|
||||
beforeEnter: async (to: any) => {
|
||||
state.loading.value = true;
|
||||
|
||||
await useArtistPageStore()
|
||||
.getData(to.params.hash)
|
||||
.then(() => {
|
||||
state.loading.value = false;
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
const artistDiscography = {
|
||||
path: "/artists/:hash/discography",
|
||||
name: "ArtistDiscographyView",
|
||||
component: () => import("@/views/AlbumsGrid.vue"),
|
||||
};
|
||||
|
||||
const settings = {
|
||||
path: "/settings",
|
||||
name: "SettingsView",
|
||||
component: () => import("@/views/SettingsView.vue"),
|
||||
};
|
||||
|
||||
const search = {
|
||||
path: "/search/:page",
|
||||
name: "SearchView",
|
||||
component: () => import("@/views/SearchView"),
|
||||
};
|
||||
|
||||
const queue = {
|
||||
path: "/queue",
|
||||
name: "QueueView",
|
||||
component: () => import("@/views/QueueView.vue"),
|
||||
};
|
||||
|
||||
const notFound = {
|
||||
name: "NotFound",
|
||||
path: "/:pathMatch(.*)",
|
||||
component: () => import("@/views/NotFound.vue"),
|
||||
};
|
||||
|
||||
const routes = [
|
||||
home,
|
||||
folder,
|
||||
playlists,
|
||||
playlistView,
|
||||
albums,
|
||||
albumView,
|
||||
artists,
|
||||
artistView,
|
||||
artistDiscography,
|
||||
settings,
|
||||
search,
|
||||
queue,
|
||||
notFound,
|
||||
];
|
||||
|
||||
const keys = [
|
||||
"home",
|
||||
"folder",
|
||||
"playlists",
|
||||
"playlist",
|
||||
"albums",
|
||||
"album",
|
||||
"artists",
|
||||
"settings",
|
||||
"search",
|
||||
"queue",
|
||||
"notfound",
|
||||
];
|
||||
const Routes = {
|
||||
home: home.name,
|
||||
folder: folder.name,
|
||||
playlists: playlists.name,
|
||||
playlist: playlistView.name,
|
||||
albums: albums.name,
|
||||
album: albumView.name,
|
||||
artists: artists.name,
|
||||
artist: artistView.name,
|
||||
artistDiscography: artistDiscography.name,
|
||||
settings: settings.name,
|
||||
search: search.name,
|
||||
queue: queue.name,
|
||||
notFound: notFound.name,
|
||||
};
|
||||
|
||||
const routesList = routes.map((route, index) => {
|
||||
const key = keys[index];
|
||||
return { route: route.name };
|
||||
});
|
||||
|
||||
// TODO: Use dynamic keys in routesList
|
||||
// Try adding an index.ts on Foldered views, import main component and export it ...
|
||||
// Then try importing it here as @/views/ThatView
|
||||
|
||||
export { routes, routesList };
|
||||
export { routes, Routes };
|
||||
|
||||
Reference in New Issue
Block a user