vanja/feishin
1
0
Fork 0
mirror of https://github.com/jeffvli/feishin.git synced 2026-06-14 23:44:01 +02:00
Code Issues Packages Projects Releases Wiki Activity

reimplement genre detail route

Browse Source
This commit is contained in:
jeffvli
2025-11-24 20:19:09 -08:00
parent eba485034a
commit d3132ad570
30 changed files with 443 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/features/albums/components/album-list-content.tsx
+18 -6
View File
@@ -1,4 +1,4 @@
import { lazy, Suspense } from 'react';
import { lazy, Suspense, useMemo } from 'react';
import { useAlbumListFilters } from '/@/renderer/features/albums/hooks/use-album-list-filters';
import { ItemListSettings, useCurrentServer, useListSettings } from '/@/renderer/store';
@@ -46,7 +46,7 @@ export const AlbumListContent = () => {
);
};
export type OverrideAlbumListQuery = Omit<AlbumListQuery, 'limit' | 'startIndex'>;
export type OverrideAlbumListQuery = Omit<Partial<AlbumListQuery>, 'limit' | 'startIndex'>;
export const AlbumListView = ({
display,
@@ -60,6 +60,18 @@ export const AlbumListView = ({
const { query } = useAlbumListFilters();
const mergedQuery = useMemo(() => {
if (!overrideQuery) {
return query;
}
return {
...overrideQuery,
sortBy: overrideQuery.sortBy || query.sortBy,
sortOrder: overrideQuery.sortOrder || query.sortOrder,
};
}, [query, overrideQuery]);
switch (display) {
case ListDisplayType.GRID: {
switch (pagination) {
@@ -69,7 +81,7 @@ export const AlbumListView = ({
gap={grid.itemGap}
itemsPerPage={itemsPerPage}
itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined}
query={overrideQuery ?? query}
query={mergedQuery}
serverId={server.id}
/>
);
@@ -80,7 +92,7 @@ export const AlbumListView = ({
gap={grid.itemGap}
itemsPerPage={itemsPerPage}
itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined}
query={overrideQuery ?? query}
query={mergedQuery}
serverId={server.id}
/>
);
@@ -101,7 +113,7 @@ export const AlbumListView = ({
enableRowHoverHighlight={table.enableRowHoverHighlight}
enableVerticalBorders={table.enableVerticalBorders}
itemsPerPage={itemsPerPage}
query={overrideQuery ?? query}
query={mergedQuery}
serverId={server.id}
size={table.size}
/>
@@ -117,7 +129,7 @@ export const AlbumListView = ({
enableRowHoverHighlight={table.enableRowHoverHighlight}
enableVerticalBorders={table.enableVerticalBorders}
itemsPerPage={itemsPerPage}
query={overrideQuery ?? query}
query={mergedQuery}
serverId={server.id}
size={table.size}
/>
src/renderer/features/albums/components/album-list-header-filters.tsx
+33 -1
View File
@@ -1,19 +1,51 @@
import { useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { ALBUM_TABLE_COLUMNS } from '/@/renderer/components/item-list/item-table-list/default-columns';
import { ListConfigMenu } from '/@/renderer/features/shared/components/list-config-menu';
import { ListFilters } from '/@/renderer/features/shared/components/list-filters';
import { ListRefreshButton } from '/@/renderer/features/shared/components/list-refresh-button';
import { ListSortByDropdown } from '/@/renderer/features/shared/components/list-sort-by-dropdown';
import { ListSortOrderToggleButton } from '/@/renderer/features/shared/components/list-sort-order-toggle-button';
import { GenreTarget, useGenreTarget, useSettingsStoreActions } from '/@/renderer/store';
import { Button } from '/@/shared/components/button/button';
import { Divider } from '/@/shared/components/divider/divider';
import { Flex } from '/@/shared/components/flex/flex';
import { Group } from '/@/shared/components/group/group';
import { Icon } from '/@/shared/components/icon/icon';
import { AlbumListSort, LibraryItem, SortOrder } from '/@/shared/types/domain-types';
import { ItemListKey } from '/@/shared/types/types';
export const AlbumListHeaderFilters = () => {
export const AlbumListHeaderFilters = ({ toggleGenreTarget }: { toggleGenreTarget?: boolean }) => {
const { t } = useTranslation();
const target = useGenreTarget();
const { setGenreBehavior } = useSettingsStoreActions();
const choice = useMemo(() => {
return target === GenreTarget.ALBUM
? t('entity.album_other', { postProcess: 'titleCase' })
: t('entity.track_other', { postProcess: 'titleCase' });
}, [target, t]);
const handleToggleGenreTarget = () => {
setGenreBehavior(target === GenreTarget.ALBUM ? GenreTarget.TRACK : GenreTarget.ALBUM);
};
return (
<Flex justify="space-between">
<Group gap="sm" w="100%">
{toggleGenreTarget && (
<>
<Button
leftSection={<Icon icon="arrowLeftRight" />}
onClick={handleToggleGenreTarget}
variant="subtle"
>
{choice}
</Button>
<Divider orientation="vertical" />
</>
)}
<ListSortByDropdown
defaultSortByValue={AlbumListSort.NAME}
itemType={LibraryItem.ALBUM}
src/renderer/features/albums/components/jellyfin-album-filters.tsx
+1 -3
View File
@@ -51,7 +51,6 @@ export const JellyfinAlbumFilters = ({
const genreListQuery = useQuery(
genresQueries.list({
query: {
musicFolderId: query.musicFolderId,
sortBy: GenreListSort.NAME,
sortOrder: SortOrder.ASC,
startIndex: 0,
@@ -75,7 +74,6 @@ export const JellyfinAlbumFilters = ({
staleTime: 1000 * 60 * 1,
},
query: {
folder: query.musicFolderId,
type: LibraryItem.ALBUM,
},
serverId,
@@ -150,7 +148,7 @@ export const JellyfinAlbumFilters = ({
label: artist.name,
value: artist.id,
}));
}, [albumArtistListQuery?.data?.items]);
}, [albumArtistListQuery.data?.items]);
const handleAlbumArtistFilter = (e: null | string[]) => {
setAlbumArtist(e ?? null);
src/renderer/features/albums/components/navidrome-album-filters.tsx
+4 -22
View File
@@ -9,7 +9,7 @@ import {
} from '/@/renderer/components/select-with-invalid-data';
import { useAlbumListFilters } from '/@/renderer/features/albums/hooks/use-album-list-filters';
import { artistsQueries } from '/@/renderer/features/artists/api/artists-api';
import { genresQueries } from '/@/renderer/features/genres/api/genres-api';
import { useGenreList } from '/@/renderer/features/genres/api/genres-api';
import { sharedQueries } from '/@/renderer/features/shared/api/shared-api';
import { useCurrentServer } from '/@/renderer/store';
import { NDSongQueryFields } from '/@/shared/api/navidrome/navidrome-types';
@@ -22,12 +22,7 @@ import { Stack } from '/@/shared/components/stack/stack';
import { Switch } from '/@/shared/components/switch/switch';
import { Text } from '/@/shared/components/text/text';
import { YesNoSelect } from '/@/shared/components/yes-no-select/yes-no-select';
import {
AlbumArtistListSort,
GenreListSort,
LibraryItem,
SortOrder,
} from '/@/shared/types/domain-types';
import { AlbumArtistListSort, LibraryItem, SortOrder } from '/@/shared/types/domain-types';
import { ServerFeature } from '/@/shared/types/features-types';
interface NavidromeAlbumFiltersProps {
@@ -52,20 +47,7 @@ export const NavidromeAlbumFilters = ({ disableArtistFilter }: NavidromeAlbumFil
setRecentlyPlayed,
} = useAlbumListFilters();
const genreListQuery = useQuery(
genresQueries.list({
options: {
gcTime: 1000 * 60 * 2,
staleTime: 1000 * 60 * 1,
},
query: {
sortBy: GenreListSort.NAME,
sortOrder: SortOrder.ASC,
startIndex: 0,
},
serverId,
}),
);
const genreListQuery = useGenreList();
const genreList = useMemo(() => {
if (!genreListQuery?.data) return [];
@@ -152,7 +134,7 @@ export const NavidromeAlbumFilters = ({ disableArtistFilter }: NavidromeAlbumFil
label: artist.name,
value: artist.id,
}));
}, [albumArtistListQuery?.data?.items]);
}, [albumArtistListQuery.data?.items]);
const handleTagFilter = debounce((tag: string, e: null | string) => {
setCustom((prev) => ({
src/renderer/features/albums/components/subsonic-album-filters.tsx
+1 -1
View File
@@ -105,7 +105,7 @@ export const SubsonicAlbumFilters = ({
const handleGenresFilter = debounce((e: null | string) => {
setGenreId(e ?? null);
const updatedFilters: Partial<AlbumListFilter> = {
genres: e ? [e] : undefined,
genreIds: e ? [e] : undefined,
};
onFilterChange(updatedFilters as AlbumListFilter);
}, 250);