update query persistence to hooks

src/renderer/features/shared/hooks/use-music-folder-id-filter.ts

@@ -1,15 +1,46 @@
 import { parseAsString, useQueryState } from 'nuqs';
 
 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 useMusicFolderIdFilter = (defaultValue: null | string, listKey: ItemListKey) => {
+    const server = useCurrentServer();
+
+    const [persisted, setPersisted] = useLocalStorage({
+        defaultValue: '',
+        key: getPersistenceKey(server.id, listKey),
+    });
 
-export const useMusicFolderIdFilter = (defaultValue?: string) => {
     const [musicFolderId, setMusicFolderId] = useQueryState(
         FILTER_KEYS.SHARED.MUSIC_FOLDER_ID,
-        defaultValue ? parseAsString.withDefault(defaultValue) : parseAsString,
+        getDefaultMusicFolderId(defaultValue, persisted),
     );
 
+    const handleSetMusicFolderId = (musicFolderId: string) => {
+        setMusicFolderId(musicFolderId);
+        setPersisted(musicFolderId);
+    };
+
     return {
         [FILTER_KEYS.SHARED.MUSIC_FOLDER_ID]: musicFolderId ?? undefined,
-        setMusicFolderId,
+        setMusicFolderId: handleSetMusicFolderId,
     };
 };
+
+const getDefaultMusicFolderId = (defaultValue: null | string, persisted: null | string) => {
+    if (persisted) {
+        return parseAsString.withDefault(persisted);
+    }
+
+    if (defaultValue) {
+        return parseAsString.withDefault(defaultValue);
+    }
+
+    return parseAsString;
+};
+
+const getPersistenceKey = (serverId: string, listKey: ItemListKey) => {
+    return `${serverId}-list-${listKey}-${FILTER_KEYS.SHARED.MUSIC_FOLDER_ID}`;
+};

src/renderer/features/shared/hooks/use-sort-by-filter.ts

@@ -1,15 +1,46 @@
 import { parseAsString, useQueryState } from 'nuqs';
 
 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 [persisted, setPersisted] = useLocalStorage({
+        defaultValue: defaultValue,
+        key: getPersistenceKey(server.id, listKey),
+    });
 
-export const useSortByFilter = <TSortBy>(defaultValue: string) => {
     const [sortBy, setSortBy] = useQueryState(
         FILTER_KEYS.SHARED.SORT_BY,
-        defaultValue ? parseAsString.withDefault(defaultValue) : parseAsString,
+        getDefaultSortBy(defaultValue, persisted),
     );
 
+    const handleSetSortBy = (sortBy: string) => {
+        setSortBy(sortBy);
+        setPersisted(sortBy);
+    };
+
     return {
         [FILTER_KEYS.SHARED.SORT_BY]: sortBy as TSortBy,
-        setSortBy,
+        setSortBy: handleSetSortBy,
     };
 };
+
+const getDefaultSortBy = (defaultValue: null | string, persisted: null | string) => {
+    if (persisted) {
+        return parseAsString.withDefault(persisted);
+    }
+
+    if (defaultValue) {
+        return parseAsString.withDefault(defaultValue);
+    }
+
+    return parseAsString;
+};
+
+const getPersistenceKey = (serverId: string, listKey: ItemListKey) => {
+    return `${serverId}-list-${listKey}-${FILTER_KEYS.SHARED.SORT_BY}`;
+};

src/renderer/features/shared/hooks/use-sort-order-filter.ts

@@ -1,16 +1,47 @@
 import { parseAsString, useQueryState } from 'nuqs';
 
 import { FILTER_KEYS } from '/@/renderer/features/shared/utils';
+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 [persisted, setPersisted] = useLocalStorage({
+        defaultValue: SortOrder.ASC,
+        key: getPersistenceKey(server.id, listKey),
+    });
 
-export const useSortOrderFilter = (defaultValue: string) => {
     const [sortOrder, setSortOrder] = useQueryState(
         FILTER_KEYS.SHARED.SORT_ORDER,
-        defaultValue ? parseAsString.withDefault(defaultValue) : parseAsString,
+        getDefaultSortOrder(defaultValue, persisted),
     );
 
+    const handleSetSortOrder = (sortOrder: SortOrder) => {
+        setSortOrder(sortOrder);
+        setPersisted(sortOrder);
+    };
+
     return {
         [FILTER_KEYS.SHARED.SORT_ORDER]: sortOrder as SortOrder,
-        setSortOrder,
+        setSortOrder: handleSetSortOrder,
     };
 };
+
+const getDefaultSortOrder = (defaultValue: null | string, persisted: null | string) => {
+    if (persisted) {
+        return parseAsString.withDefault(persisted);
+    }
+
+    if (defaultValue) {
+        return parseAsString.withDefault(defaultValue);
+    }
+
+    return parseAsString;
+};
+
+const getPersistenceKey = (serverId: string, listKey: ItemListKey) => {
+    return `${serverId}-list-${listKey}-${FILTER_KEYS.SHARED.SORT_ORDER}`;
+};