Browse Source

Add is not favorite filter (#357)

master
jeffvli 2 years ago
parent
commit
596c61f065
  1. 15
      src/components/library/AdvancedFilters.tsx
  2. 18
      src/hooks/useAdvancedFilter.ts
  3. 8
      src/redux/viewSlice.ts

15
src/components/library/AdvancedFilters.tsx

@ -176,6 +176,21 @@ const AdvancedFilters = ({ filteredData, originalData, filter, setAdvancedFilter
> >
Is favorite Is favorite
</StyledCheckbox> </StyledCheckbox>
<StyledCheckbox
defaultChecked={filter.properties.notStarred}
checked={filter.properties.notStarred}
onChange={(_v: any, e: boolean) => {
dispatch(
setAdvancedFilters({
listType: Item.Album,
filter: 'notStarred',
value: e,
})
);
}}
>
Is not favorite
</StyledCheckbox>
<Divider /> <Divider />
<FilterHeader> <FilterHeader>
<FlexboxGrid justify="space-between"> <FlexboxGrid justify="space-between">

18
src/hooks/useAdvancedFilter.ts

@ -22,11 +22,19 @@ const useAdvancedFilter = (data: any[], filters: AdvancedFilters) => {
}) })
: data; : data;
const filteredByNotStarred = filterProps.properties.notStarred
? (data || []).filter((entry) => {
return entry.starred === null || entry.starred === undefined;
})
: data;
const starFilter = filterProps.properties.starred ? filteredByStarred : filteredByNotStarred;
// Genre filter // Genre filter
const genreRegex = new RegExp(filterProps.properties?.genre?.list.join('|'), 'i'); const genreRegex = new RegExp(filterProps.properties?.genre?.list.join('|'), 'i');
const filteredByGenres = const filteredByGenres =
filterProps.properties.genre.list.length > 0 filterProps.properties.genre.list.length > 0
? (filteredByStarred || []).filter((entry) => { ? (starFilter || []).filter((entry) => {
const entryGenres = _.map(entry.genre, 'title'); const entryGenres = _.map(entry.genre, 'title');
if (filterProps.properties.genre.type === 'or') { if (filterProps.properties.genre.type === 'or') {
@ -42,7 +50,7 @@ const useAdvancedFilter = (data: any[], filters: AdvancedFilters) => {
return matches.length === filterProps.properties.genre.list.length; return matches.length === filterProps.properties.genre.list.length;
}) })
: filteredByStarred; : starFilter;
const artistRegex = new RegExp(filterProps.properties?.artist?.list.join('|'), 'i'); const artistRegex = new RegExp(filterProps.properties?.artist?.list.join('|'), 'i');
@ -69,7 +77,7 @@ const useAdvancedFilter = (data: any[], filters: AdvancedFilters) => {
// Instead of filtering from the previous (genre), start from the starred filter // Instead of filtering from the previous (genre), start from the starred filter
const filteredByArtistsBase = const filteredByArtistsBase =
filterProps.properties.artist.list.length > 0 filterProps.properties.artist.list.length > 0
? (filteredByStarred || []).filter((entry) => { ? (starFilter || []).filter((entry) => {
const entryArtistIds = _.map(entry.artist, 'id'); const entryArtistIds = _.map(entry.artist, 'id');
if (filterProps.properties.artist.type === 'or') { if (filterProps.properties.artist.type === 'or') {
@ -85,7 +93,7 @@ const useAdvancedFilter = (data: any[], filters: AdvancedFilters) => {
return matches.length === filterProps.properties.artist.list.length; return matches.length === filterProps.properties.artist.list.length;
}) })
: filteredByStarred; : starFilter;
const filteredByYear = !( const filteredByYear = !(
filterProps.properties.year.from === 0 && filterProps.properties.year.to === 0 filterProps.properties.year.from === 0 && filterProps.properties.year.to === 0
@ -110,7 +118,7 @@ const useAdvancedFilter = (data: any[], filters: AdvancedFilters) => {
}) })
: filteredByArtists; : filteredByArtists;
setByStarredData(_.compact(_.uniqBy(filteredByStarred, 'uniqueId'))); setByStarredData(_.compact(_.uniqBy(starFilter, 'uniqueId')));
setByGenreData(_.compact(_.uniqBy(filteredByGenres, 'uniqueId'))); setByGenreData(_.compact(_.uniqBy(filteredByGenres, 'uniqueId')));
setByArtistData(_.compact(_.uniqBy(filteredByArtists, 'uniqueId'))); setByArtistData(_.compact(_.uniqBy(filteredByArtists, 'uniqueId')));
setByArtistBaseData(_.compact(_.uniqBy(filteredByArtistsBase, 'uniqueId'))); setByArtistBaseData(_.compact(_.uniqBy(filteredByArtistsBase, 'uniqueId')));

8
src/redux/viewSlice.ts

@ -10,6 +10,7 @@ export interface AdvancedFilters {
nav: 'filters' | 'sort'; nav: 'filters' | 'sort';
properties: { properties: {
starred: boolean; starred: boolean;
notStarred: boolean;
genre: { genre: {
list: any[]; list: any[];
type: 'and' | 'or'; type: 'and' | 'or';
@ -55,6 +56,7 @@ const initialState: View = {
nav: 'filters', nav: 'filters',
properties: { properties: {
starred: false, starred: false,
notStarred: false,
genre: { genre: {
list: [], list: [],
type: 'and', type: 'and',
@ -109,7 +111,7 @@ const viewSlice = createSlice({
state, state,
action: PayloadAction<{ action: PayloadAction<{
listType: Item; listType: Item;
filter: 'enabled' | 'starred' | 'genre' | 'artist' | 'year' | 'nav'; filter: 'enabled' | 'starred' | 'notStarred' | 'genre' | 'artist' | 'year' | 'nav';
value: any; value: any;
}> }>
) => { ) => {
@ -122,6 +124,10 @@ const viewSlice = createSlice({
state.album.advancedFilters.properties.starred = action.payload.value; state.album.advancedFilters.properties.starred = action.payload.value;
} }
if (action.payload.filter === 'notStarred') {
state.album.advancedFilters.properties.notStarred = action.payload.value;
}
if (action.payload.filter === 'genre') { if (action.payload.filter === 'genre') {
state.album.advancedFilters.properties.genre = action.payload.value; state.album.advancedFilters.properties.genre = action.payload.value;
} }

Loading…
Cancel
Save