diff --git a/src/renderer/features/songs/components/navidrome-song-filters.tsx b/src/renderer/features/songs/components/navidrome-song-filters.tsx index 529a9d3b0..98a5ca2df 100644 --- a/src/renderer/features/songs/components/navidrome-song-filters.tsx +++ b/src/renderer/features/songs/components/navidrome-song-filters.tsx @@ -2,10 +2,7 @@ import { useSuspenseQuery } from '@tanstack/react-query'; import { useMemo } from 'react'; import { useTranslation } from 'react-i18next'; -import { - MultiSelectWithInvalidData, - SelectWithInvalidData, -} from '/@/renderer/components/select-with-invalid-data'; +import { MultiSelectWithInvalidData } from '/@/renderer/components/select-with-invalid-data'; import { useListContext } from '/@/renderer/context/list-context'; import { useGenreList } from '/@/renderer/features/genres/api/genres-api'; import { sharedQueries } from '/@/renderer/features/shared/api/shared-api'; @@ -114,10 +111,10 @@ export const NavidromeSongFilters = () => { interface TagFilterItemProps { label: string; - onChange: (value: null | string) => void; + onChange: (value: null | string[]) => void; options: Array<{ id: string; name: string }>; tagValue: string; - value: string | undefined; + value: string | string[] | undefined; } const TagFilterItem = ({ label, onChange, options, tagValue, value }: TagFilterItemProps) => { @@ -130,15 +127,20 @@ const TagFilterItem = ({ label, onChange, options, tagValue, value }: TagFilterI [options], ); + const defaultValue = useMemo(() => { + if (!value) return []; + return Array.isArray(value) ? value : [value]; + }, [value]); + return ( - (e && e.length > 0 ? onChange(e) : onChange(null))} searchable /> ); @@ -159,7 +161,7 @@ const TagFilters = () => { ); const handleTagFilter = useMemo( - () => (tag: string, e: null | string) => { + () => (tag: string, e: null | string[]) => { setCustom({ [tag]: e }); }, [setCustom], @@ -191,7 +193,7 @@ const TagFilters = () => { onChange={(e) => handleTagFilter(tag.value, e)} options={tag.options} tagValue={tag.value} - value={query._custom?.[tag.value] as string | undefined} + value={query._custom?.[tag.value] as string | string[] | undefined} /> ))}