From 45aef104fe5234fd48235e1d56ad951fc28dd8ff Mon Sep 17 00:00:00 2001 From: jeffvli Date: Thu, 12 Jan 2023 12:45:44 -0800 Subject: [PATCH] Update album artist base route --- src/renderer/components/card/card-rows.tsx | 6 +-- .../virtual-table/cells/album-artist-cell.tsx | 2 +- .../cells/combined-title-cell.tsx | 2 +- .../components/album-detail-content.tsx | 3 +- .../albums/components/album-detail-header.tsx | 2 +- .../components/album-artist-list-content.tsx | 4 +- .../features/home/routes/home-route.tsx | 5 ++- src/renderer/router/routes.ts | 44 ++----------------- 8 files changed, 17 insertions(+), 51 deletions(-) diff --git a/src/renderer/components/card/card-rows.tsx b/src/renderer/components/card/card-rows.tsx index 0020ac09..1bebe1c2 100644 --- a/src/renderer/components/card/card-rows.tsx +++ b/src/renderer/components/card/card-rows.tsx @@ -134,7 +134,7 @@ export const ALBUM_CARD_ROWS: { [key: string]: CardRow } = { arrayProperty: 'name', property: 'albumArtists', route: { - route: AppRoute.LIBRARY_ALBUMARTISTS_DETAIL, + route: AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, slugs: [{ idProperty: 'id', slugProperty: 'albumArtistId' }], }, }, @@ -142,7 +142,7 @@ export const ALBUM_CARD_ROWS: { [key: string]: CardRow } = { arrayProperty: 'name', property: 'artists', route: { - route: AppRoute.LIBRARY_ALBUMARTISTS_DETAIL, + route: AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, slugs: [{ idProperty: 'id', slugProperty: 'albumArtistId' }], }, }, @@ -195,7 +195,7 @@ export const ALBUMARTIST_CARD_ROWS: { [key: string]: CardRow } = { name: { property: 'name', route: { - route: AppRoute.LIBRARY_ALBUMARTISTS_DETAIL, + route: AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, slugs: [{ idProperty: 'id', slugProperty: 'albumArtistId' }], }, }, diff --git a/src/renderer/components/virtual-table/cells/album-artist-cell.tsx b/src/renderer/components/virtual-table/cells/album-artist-cell.tsx index 5ba3a8fa..512afbf4 100644 --- a/src/renderer/components/virtual-table/cells/album-artist-cell.tsx +++ b/src/renderer/components/virtual-table/cells/album-artist-cell.tsx @@ -44,7 +44,7 @@ export const AlbumArtistCell = ({ value, data }: ICellRendererParams) => { component={Link} overflow="hidden" size="sm" - to={generatePath(AppRoute.LIBRARY_ALBUMARTISTS_DETAIL, { + to={generatePath(AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, { albumArtistId: item.id, })} > diff --git a/src/renderer/components/virtual-table/cells/combined-title-cell.tsx b/src/renderer/components/virtual-table/cells/combined-title-cell.tsx index 9bacb3ac..dae4ce09 100644 --- a/src/renderer/components/virtual-table/cells/combined-title-cell.tsx +++ b/src/renderer/components/virtual-table/cells/combined-title-cell.tsx @@ -125,7 +125,7 @@ export const CombinedTitleCell = ({ value, rowIndex, node }: ICellRendererParams overflow="hidden" size="sm" sx={{ width: 'fit-content' }} - to={generatePath(AppRoute.LIBRARY_ALBUMARTISTS_DETAIL, { + to={generatePath(AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, { albumArtistId: artist.id, })} > diff --git a/src/renderer/features/albums/components/album-detail-content.tsx b/src/renderer/features/albums/components/album-detail-content.tsx index bff906ca..00c44123 100644 --- a/src/renderer/features/albums/components/album-detail-content.tsx +++ b/src/renderer/features/albums/components/album-detail-content.tsx @@ -268,13 +268,14 @@ export const AlbumDetailContent = ({ tableRef }: AlbumDetailContentProps) => { arrayProperty: 'name', property: 'albumArtists', route: { - route: AppRoute.LIBRARY_ALBUMARTISTS_DETAIL, + route: AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, slugs: [{ idProperty: 'id', slugProperty: 'albumArtistId' }], }, }, ]} containerWidth={cq.width} data={carousel.data} + itemType={LibraryItem.ALBUM} loading={carousel.loading} pagination={carousel.pagination} uniqueId={carousel.uniqueId} diff --git a/src/renderer/features/albums/components/album-detail-header.tsx b/src/renderer/features/albums/components/album-detail-header.tsx index d4ceb4aa..08f9ed1b 100644 --- a/src/renderer/features/albums/components/album-detail-header.tsx +++ b/src/renderer/features/albums/components/album-detail-header.tsx @@ -80,7 +80,7 @@ export const AlbumDetailHeader = forwardRef( $link component={Link} fw="600" - to={generatePath(AppRoute.LIBRARY_ALBUMARTISTS_DETAIL, { + to={generatePath(AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, { albumArtistId: artist.id, })} > diff --git a/src/renderer/features/artists/components/album-artist-list-content.tsx b/src/renderer/features/artists/components/album-artist-list-content.tsx index 4810d202..eb2a9a5a 100644 --- a/src/renderer/features/artists/components/album-artist-list-content.tsx +++ b/src/renderer/features/artists/components/album-artist-list-content.tsx @@ -254,7 +254,7 @@ export const AlbumArtistListContent = ({ gridRef, tableRef }: AlbumArtistListCon ); const handleRowDoubleClick = (e: RowDoubleClickedEvent) => { - navigate(generatePath(AppRoute.LIBRARY_ALBUMARTISTS_DETAIL, { albumArtistId: e.data.id })); + navigate(generatePath(AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, { albumArtistId: e.data.id })); }; return ( @@ -280,7 +280,7 @@ export const AlbumArtistListContent = ({ gridRef, tableRef }: AlbumArtistListCon loading={checkAlbumArtistList.isLoading} minimumBatchSize={40} route={{ - route: AppRoute.LIBRARY_ALBUMARTISTS_DETAIL, + route: AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, slugs: [{ idProperty: 'id', slugProperty: 'albumArtistId' }], }} setItemData={setItemData} diff --git a/src/renderer/features/home/routes/home-route.tsx b/src/renderer/features/home/routes/home-route.tsx index 0526d881..8afa632e 100644 --- a/src/renderer/features/home/routes/home-route.tsx +++ b/src/renderer/features/home/routes/home-route.tsx @@ -1,7 +1,7 @@ import { useCallback, useMemo, useRef } from 'react'; import { Box, Stack } from '@mantine/core'; import { useSetState } from '@mantine/hooks'; -import { AlbumListSort, ServerType, SortOrder } from '/@/renderer/api/types'; +import { AlbumListSort, LibraryItem, ServerType, SortOrder } from '/@/renderer/api/types'; import { TextTitle, FeatureCarousel, GridCarousel, NativeScrollArea } from '/@/renderer/components'; import { useAlbumList } from '/@/renderer/features/albums'; import { useRecentlyPlayed } from '/@/renderer/features/home/queries/recently-played-query'; @@ -242,13 +242,14 @@ const HomeRoute = () => { arrayProperty: 'name', property: 'albumArtists', route: { - route: AppRoute.LIBRARY_ALBUMARTISTS_DETAIL, + route: AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, slugs: [{ idProperty: 'id', slugProperty: 'albumArtistId' }], }, }, ]} containerWidth={cq.width} data={carousel.data} + itemType={LibraryItem.ALBUM} loading={carousel.loading} pagination={carousel.pagination} uniqueId={carousel.uniqueId} diff --git a/src/renderer/router/routes.ts b/src/renderer/router/routes.ts index 8fddd01e..b19feaba 100644 --- a/src/renderer/router/routes.ts +++ b/src/renderer/router/routes.ts @@ -1,13 +1,13 @@ -// Referenced from: https://betterprogramming.pub/the-best-way-to-manage-routes-in-a-react-project-with-typescript-c4e8d4422d64 - export enum AppRoute { ACTION_REQUIRED = '/action-required', EXPLORE = '/explore', HOME = '/', - LIBRARY_ALBUMARTISTS = '/library/album-artists', - LIBRARY_ALBUMARTISTS_DETAIL = '/library/album-artists/:albumArtistId', LIBRARY_ALBUMS = '/library/albums', LIBRARY_ALBUMS_DETAIL = '/library/albums/:albumId', + LIBRARY_ALBUM_ARTISTS = '/library/album-artists', + LIBRARY_ALBUM_ARTISTS_DETAIL = '/library/album-artists/:albumArtistId', + LIBRARY_ALBUM_ARTISTS_DETAIL_DISCOGRAPHY = '/library/album-artists/:albumArtistId/discography', + LIBRARY_ALBUM_ARTISTS_DETAIL_TOP_SONGS = '/library/album-artists/:albumArtistId/top-songs', LIBRARY_ARTISTS = '/library/artists', LIBRARY_ARTISTS_DETAIL = '/library/artists/:artistId', LIBRARY_FOLDERS = '/library/folders', @@ -20,39 +20,3 @@ export enum AppRoute { SEARCH = '/search', SERVERS = '/servers', } - -type TArgs = - | { path: AppRoute.HOME } - | { path: AppRoute.ACTION_REQUIRED } - | { path: AppRoute.NOW_PLAYING } - | { path: AppRoute.EXPLORE } - | { path: AppRoute.PLAYING } - | { path: AppRoute.SERVERS } - | { path: AppRoute.SEARCH } - | { path: AppRoute.LIBRARY_ARTISTS } - | { path: AppRoute.LIBRARY_ARTISTS_DETAIL } - | { path: AppRoute.LIBRARY_ALBUMARTISTS } - | { - params: { albumArtistId: string }; - path: AppRoute.LIBRARY_ALBUMARTISTS_DETAIL; - } - | { path: AppRoute.LIBRARY_ALBUMS } - | { path: AppRoute.LIBRARY_FOLDERS } - | { path: AppRoute.LIBRARY_SONGS } - | { - params: { albumId: string }; - path: AppRoute.LIBRARY_ALBUMS_DETAIL; - }; - -type TArgsWithParams = Extract; - -export const createPath = (args: TArgs) => { - // eslint-disable-next-line no-prototype-builtins - if (args.hasOwnProperty('params') === false) return args.path; - - // Create a path by replacing params in the route definition - return Object.entries((args as TArgsWithParams).params).reduce( - (previousValue: string, [param, value]) => previousValue.replace(`:${param}`, `${value}`), - args.path, - ); -};