crossfade player enhancements, reorganize settings

src/renderer/store/player.store.ts

@@ -15,6 +15,7 @@ import { idbStateStorage } from '/@/renderer/store/utils';
 import { shuffleInPlace } from '/@/renderer/utils/shuffle';
 import { PlayerData, QueueData, QueueSong, Song } from '/@/shared/types/domain-types';
 import {
+    CrossfadeStyle,
     Play,
     PlayerQueueType,
     PlayerRepeat,
@@ -56,6 +57,7 @@ interface Actions {
     moveSelectedToNext: (items: QueueSong[]) => void;
     moveSelectedToTop: (items: QueueSong[]) => void;
     setCrossfadeDuration: (duration: number) => void;
+    setCrossfadeStyle: (style: CrossfadeStyle) => void;
     setQueueType: (queueType: PlayerQueueType) => void;
     setRepeat: (repeat: PlayerRepeat) => void;
     setShuffle: (shuffle: PlayerShuffle) => void;
@@ -77,6 +79,7 @@ interface GroupedQueue {
 interface State {
     player: {
         crossfadeDuration: number;
+        crossfadeStyle: CrossfadeStyle;
         index: number;
         muted: boolean;
         playerNum: 1 | 2;
@@ -95,6 +98,7 @@ interface State {
 const initialState: State = {
     player: {
         crossfadeDuration: 5,
+        crossfadeStyle: CrossfadeStyle.EQUAL_POWER,
         index: -1,
         muted: false,
         playerNum: 1,
@@ -1048,6 +1052,11 @@ export const usePlayerStoreBase = create<PlayerState>()(
                         state.player.crossfadeDuration = normalizedDuration;
                     });
                 },
+                setCrossfadeStyle: (style: CrossfadeStyle) => {
+                    set((state) => {
+                        state.player.crossfadeStyle = style;
+                    });
+                },
                 setQueueType: (queueType: PlayerQueueType) => {
                     set((state) => {
                         // From default -> priority, move all items from default to priority
@@ -1245,6 +1254,7 @@ export const usePlayerActions = () => {
             moveSelectedToNext: state.moveSelectedToNext,
             moveSelectedToTop: state.moveSelectedToTop,
             setCrossfadeDuration: state.setCrossfadeDuration,
+            setCrossfadeStyle: state.setCrossfadeStyle,
             setQueueType: state.setQueueType,
             setRepeat: state.setRepeat,
             setShuffle: state.setShuffle,
@@ -1403,6 +1413,7 @@ export const usePlayerProperties = () => {
     return usePlayerStoreBase(
         useShallow((state) => ({
             crossfadeDuration: state.player.crossfadeDuration,
+            crossfadeStyle: state.player.crossfadeStyle,
             isMuted: state.player.muted,
             playerNum: state.player.playerNum,
             queueType: state.player.queueType,

src/renderer/store/settings.store.ts

@@ -25,14 +25,12 @@ import { sanitizeCss } from '/@/renderer/utils/sanitize';
 import { AppTheme } from '/@/shared/themes/app-theme-types';
 import { LibraryItem, LyricSource } from '/@/shared/types/domain-types';
 import {
-    CrossfadeStyle,
     FontType,
     ItemListKey,
     ListDisplayType,
     ListPaginationType,
     Platform,
     Play,
-    PlayerStyle,
     PlayerType,
     TableColumn,
 } from '/@/shared/types/types';
@@ -306,15 +304,11 @@ const ScrobbleSettingsSchema = z.object({
 
 const PlaybackSettingsSchema = z.object({
     audioDeviceId: z.string().nullable().optional(),
-    crossfadeDuration: z.number(),
-    crossfadeStyle: z.nativeEnum(CrossfadeStyle),
     mediaSession: z.boolean(),
     mpvExtraParameters: z.array(z.string()),
     mpvProperties: MpvSettingsSchema,
-    muted: z.boolean(),
     preservePitch: z.boolean(),
     scrobble: ScrobbleSettingsSchema,
-    style: z.nativeEnum(PlayerStyle),
     transcode: TranscodingConfigSchema,
     type: z.nativeEnum(PlayerType),
     webAudio: z.boolean(),
@@ -1090,8 +1084,6 @@ const initialState: SettingsState = {
     },
     playback: {
         audioDeviceId: undefined,
-        crossfadeDuration: 5,
-        crossfadeStyle: CrossfadeStyle.EQUALPOWER,
         mediaSession: false,
         mpvExtraParameters: [],
         mpvProperties: {
@@ -1104,7 +1096,6 @@ const initialState: SettingsState = {
             replayGainMode: 'no',
             replayGainPreampDB: 0,
         },
-        muted: false,
         preservePitch: true,
         scrobble: {
             enabled: true,
@@ -1112,7 +1103,6 @@ const initialState: SettingsState = {
             scrobbleAtDuration: 240,
             scrobbleAtPercentage: 75,
         },
-        style: PlayerStyle.GAPLESS,
         transcode: {
             enabled: false,
         },
@@ -1289,10 +1279,7 @@ export const useTableSettings = (type: ItemListKey) =>
 
 export const useGeneralSettings = () => useSettingsStore((state) => state.general, shallow);
 
-export const usePlaybackType = () =>
-    useSettingsStore((state) => {
-        return state.playback.type;
-    });
+export const usePlaybackType = () => useSettingsStore((state) => state.playback.type, shallow);
 
 export const usePlayButtonBehavior = () =>
     useSettingsStore((state) => state.general.playButtonBehavior, shallow);