From 782cd26b3dbcff06cd2eb3a9b71c1d67c4b74913 Mon Sep 17 00:00:00 2001 From: Kendall Garner <17521368+kgarner7@users.noreply.github.com> Date: Fri, 27 Sep 2024 17:13:22 +0000 Subject: [PATCH] fix(ui): save play mode for player (#3315) * fix(ui): save play mode for player - 3019 * redux * redux --- ui/src/actions/player.js | 6 ++++++ ui/src/audioplayer/Player.js | 12 ++++++++++-- ui/src/reducers/playerReducer.js | 10 ++++++++++ ui/src/share/SharePlayer.js | 2 +- ui/src/store/createAdminStore.js | 7 ++++++- 5 files changed, 33 insertions(+), 4 deletions(-) diff --git a/ui/src/actions/player.js b/ui/src/actions/player.js index 70fa88f50..a9e2577f4 100644 --- a/ui/src/actions/player.js +++ b/ui/src/actions/player.js @@ -6,6 +6,7 @@ export const PLAYER_CLEAR_QUEUE = 'PLAYER_CLEAR_QUEUE' export const PLAYER_PLAY_TRACKS = 'PLAYER_PLAY_TRACKS' export const PLAYER_CURRENT = 'PLAYER_CURRENT' export const PLAYER_SET_VOLUME = 'PLAYER_SET_VOLUME' +export const PLAYER_SET_MODE = 'PLAYER_SET_MODE' export const setTrack = (data) => ({ type: PLAYER_SET_TRACK, @@ -89,3 +90,8 @@ export const setVolume = (volume) => ({ type: PLAYER_SET_VOLUME, data: { volume }, }) + +export const setPlayMode = (mode) => ({ + type: PLAYER_SET_MODE, + data: { mode }, +}) diff --git a/ui/src/audioplayer/Player.js b/ui/src/audioplayer/Player.js index 6af8dd11f..6103127c8 100644 --- a/ui/src/audioplayer/Player.js +++ b/ui/src/audioplayer/Player.js @@ -16,7 +16,13 @@ import useCurrentTheme from '../themes/useCurrentTheme' import config from '../config' import useStyle from './styles' import AudioTitle from './AudioTitle' -import { clearQueue, currentPlaying, setVolume, syncQueue } from '../actions' +import { + clearQueue, + currentPlaying, + setPlayMode, + setVolume, + syncQueue, +} from '../actions' import PlayerToolbar from './PlayerToolbar' import { sendNotification } from '../utils' import subsonic from '../subsonic' @@ -93,6 +99,7 @@ const Player = () => { () => ({ theme: playerTheme, bounds: 'body', + playMode: playerState.mode, mode: 'full', loadAudioErrorPlayNext: false, autoPlayInitLoadPlayList: true, @@ -121,7 +128,7 @@ const Player = () => { ), locale: locale(translate), }), - [gainInfo, isDesktop, playerTheme, translate], + [gainInfo, isDesktop, playerTheme, translate, playerState.mode], ) const options = useMemo(() => { @@ -294,6 +301,7 @@ const Player = () => { onAudioPlay={onAudioPlay} onAudioPlayTrackChange={onAudioPlayTrackChange} onAudioPause={onAudioPause} + onPlayModeChange={(mode) => dispatch(setPlayMode(mode))} onAudioEnded={onAudioEnded} onCoverClick={onCoverClick} onBeforeDestroy={onBeforeDestroy} diff --git a/ui/src/reducers/playerReducer.js b/ui/src/reducers/playerReducer.js index 3600ec82c..92fe85df4 100644 --- a/ui/src/reducers/playerReducer.js +++ b/ui/src/reducers/playerReducer.js @@ -9,6 +9,7 @@ import { PLAYER_SET_TRACK, PLAYER_SET_VOLUME, PLAYER_SYNC_QUEUE, + PLAYER_SET_MODE, } from '../actions' import config from '../config' @@ -178,6 +179,13 @@ const reduceCurrent = (state, { data }) => { } } +const reduceMode = (state, { data: { mode } }) => { + return { + ...state, + mode, + } +} + export const playerReducer = (previousState = initialState, payload) => { const { type } = payload switch (type) { @@ -197,6 +205,8 @@ export const playerReducer = (previousState = initialState, payload) => { return reduceSyncQueue(previousState, payload) case PLAYER_CURRENT: return reduceCurrent(previousState, payload) + case PLAYER_SET_MODE: + return reduceMode(previousState, payload) default: return previousState } diff --git a/ui/src/share/SharePlayer.js b/ui/src/share/SharePlayer.js index e4809eb47..b3776d892 100644 --- a/ui/src/share/SharePlayer.js +++ b/ui/src/share/SharePlayer.js @@ -39,7 +39,7 @@ const SharePlayer = () => { src: shareDownloadUrl(shareInfo?.id), }) } - console.log(list) + const options = { audioLists: list, mode: 'full', diff --git a/ui/src/store/createAdminStore.js b/ui/src/store/createAdminStore.js index 82545f634..ee4733877 100644 --- a/ui/src/store/createAdminStore.js +++ b/ui/src/store/createAdminStore.js @@ -58,7 +58,12 @@ const createAdminStore = ({ const state = store.getState() saveState({ theme: state.theme, - player: pick(state.player, ['queue', 'volume', 'savedPlayIndex']), + player: pick(state.player, [ + 'mode', + 'queue', + 'volume', + 'savedPlayIndex', + ]), albumView: state.albumView, settings: state.settings, })