Fix custom filter implementation
This commit is contained in:
parent
5896d886d7
commit
505974320f
3 changed files with 51 additions and 22 deletions
|
@ -105,18 +105,12 @@ export const AlbumListHeaderFilters = ({ gridRef, tableRef }: AlbumListHeaderFil
|
|||
const onFilterChange = useCallback(
|
||||
(filter: AlbumListFilter) => {
|
||||
if (isGrid) {
|
||||
handleRefreshGrid(gridRef, {
|
||||
...filter,
|
||||
...customFilters,
|
||||
});
|
||||
handleRefreshGrid(gridRef, filter);
|
||||
}
|
||||
|
||||
handleRefreshTable(tableRef, {
|
||||
...filter,
|
||||
...customFilters,
|
||||
});
|
||||
handleRefreshTable(tableRef, filter);
|
||||
},
|
||||
[customFilters, gridRef, handleRefreshGrid, handleRefreshTable, isGrid, tableRef],
|
||||
[gridRef, handleRefreshGrid, handleRefreshTable, isGrid, tableRef],
|
||||
);
|
||||
|
||||
const handleOpenFiltersModal = () => {
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import { ChangeEvent, MouseEvent, MutableRefObject, useCallback, useMemo } from 'react';
|
||||
import type { AgGridReact as AgGridReactType } from '@ag-grid-community/react/lib/agGridReact';
|
||||
import { Divider, Flex, Group, Stack } from '@mantine/core';
|
||||
import { openModal } from '@mantine/modals';
|
||||
import { ChangeEvent, MouseEvent, MutableRefObject, useCallback, useMemo } from 'react';
|
||||
import {
|
||||
RiAddBoxFill,
|
||||
RiAddCircleFill,
|
||||
|
@ -224,7 +224,6 @@ export const SongListHeaderFilters = ({ tableRef }: SongListHeaderFiltersProps)
|
|||
const onFilterChange = (filter: SongListFilter) => {
|
||||
handleRefreshTable(tableRef, {
|
||||
...filter,
|
||||
...customFilters,
|
||||
});
|
||||
};
|
||||
|
||||
|
|
|
@ -188,14 +188,30 @@ export const useListStore = create<ListSlice>()(
|
|||
}
|
||||
});
|
||||
|
||||
return {
|
||||
...get()._actions.getFilter({
|
||||
id,
|
||||
itemType: args.itemType,
|
||||
key: args.key,
|
||||
}),
|
||||
const filter = get()._actions.getFilter({
|
||||
id,
|
||||
itemType: args.itemType,
|
||||
key: args.key,
|
||||
});
|
||||
|
||||
const mergedFilters = {
|
||||
...filter,
|
||||
...args.customFilters,
|
||||
_custom: {
|
||||
...filter._custom,
|
||||
...args.customFilters?._custom,
|
||||
jellyfin: {
|
||||
...filter._custom?.jellyfin,
|
||||
...args.customFilters?._custom?.jellyfin,
|
||||
},
|
||||
navidrome: {
|
||||
...filter._custom?.navidrome,
|
||||
...args.customFilters?._custom?.navidrome,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
return mergedFilters;
|
||||
},
|
||||
setGrid: (args) => {
|
||||
const [page, id] = args.key.split('_');
|
||||
|
@ -622,13 +638,33 @@ export const useListStoreByKey = <TFilter>(args: { filter?: Partial<TFilter>; ke
|
|||
);
|
||||
};
|
||||
|
||||
export const useListFilterByKey = <TFilter>(args: { filter?: Partial<TFilter>; key: string }) => {
|
||||
export const useListFilterByKey = <TFilter>(args: {
|
||||
filter?: Partial<TFilter> | any;
|
||||
key: string;
|
||||
}) => {
|
||||
const key = args.key as keyof ListState['item'];
|
||||
return useListStore(
|
||||
(state) => ({
|
||||
...state.item[key].filter,
|
||||
...args.filter,
|
||||
}),
|
||||
(state) => {
|
||||
return {
|
||||
...state.item[key].filter,
|
||||
...(args.filter && {
|
||||
...args.filter,
|
||||
_custom: {
|
||||
...state.item[key].filter._custom,
|
||||
...args.filter?._custom,
|
||||
jellyfin: {
|
||||
...state.item[key].filter._custom?.jellyfin,
|
||||
...args.filter?._custom?.jellyfin,
|
||||
},
|
||||
navidrome: {
|
||||
...state.item[key].filter._custom?.navidrome,
|
||||
...args.filter?._custom?.navidrome,
|
||||
},
|
||||
},
|
||||
}),
|
||||
};
|
||||
},
|
||||
|
||||
shallow,
|
||||
);
|
||||
};
|
||||
|
|
Reference in a new issue