refactor filter persistence to one key

This commit is contained in:
jeffvli
2025-11-14 00:17:36 -08:00
parent 8a8de4a1b6
commit 0c6a993f29
5 changed files with 58 additions and 44 deletions
@@ -0,0 +1,38 @@
import { useLocalStorage } from '/@/shared/hooks/use-local-storage';
import { ItemListKey } from '/@/shared/types/types';
export interface ListFilterPersistence {
[listKey: string]: {
[filterKey: string]: string | undefined;
};
}
const getPersistenceKey = (serverId: string) => {
return `${serverId}-filters`;
};
export const useListFilterPersistence = (serverId: string, listKey: ItemListKey) => {
const [persistedFilters, setPersistedFilters] = useLocalStorage<ListFilterPersistence>({
defaultValue: {},
key: getPersistenceKey(serverId),
});
const getFilter = (filterKey: string): string | undefined => {
return persistedFilters?.[listKey]?.[filterKey];
};
const setFilter = (filterKey: string, value: string) => {
setPersistedFilters((prev) => ({
...prev,
[listKey]: {
...prev[listKey],
[filterKey]: value,
},
}));
};
return {
getFilter,
setFilter,
};
};
@@ -1,17 +1,15 @@
import { parseAsString, useQueryState } from 'nuqs';
import { FILTER_KEYS } from '/@/renderer/features/shared/utils';
import { useListFilterPersistence } from '/@/renderer/features/shared/hooks/use-list-filter-persistence';
import { useCurrentServer } from '/@/renderer/store';
import { useLocalStorage } from '/@/shared/hooks/use-local-storage';
import { ItemListKey } from '/@/shared/types/types';
export const useMusicFolderIdFilter = (defaultValue: null | string, listKey: ItemListKey) => {
const server = useCurrentServer();
const { getFilter, setFilter } = useListFilterPersistence(server.id, listKey);
const [persisted, setPersisted] = useLocalStorage({
defaultValue: '',
key: getPersistenceKey(server.id, listKey),
});
const persisted = getFilter(FILTER_KEYS.SHARED.MUSIC_FOLDER_ID);
const [musicFolderId, setMusicFolderId] = useQueryState(
FILTER_KEYS.SHARED.MUSIC_FOLDER_ID,
@@ -20,7 +18,7 @@ export const useMusicFolderIdFilter = (defaultValue: null | string, listKey: Ite
const handleSetMusicFolderId = (musicFolderId: string) => {
setMusicFolderId(musicFolderId);
setPersisted(musicFolderId);
setFilter(FILTER_KEYS.SHARED.MUSIC_FOLDER_ID, musicFolderId);
};
return {
@@ -29,7 +27,7 @@ export const useMusicFolderIdFilter = (defaultValue: null | string, listKey: Ite
};
};
const getDefaultMusicFolderId = (defaultValue: null | string, persisted: null | string) => {
const getDefaultMusicFolderId = (defaultValue: null | string, persisted: string | undefined) => {
if (persisted) {
return parseAsString.withDefault(persisted);
}
@@ -40,7 +38,3 @@ const getDefaultMusicFolderId = (defaultValue: null | string, persisted: null |
return parseAsString;
};
const getPersistenceKey = (serverId: string, listKey: ItemListKey) => {
return `${serverId}-list-${listKey}-${FILTER_KEYS.SHARED.MUSIC_FOLDER_ID}`;
};
@@ -1,7 +1,7 @@
import { parseAsString, useQueryState } from 'nuqs';
import { useListFilterPersistence } from '/@/renderer/features/shared/hooks/use-list-filter-persistence';
import { useCurrentServer } from '/@/renderer/store';
import { useLocalStorage } from '/@/shared/hooks/use-local-storage';
import { ItemListKey } from '/@/shared/types/types';
export const useSelectFilter = (
@@ -10,17 +10,15 @@ export const useSelectFilter = (
listKey: ItemListKey,
) => {
const server = useCurrentServer();
const { getFilter, setFilter } = useListFilterPersistence(server.id, listKey);
const [persisted, setPersisted] = useLocalStorage({
defaultValue: defaultValue || '',
key: getPersistenceKey(server.id, listKey, filterKey),
});
const persisted = getFilter(filterKey);
const [value, setValue] = useQueryState(filterKey, getDefaultValue(defaultValue, persisted));
const handleSetValue = (newValue: string) => {
setValue(newValue);
setPersisted(newValue);
setFilter(filterKey, newValue);
};
return {
@@ -30,7 +28,7 @@ export const useSelectFilter = (
};
};
const getDefaultValue = (defaultValue: null | string, persisted: null | string) => {
const getDefaultValue = (defaultValue: null | string, persisted: string | undefined) => {
if (persisted) {
return parseAsString.withDefault(persisted);
}
@@ -41,7 +39,3 @@ const getDefaultValue = (defaultValue: null | string, persisted: null | string)
return parseAsString;
};
const getPersistenceKey = (serverId: string, listKey: ItemListKey, filterKey: string) => {
return `${serverId}-list-${listKey}-${filterKey}`;
};
@@ -1,17 +1,15 @@
import { parseAsString, useQueryState } from 'nuqs';
import { useListFilterPersistence } from '/@/renderer/features/shared/hooks/use-list-filter-persistence';
import { FILTER_KEYS } from '/@/renderer/features/shared/utils';
import { useCurrentServer } from '/@/renderer/store';
import { useLocalStorage } from '/@/shared/hooks/use-local-storage';
import { ItemListKey } from '/@/shared/types/types';
export const useSortByFilter = <TSortBy>(defaultValue: null | string, listKey: ItemListKey) => {
const server = useCurrentServer();
const { getFilter, setFilter } = useListFilterPersistence(server.id, listKey);
const [persisted, setPersisted] = useLocalStorage({
defaultValue: defaultValue,
key: getPersistenceKey(server.id, listKey),
});
const persisted = getFilter(FILTER_KEYS.SHARED.SORT_BY);
const [sortBy, setSortBy] = useQueryState(
FILTER_KEYS.SHARED.SORT_BY,
@@ -20,7 +18,7 @@ export const useSortByFilter = <TSortBy>(defaultValue: null | string, listKey: I
const handleSetSortBy = (sortBy: string) => {
setSortBy(sortBy);
setPersisted(sortBy);
setFilter(FILTER_KEYS.SHARED.SORT_BY, sortBy);
};
return {
@@ -29,7 +27,7 @@ export const useSortByFilter = <TSortBy>(defaultValue: null | string, listKey: I
};
};
const getDefaultSortBy = (defaultValue: null | string, persisted: null | string) => {
const getDefaultSortBy = (defaultValue: null | string, persisted: string | undefined) => {
if (persisted) {
return parseAsString.withDefault(persisted);
}
@@ -40,7 +38,3 @@ const getDefaultSortBy = (defaultValue: null | string, persisted: null | string)
return parseAsString;
};
const getPersistenceKey = (serverId: string, listKey: ItemListKey) => {
return `${serverId}-list-${listKey}-${FILTER_KEYS.SHARED.SORT_BY}`;
};
@@ -1,18 +1,16 @@
import { parseAsString, useQueryState } from 'nuqs';
import { FILTER_KEYS } from '/@/renderer/features/shared/utils';
import { useListFilterPersistence } from '/@/renderer/features/shared/hooks/use-list-filter-persistence';
import { useCurrentServer } from '/@/renderer/store';
import { useLocalStorage } from '/@/shared/hooks/use-local-storage';
import { SortOrder } from '/@/shared/types/domain-types';
import { ItemListKey } from '/@/shared/types/types';
export const useSortOrderFilter = (defaultValue: null | string, listKey: ItemListKey) => {
const server = useCurrentServer();
const { getFilter, setFilter } = useListFilterPersistence(server.id, listKey);
const [persisted, setPersisted] = useLocalStorage({
defaultValue: SortOrder.ASC,
key: getPersistenceKey(server.id, listKey),
});
const persisted = getFilter(FILTER_KEYS.SHARED.SORT_ORDER);
const [sortOrder, setSortOrder] = useQueryState(
FILTER_KEYS.SHARED.SORT_ORDER,
@@ -21,7 +19,7 @@ export const useSortOrderFilter = (defaultValue: null | string, listKey: ItemLis
const handleSetSortOrder = (sortOrder: SortOrder) => {
setSortOrder(sortOrder);
setPersisted(sortOrder);
setFilter(FILTER_KEYS.SHARED.SORT_ORDER, sortOrder);
};
return {
@@ -30,7 +28,7 @@ export const useSortOrderFilter = (defaultValue: null | string, listKey: ItemLis
};
};
const getDefaultSortOrder = (defaultValue: null | string, persisted: null | string) => {
const getDefaultSortOrder = (defaultValue: null | string, persisted: string | undefined) => {
if (persisted) {
return parseAsString.withDefault(persisted);
}
@@ -41,7 +39,3 @@ const getDefaultSortOrder = (defaultValue: null | string, persisted: null | stri
return parseAsString;
};
const getPersistenceKey = (serverId: string, listKey: ItemListKey) => {
return `${serverId}-list-${listKey}-${FILTER_KEYS.SHARED.SORT_ORDER}`;
};