mirrors/navidrome
1
0
Fork 0
mirror of https://github.com/navidrome/navidrome.git synced 2025-04-06 05:57:35 +03:00
Code Issues Projects Releases Packages Wiki Activity

Upgrade Web UI to Create-React-App 4 and React 17 (#1105)

Browse source 
* Upgrade to CRA 4.0.3

* Try to fix tests. No lucky

* Fix new ESLint errors

* Fix JS tests and remove unwanted dependency. (#1106)

* Fix tests

* Fix lint

* Remove React v16 workaround (fixed in v17)

* Force eslint to break on warnings

* Lint now needs to be called explicitly in the pipeline

Co-authored-by: Yash Jipkate <34203227+YashJipkate@users.noreply.github.com>
This commit is contained in:
Deluan Quintão 2021-05-25 09:58:06 -04:00 • committed by GitHub
parent d9f268266c
commit 5631493cc4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 6337 additions and 6515 deletions
Download patch file Download diff file Expand all files Collapse all files

116
ui/src/audioplayer/Player.js
View file

@ -111,7 +111,6 @@ const Player = () => {
const dataProvider = useDataProvider()
const dispatch = useDispatch()
const queue = useSelector((state) => state.queue)
const current = queue.current || {}
const { authenticated } = useAuthState()
const showNotifications = useSelector(
(state) => state.settings.notifications || false
@ -160,60 +159,64 @@ const Player = () => {
),
}
const defaultOptions = {
theme: playerTheme,
bounds: 'body',
mode: 'full',
autoPlay: false,
preload: true,
autoPlayInitLoadPlayList: true,
loadAudioErrorPlayNext: false,
clearPriorAudioLists: false,
showDestroy: true,
showDownload: false,
showReload: false,
toggleMode: !isDesktop,
glassBg: false,
showThemeSwitch: false,
showMediaSession: true,
restartCurrentOnPrev: true,
defaultPosition: {
top: 300,
left: 120,
},
volumeFade: { fadeIn: 200, fadeOut: 200 },
renderAudioTitle: (audioInfo, isMobile) => (
<AudioTitle audioInfo={audioInfo} isMobile={isMobile} />
),
locale: {
playListsText: translate('player.playListsText'),
openText: translate('player.openText'),
closeText: translate('player.closeText'),
notContentText: translate('player.notContentText'),
clickToPlayText: translate('player.clickToPlayText'),
clickToPauseText: translate('player.clickToPauseText'),
nextTrackText: translate('player.nextTrackText'),
previousTrackText: translate('player.previousTrackText'),
reloadText: translate('player.reloadText'),
volumeText: translate('player.volumeText'),
toggleLyricText: translate('player.toggleLyricText'),
toggleMiniModeText: translate('player.toggleMiniModeText'),
destroyText: translate('player.destroyText'),
downloadText: translate('player.downloadText'),
removeAudioListsText: translate('player.removeAudioListsText'),
clickToDeleteText: (name) =>
translate('player.clickToDeleteText', { name }),
emptyLyricText: translate('player.emptyLyricText'),
playModeText: {
order: translate('player.playModeText.order'),
orderLoop: translate('player.playModeText.orderLoop'),
singleLoop: translate('player.playModeText.singleLoop'),
shufflePlay: translate('player.playModeText.shufflePlay'),
const defaultOptions = useMemo(
() => ({
theme: playerTheme,
bounds: 'body',
mode: 'full',
autoPlay: false,
preload: true,
autoPlayInitLoadPlayList: true,
loadAudioErrorPlayNext: false,
clearPriorAudioLists: false,
showDestroy: true,
showDownload: false,
showReload: false,
toggleMode: !isDesktop,
glassBg: false,
showThemeSwitch: false,
showMediaSession: true,
restartCurrentOnPrev: true,
defaultPosition: {
top: 300,
left: 120,
},
},
}
volumeFade: { fadeIn: 200, fadeOut: 200 },
renderAudioTitle: (audioInfo, isMobile) => (
<AudioTitle audioInfo={audioInfo} isMobile={isMobile} />
),
locale: {
playListsText: translate('player.playListsText'),
openText: translate('player.openText'),
closeText: translate('player.closeText'),
notContentText: translate('player.notContentText'),
clickToPlayText: translate('player.clickToPlayText'),
clickToPauseText: translate('player.clickToPauseText'),
nextTrackText: translate('player.nextTrackText'),
previousTrackText: translate('player.previousTrackText'),
reloadText: translate('player.reloadText'),
volumeText: translate('player.volumeText'),
toggleLyricText: translate('player.toggleLyricText'),
toggleMiniModeText: translate('player.toggleMiniModeText'),
destroyText: translate('player.destroyText'),
downloadText: translate('player.downloadText'),
removeAudioListsText: translate('player.removeAudioListsText'),
clickToDeleteText: (name) =>
translate('player.clickToDeleteText', { name }),
emptyLyricText: translate('player.emptyLyricText'),
playModeText: {
order: translate('player.playModeText.order'),
orderLoop: translate('player.playModeText.orderLoop'),
singleLoop: translate('player.playModeText.singleLoop'),
shufflePlay: translate('player.playModeText.shufflePlay'),
},
},
}),
[isDesktop, playerTheme, translate]
)
const options = useMemo(() => {
const current = queue.current || {}
return {
...defaultOptions,
clearPriorAudioLists: queue.clear,
@ -223,14 +226,7 @@ const Player = () => {
extendsContent: <PlayerToolbar id={current.trackId} />,
defaultVolume: queue.volume,
}
}, [
queue.clear,
queue.queue,
queue.volume,
queue.playIndex,
current,
defaultOptions,
])
}, [queue, defaultOptions])
const onAudioListsChange = useCallback(
(currentPlayIndex, audioLists) =>