link to album views from home page

src/shared/api.ts

@@ -1,7 +1,12 @@
 import axios, { AxiosRequestConfig, AxiosInstance } from 'axios'
 import { AuthService } from '@/auth/service'
 
-export type AlbumSort = 'alphabeticalByName' | 'newest' | 'recent' | 'frequent' | 'random'
+export type AlbumSort =
+  'a-z' |
+  'recently-added'|
+  'recently-played' |
+  'most-played' |
+  'random'
 
 export interface Album {
   id: string
@@ -123,8 +128,16 @@ export class API {
   }
 
   async getAlbums(sort: AlbumSort, size = 500): Promise<Album[]> {
+    const type = {
+      'a-z': 'alphabeticalByName',
+      'recently-added': 'newest',
+      'recently-played': 'recent',
+      'most-played': 'frequent',
+      random: 'random',
+    }[sort]
+
     const params = {
-      type: sort,
+      type,
       offset: '0',
       size: size,
     }

src/shared/components/Icon.vue

@@ -6,6 +6,7 @@
   import {
     BIcon,
     BIconCardText,
+    BIconChevronCompactRight,
     BIconMusicNoteList,
     BIconStar,
     BIconStarFill,
@@ -28,6 +29,7 @@
     components: {
       BIcon,
       BIconCardText,
+      BIconChevronCompactRight,
       BIconMusicNoteList,
       BIconStar,
       BIconStarFill,

src/shared/router.ts

@@ -41,14 +41,6 @@ export function setupRouter(auth: AuthService) {
       },
       {
         name: 'albums',
-        path: '/albums',
-        redirect: {
-          name: 'albums-params',
-          params: { sort: 'a-z' }
-        }
-      },
-      {
-        name: 'albums-params',
         path: '/albums/:sort',
         component: AlbumLibrary,
         props: true