refactor album expansion to global scope

src/renderer/store/app.store.ts

@@ -1,3 +1,6 @@
+import type { ItemListStateItem } from '/@/renderer/components/item-list/helpers/item-list-state';
+import type { LibraryItem } from '/@/shared/types/domain-types';
+
 import merge from 'lodash/merge';
 import { devtools, persist } from 'zustand/middleware';
 import { immer } from 'zustand/middleware/immer';
@@ -17,6 +20,7 @@ export interface AppSlice extends AppState {
         setArtistSelectMode: (mode: 'multi' | 'single') => void;
         setGenreIdsMode: (mode: 'and' | 'or') => void;
         setGenreSelectMode: (mode: 'multi' | 'single') => void;
+        setGlobalExpanded: (value: GlobalExpandedState | null) => void;
         setPageSidebar: (key: string, value: boolean) => void;
         setPrivateMode: (enabled: boolean) => void;
         setShowTimeRemaining: (enabled: boolean) => void;
@@ -38,6 +42,7 @@ export interface AppState {
     commandPalette: CommandPaletteProps;
     genreIdsMode: 'and' | 'or';
     genreSelectMode: 'multi' | 'single';
+    globalExpanded: GlobalExpandedState | null;
     isReorderingQueue: boolean;
     pageSidebar: Record<string, boolean>;
     platform: Platform;
@@ -47,6 +52,11 @@ export interface AppState {
     titlebar: TitlebarProps;
 }
 
+export interface GlobalExpandedState {
+    item: ItemListStateItem;
+    itemType: LibraryItem;
+}
+
 type CommandPaletteProps = {
     close: () => void;
     open: () => void;
@@ -120,6 +130,11 @@ export const useAppStore = createWithEqualityFn<AppSlice>()(
                             state.genreSelectMode = mode;
                         });
                     },
+                    setGlobalExpanded: (value) => {
+                        set((state) => {
+                            state.globalExpanded = value;
+                        });
+                    },
                     setPageSidebar: (key, value) => {
                         set((state) => {
                             state.pageSidebar[key] = value;
@@ -175,6 +190,7 @@ export const useAppStore = createWithEqualityFn<AppSlice>()(
                 },
                 genreIdsMode: 'and',
                 genreSelectMode: 'multi',
+                globalExpanded: null,
                 isReorderingQueue: false,
                 pageSidebar: {
                     album: true,
@@ -210,7 +226,12 @@ export const useAppStore = createWithEqualityFn<AppSlice>()(
                 return persistedState;
             },
             name: 'store_app',
-            version: 3,
+            partialize: (state) => {
+                // eslint-disable-next-line @typescript-eslint/no-unused-vars -- ignore non-persisted state
+                const { globalExpanded: _, ...rest } = state;
+                return rest;
+            },
+            version: 4,
         },
     ),
 );
@@ -237,3 +258,16 @@ export const usePageSidebar = (key: string): [boolean, (value: boolean) => void]
 
     return [isOpen, setIsOpen];
 };
+
+export const useGlobalExpanded = () => useAppStore((state) => state.globalExpanded);
+
+export const useSetGlobalExpanded = () => useAppStore((state) => state.actions.setGlobalExpanded);
+
+export const useGlobalExpandedState = () => {
+    const globalExpanded = useGlobalExpanded();
+    const setGlobalExpanded = useSetGlobalExpanded();
+
+    const clearGlobalExpanded = () => setGlobalExpanded(null);
+
+    return { clearGlobalExpanded, globalExpanded, setGlobalExpanded };
+};