r.name}\n secondaryText={(r) => (\n <>\n {r.albumArtist}\n {config.enableStarRating && (\n <>\n
\n \n \n )}\n \n )}\n tertiaryText={(r) => (\n <>\n \n \n \n )}\n linkType={'show'}\n rightIcon={(r) => }\n {...rest}\n />\n ) : (\n }\n rowClick={'show'}\n classes={{ row: classes.row }}\n {...rest}\n >\n \n \n {isDesktop && }\n {isDesktop && }\n \n {isDesktop && }\n {config.enableStarRating && (\n \n )}\n \n )\n }\n />\n \n )\n}\n\nexport default AlbumListView\n","import React from 'react'\nimport {\n GridList,\n GridListTile,\n Typography,\n GridListTileBar,\n useMediaQuery,\n} from '@material-ui/core'\nimport { makeStyles } from '@material-ui/core/styles'\nimport withWidth from '@material-ui/core/withWidth'\nimport { Link } from 'react-router-dom'\nimport { linkToRecord, Loading, useListContext } from 'react-admin'\nimport { withContentRect } from 'react-measure'\nimport subsonic from '../subsonic'\nimport {\n AlbumContextMenu,\n PlayButton,\n ArtistLinkField,\n RangeField,\n} from '../common'\n\nconst useStyles = makeStyles(\n (theme) => ({\n root: {\n margin: '20px',\n },\n tileBar: {\n transition: 'all 150ms ease-out',\n opacity: 0,\n textAlign: 'left',\n marginBottom: '3px',\n background:\n 'linear-gradient(to top, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.4) 70%,rgba(0,0,0,0) 100%)',\n },\n tileBarMobile: {\n textAlign: 'left',\n marginBottom: '3px',\n background:\n 'linear-gradient(to top, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.4) 70%,rgba(0,0,0,0) 100%)',\n },\n albumArtistName: {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n textAlign: 'left',\n fontSize: '1em',\n },\n albumName: {\n fontSize: '14px',\n color: theme.palette.type === 'dark' ? '#eee' : 'black',\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n },\n albumSubtitle: {\n fontSize: '12px',\n color: theme.palette.type === 'dark' ? '#c5c5c5' : '#696969',\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n },\n link: {\n position: 'relative',\n display: 'block',\n textDecoration: 'none',\n '&:hover $tileBar': {\n opacity: 1,\n },\n },\n albumLink: {\n position: 'relative',\n display: 'block',\n textDecoration: 'none',\n },\n albumContainer: {},\n albumPlayButton: { color: 'white' },\n }),\n { name: 'NDAlbumGridView' }\n)\n\nconst useCoverStyles = makeStyles({\n cover: {\n display: 'inline-block',\n width: '100%',\n objectFit: 'contain',\n height: (props) => props.height,\n },\n})\n\nconst getColsForWidth = (width) => {\n if (width === 'xs') return 2\n if (width === 'sm') return 3\n if (width === 'md') return 4\n if (width === 'lg') return 6\n return 9\n}\n\nconst Cover = withContentRect('bounds')(\n ({ album, measureRef, contentRect }) => {\n // Force height to be the same as the width determined by the GridList\n // noinspection JSSuspiciousNameCombination\n const classes = useCoverStyles({ height: contentRect.bounds.width })\n return (\n \n )\n }\n)\n\nconst AlbumGridTile = ({ showArtist, record, basePath }) => {\n const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('md'))\n const classes = useStyles()\n\n return (\n \n
\n \n \n }\n actionIcon={}\n />\n \n \n {record.name}\n \n {showArtist ? (\n \n ) : (\n \n )}\n \n
\n {ids.map((id) => (\n \n \n \n ))}\n \n \n 0,\n })}\n key={version}\n >\n \n \n \n }\n rowClick={(id) => dispatch(playTracks(data, ids, id))}\n {...props}\n hasBulkActions={true}\n showDiscSubtitles={true}\n contextAlwaysVisible={!isDesktop}\n classes={{ row: classes.row }}\n >\n {isDesktop && (\n \n )}\n \n {isDesktop && }\n \n {isDesktop && }\n {isDesktop && config.enableStarRating && (\n \n )}\n \n )\n }\n />\n \n \n
\n \n \n )\n}\n\nexport const removeAlbumCommentsFromSongs = ({ album, data }) => {\n if (album?.comment && data) {\n Object.values(data).forEach((song) => {\n song.comment = ''\n })\n }\n}\n\nconst SanitizedAlbumSongs = (props) => {\n removeAlbumCommentsFromSongs(props)\n\n const { loaded, loading, total, ...rest } = useListContext(props)\n return <>{loaded && }\n}\n\nexport default SanitizedAlbumSongs\n","import React, { useMemo, useCallback } from 'react'\nimport {\n Card,\n CardContent,\n CardMedia,\n Collapse,\n makeStyles,\n Typography,\n useMediaQuery,\n} from '@material-ui/core'\nimport { useTranslate } from 'react-admin'\nimport clsx from 'clsx'\nimport Lightbox from 'react-image-lightbox'\nimport 'react-image-lightbox/style.css'\nimport subsonic from '../subsonic'\nimport {\n ArtistLinkField,\n DurationField,\n formatRange,\n SizeField,\n LoveButton,\n RatingField,\n} from '../common'\nimport config from '../config'\n\nconst useStyles = makeStyles(\n (theme) => ({\n root: {\n [theme.breakpoints.down('xs')]: {\n padding: '0.7em',\n minWidth: '20em',\n },\n [theme.breakpoints.up('sm')]: {\n padding: '1em',\n minWidth: '32em',\n },\n },\n cardContents: {\n display: 'flex',\n },\n details: {\n display: 'flex',\n flexDirection: 'column',\n },\n content: {\n flex: '2 0 auto',\n },\n coverParent: {\n [theme.breakpoints.down('xs')]: {\n height: '8em',\n width: '8em',\n minWidth: '8em',\n },\n [theme.breakpoints.up('sm')]: {\n height: '10em',\n width: '10em',\n minWidth: '10em',\n },\n [theme.breakpoints.up('lg')]: {\n height: '15em',\n width: '15em',\n minWidth: '15em',\n },\n },\n cover: {\n objectFit: 'contain',\n cursor: 'pointer',\n display: 'block',\n width: '100%',\n height: '100%',\n },\n loveButton: {\n top: theme.spacing(-0.2),\n left: theme.spacing(0.5),\n },\n commentBlock: {\n display: 'inline-block',\n marginTop: '1em',\n float: 'left',\n wordBreak: 'break-all',\n },\n pointerCursor: {\n cursor: 'pointer',\n },\n recordName: {},\n recordArtist: {},\n recordMeta: {},\n }),\n {\n name: 'NDAlbumDetails',\n }\n)\n\nconst AlbumComment = ({ record }) => {\n const classes = useStyles()\n const [expanded, setExpanded] = React.useState(false)\n\n const lines = record.comment.split('\\n')\n const formatted = useMemo(() => {\n return lines.map((line, idx) => (\n \n \n
\n \n ))\n }, [lines, record.id])\n\n const handleExpandClick = useCallback(() => {\n setExpanded(!expanded)\n }, [expanded, setExpanded])\n\n return (\n 1 && classes.pointerCursor\n )}\n >\n \n {formatted}\n \n \n )\n}\n\nconst AlbumDetails = ({ record }) => {\n const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('lg'))\n const classes = useStyles()\n const [isLightboxOpen, setLightboxOpen] = React.useState(false)\n const translate = useTranslate()\n\n const genreYear = (record) => {\n let genreDateLine = []\n if (record.genre) {\n genreDateLine.push(record.genre)\n }\n const year = formatRange(record, 'year')\n if (year) {\n genreDateLine.push(year)\n }\n return genreDateLine.join(' · ')\n }\n\n const imageUrl = subsonic.getCoverArtUrl(record, 300)\n const fullImageUrl = subsonic.getCoverArtUrl(record)\n\n const handleOpenLightbox = React.useCallback(() => setLightboxOpen(true), [])\n const handleCloseLightbox = React.useCallback(\n () => setLightboxOpen(false),\n []\n )\n return (\n \n \n
\n \n
\n
\n
\n \n {record.name}\n {config.enableFavourites && (\n \n )}\n \n \n \n \n \n {genreYear(record)}\n \n \n {record.songCount}{' '}\n {translate('resources.song.name', {\n smart_count: record.songCount,\n })}\n {' · '} {' '}\n {' · '}\n \n \n {config.enableStarRating && (\n \n \n
\n )}\n {isDesktop && record['comment'] && }\n \n
\n
}>\n isWritable(r && r.owner)}\n >\n \n \n {isDesktop && }\n {isDesktop && }\n {isDesktop && }\n {!isXsmall && (\n \n )}\n \n \n \n \n \n )\n}\n\nexport default PlaylistList\n","import React, { Fragment } from 'react'\n\nimport {\n Edit,\n FormDataConsumer,\n SimpleForm,\n TextInput,\n TextField,\n BooleanInput,\n required,\n useTranslate,\n} from 'react-admin'\nimport { Title } from '../common'\n\nconst SyncFragment = ({ formData, variant, ...rest }) => {\n return (\n \n {formData.path && }\n {formData.path && }\n \n )\n}\n\nconst PlaylistTitle = ({ record }) => {\n const translate = useTranslate()\n const resourceName = translate('resources.playlist.name', { smart_count: 1 })\n return \n}\n\nconst PlaylistEdit = (props) => (\n } {...props}>\n \n \n \n \n \n {(formDataProps) => }\n \n \n \n)\n\nexport default PlaylistEdit\n","import React from 'react'\nimport {\n Create,\n SimpleForm,\n TextInput,\n BooleanInput,\n required,\n useTranslate,\n} from 'react-admin'\nimport { Title } from '../common'\n\nconst PlaylistCreate = (props) => {\n const translate = useTranslate()\n const resourceName = translate('resources.playlist.name', { smart_count: 1 })\n const title = translate('ra.page.create', {\n name: `${resourceName}`,\n })\n return (\n } {...props}>\n \n \n \n \n \n \n )\n}\n\nexport default PlaylistCreate\n","import React from 'react'\nimport { Card, CardContent, Typography } from '@material-ui/core'\nimport { makeStyles } from '@material-ui/core/styles'\nimport { useTranslate } from 'react-admin'\nimport { DurationField, SizeField } from '../common'\n\nconst useStyles = makeStyles(\n (theme) => ({\n container: {\n [theme.breakpoints.down('xs')]: {\n padding: '0.7em',\n minWidth: '24em',\n },\n [theme.breakpoints.up('sm')]: {\n padding: '1em',\n minWidth: '32em',\n },\n },\n details: {\n display: 'inline-block',\n verticalAlign: 'top',\n [theme.breakpoints.down('xs')]: {\n width: '14em',\n },\n [theme.breakpoints.up('sm')]: {\n width: '26em',\n },\n [theme.breakpoints.up('lg')]: {\n width: '38em',\n },\n },\n title: {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n },\n }),\n {\n name: 'NDPlaylistDetails',\n }\n)\n\nconst PlaylistDetails = (props) => {\n const { record = {} } = props\n const translate = useTranslate()\n const classes = useStyles()\n\n return (\n \n \n \n {record.name || translate('ra.page.loading')}\n \n {record.comment}\n \n {record.songCount ? (\n \n {record.songCount}{' '}\n {translate('resources.song.name', {\n smart_count: record.songCount,\n })}\n {' · '}\n \n {' · '}\n \n \n ) : (\n \n )}\n \n \n \n )\n}\n\nexport default PlaylistDetails\n","import React, { Fragment, useEffect } from 'react'\nimport {\n BulkDeleteButton,\n useUnselectAll,\n ResourceContextProvider,\n} from 'react-admin'\nimport PropTypes from 'prop-types'\n\n// Replace original resource with \"fake\" one for removing tracks from playlist\nconst PlaylistSongBulkActions = ({\n playlistId,\n resource,\n onUnselectItems,\n ...rest\n}) => {\n const unselectAll = useUnselectAll()\n useEffect(() => {\n unselectAll('playlistTrack')\n }, [unselectAll])\n\n const mappedResource = `playlist/${playlistId}/tracks`\n return (\n \n \n \n \n \n )\n}\n\nPlaylistSongBulkActions.propTypes = {\n playlistId: PropTypes.string.isRequired,\n}\n\nexport default PlaylistSongBulkActions\n","import React, { useCallback } from 'react'\nimport {\n BulkActionsToolbar,\n ListToolbar,\n TextField,\n useRefresh,\n useDataProvider,\n useNotify,\n useVersion,\n useListContext,\n ListBase,\n} from 'react-admin'\nimport clsx from 'clsx'\nimport { useDispatch } from 'react-redux'\nimport { Card, useMediaQuery } from '@material-ui/core'\nimport { makeStyles } from '@material-ui/core/styles'\nimport ReactDragListView from 'react-drag-listview'\nimport {\n DurationField,\n SongDetails,\n SongContextMenu,\n SongDatagrid,\n SongTitleField,\n} from '../common'\nimport { AddToPlaylistDialog } from '../dialogs'\nimport { AlbumLinkField } from '../song/AlbumLinkField'\nimport { playTracks } from '../actions'\nimport PlaylistSongBulkActions from './PlaylistSongBulkActions'\nimport { QualityInfo } from '../common/QualityInfo'\n\nconst useStyles = makeStyles(\n (theme) => ({\n root: {},\n main: {\n display: 'flex',\n },\n content: {\n marginTop: 0,\n transition: theme.transitions.create('margin-top'),\n position: 'relative',\n flex: '1 1 auto',\n [theme.breakpoints.down('xs')]: {\n boxShadow: 'none',\n },\n },\n bulkActionsDisplayed: {\n marginTop: -theme.spacing(8),\n transition: theme.transitions.create('margin-top'),\n },\n actions: {\n zIndex: 2,\n display: 'flex',\n justifyContent: 'flex-end',\n flexWrap: 'wrap',\n },\n noResults: { padding: 20 },\n toolbar: {\n justifyContent: 'flex-start',\n },\n row: {\n '&:hover': {\n '& $contextMenu': {\n visibility: 'visible',\n },\n },\n },\n contextMenu: {\n visibility: (props) => (props.isDesktop ? 'hidden' : 'visible'),\n },\n }),\n { name: 'RaList' }\n)\n\nconst ReorderableList = ({ readOnly, children, ...rest }) => {\n if (readOnly) {\n return children\n }\n return {children}\n}\n\nconst PlaylistSongs = ({ playlistId, readOnly, actions, ...props }) => {\n const listContext = useListContext()\n const { data, ids, onUnselectItems } = listContext\n const isXsmall = useMediaQuery((theme) => theme.breakpoints.down('xs'))\n const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('md'))\n const classes = useStyles({ isDesktop })\n const dispatch = useDispatch()\n const dataProvider = useDataProvider()\n const refresh = useRefresh()\n const notify = useNotify()\n const version = useVersion()\n\n const onAddToPlaylist = useCallback(\n (pls) => {\n if (pls.id === playlistId) {\n refresh()\n }\n },\n [playlistId, refresh]\n )\n\n const reorder = useCallback(\n (playlistId, id, newPos) => {\n dataProvider\n .update('playlistTrack', {\n id,\n data: { insert_before: newPos },\n filter: { playlist_id: playlistId },\n })\n .then(() => {\n refresh()\n })\n .catch(() => {\n notify('ra.page.error', 'warning')\n })\n },\n [dataProvider, notify, refresh]\n )\n\n const handleDragEnd = useCallback(\n (from, to) => {\n const toId = ids[to]\n const fromId = ids[from]\n reorder(playlistId, fromId, toId)\n },\n [playlistId, reorder, ids]\n )\n\n return (\n <>\n \n \n
0,\n })}\n key={version}\n >\n \n \n \n \n }\n rowClick={(id) => dispatch(playTracks(data, ids, id))}\n {...listContext}\n hasBulkActions={true}\n contextAlwaysVisible={!isDesktop}\n classes={{ row: classes.row }}\n >\n {isDesktop && }\n \n {isDesktop && }\n {isDesktop && }\n \n {isDesktop && }\n \n \n \n \n \n \n {`${audioInfo.singer} - ${audioInfo.album}`}\n \n
\n )}\n \n )\n})\n\nconst Player = () => {\n const translate = useTranslate()\n const theme = useCurrentTheme()\n const playerTheme = (theme.player && theme.player.theme) || 'dark'\n const dataProvider = useDataProvider()\n const dispatch = useDispatch()\n const queue = useSelector((state) => state.queue)\n const current = queue.current || {}\n const { authenticated } = useAuthState()\n const showNotifications = useSelector(\n (state) => state.settings.notifications || false\n )\n\n const visible = authenticated && queue.queue.length > 0\n const classes = useStyle({ visible })\n // Match the medium breakpoint defined in the material-ui theme\n // See https://material-ui.com/customization/breakpoints/#breakpoints\n const isDesktop = useMediaQuery('(min-width:810px)')\n\n const nextSong = useCallback(() => {\n const idx = queue.queue.findIndex(\n (item) => item.uuid === queue.current.uuid\n )\n return idx !== null ? queue.queue[idx + 1] : null\n }, [queue])\n\n const prevSong = useCallback(() => {\n const idx = queue.queue.findIndex(\n (item) => item.uuid === queue.current.uuid\n )\n return idx !== null ? queue.queue[idx - 1] : null\n }, [queue])\n\n const keyHandlers = {\n TOGGLE_PLAY: (e) => {\n e.preventDefault()\n audioInstance && audioInstance.togglePlay()\n },\n VOL_UP: () =>\n (audioInstance.volume = Math.min(1, audioInstance.volume + 0.1)),\n VOL_DOWN: () =>\n (audioInstance.volume = Math.max(0, audioInstance.volume - 0.1)),\n PREV_SONG: useCallback(\n (e) => {\n if (!e.metaKey && prevSong()) audioInstance && audioInstance.playPrev()\n },\n [prevSong]\n ),\n NEXT_SONG: useCallback(\n (e) => {\n if (!e.metaKey && nextSong()) audioInstance && audioInstance.playNext()\n },\n [nextSong]\n ),\n }\n\n const defaultOptions = {\n theme: playerTheme,\n bounds: 'body',\n mode: 'full',\n autoPlay: false,\n preload: true,\n autoPlayInitLoadPlayList: true,\n loadAudioErrorPlayNext: false,\n clearPriorAudioLists: false,\n showDestroy: true,\n showDownload: false,\n showReload: false,\n toggleMode: !isDesktop,\n glassBg: false,\n showThemeSwitch: false,\n showMediaSession: true,\n defaultPosition: {\n top: 300,\n left: 120,\n },\n volumeFade: { fadeIn: 200, fadeOut: 200 },\n renderAudioTitle: (audioInfo, isMobile) => (\n \n ),\n locale: {\n playListsText: translate('player.playListsText'),\n openText: translate('player.openText'),\n closeText: translate('player.closeText'),\n notContentText: translate('player.notContentText'),\n clickToPlayText: translate('player.clickToPlayText'),\n clickToPauseText: translate('player.clickToPauseText'),\n nextTrackText: translate('player.nextTrackText'),\n previousTrackText: translate('player.previousTrackText'),\n reloadText: translate('player.reloadText'),\n volumeText: translate('player.volumeText'),\n toggleLyricText: translate('player.toggleLyricText'),\n toggleMiniModeText: translate('player.toggleMiniModeText'),\n destroyText: translate('player.destroyText'),\n downloadText: translate('player.downloadText'),\n removeAudioListsText: translate('player.removeAudioListsText'),\n clickToDeleteText: (name) =>\n translate('player.clickToDeleteText', { name }),\n emptyLyricText: translate('player.emptyLyricText'),\n playModeText: {\n order: translate('player.playModeText.order'),\n orderLoop: translate('player.playModeText.orderLoop'),\n singleLoop: translate('player.playModeText.singleLoop'),\n shufflePlay: translate('player.playModeText.shufflePlay'),\n },\n },\n }\n\n const options = useMemo(() => {\n return {\n ...defaultOptions,\n clearPriorAudioLists: queue.clear,\n autoPlay: queue.clear || queue.playIndex === 0,\n playIndex: queue.playIndex,\n audioLists: queue.queue.map((item) => item),\n extendsContent: ,\n defaultVolume: queue.volume,\n }\n }, [\n queue.clear,\n queue.queue,\n queue.volume,\n queue.playIndex,\n current,\n defaultOptions,\n ])\n\n const onAudioListsChange = useCallback(\n (currentPlayIndex, audioLists) =>\n dispatch(syncQueue(currentPlayIndex, audioLists)),\n [dispatch]\n )\n\n const onAudioProgress = useCallback(\n (info) => {\n if (info.ended) {\n document.title = 'Navidrome'\n }\n\n // See https://www.last.fm/api/scrobbling#when-is-a-scrobble-a-scrobble\n const progress = (info.currentTime / info.duration) * 100\n if (\n isNaN(info.duration) ||\n info.duration < 30 ||\n (progress < 50 && info.currentTime < 240)\n ) {\n return\n }\n\n const item = queue.queue.find((item) => item.trackId === info.trackId)\n if (item && !item.scrobbled) {\n dispatch(scrobble(info.trackId, true))\n subsonic.scrobble(info.trackId, true)\n }\n },\n [dispatch, queue.queue]\n )\n\n const onAudioVolumeChange = useCallback(\n // sqrt to compensate for the logarithmic volume\n (volume) => dispatch(setVolume(Math.sqrt(volume))),\n [dispatch]\n )\n\n const onAudioPlay = useCallback(\n (info) => {\n dispatch(currentPlaying(info))\n if (info.duration) {\n document.title = `${info.name} - ${info.singer} - Navidrome`\n dispatch(scrobble(info.trackId, false))\n subsonic.scrobble(info.trackId, false)\n if (config.gaTrackingId) {\n ReactGA.event({\n category: 'Player',\n action: 'Play song',\n label: `${info.name} - ${info.singer}`,\n })\n }\n if (showNotifications) {\n sendNotification(\n info.name,\n `${info.singer} - ${info.album}`,\n info.cover\n )\n }\n }\n },\n [dispatch, showNotifications]\n )\n\n const onAudioPause = useCallback((info) => dispatch(currentPlaying(info)), [\n dispatch,\n ])\n\n const onAudioEnded = useCallback(\n (currentPlayId, audioLists, info) => {\n dispatch(currentPlaying(info))\n dataProvider\n .getOne('keepalive', { id: info.trackId })\n .catch((e) => console.log('Keepalive error:', e))\n },\n [dispatch, dataProvider]\n )\n\n const onCoverClick = useCallback((mode, audioLists, audioInfo) => {\n if (mode === 'full') {\n window.location.href = `#/album/${audioInfo.albumId}/show`\n }\n }, [])\n\n const onBeforeDestroy = useCallback(() => {\n return new Promise((resolve, reject) => {\n dispatch(clearQueue())\n reject()\n })\n }, [dispatch])\n\n if (!visible) {\n document.title = 'Navidrome'\n }\n\n return (\n \n {\n audioInstance = instance\n }}\n />\n \n \n )\n}\n\nexport { Player }\n","import polyglotI18nProvider from 'ra-i18n-polyglot'\nimport deepmerge from 'deepmerge'\nimport dataProvider from '../dataProvider'\nimport en from './en.json'\nimport { i18nProvider } from './index'\n\n// Only returns current selected locale if its translations are found in localStorage\nconst defaultLocale = function () {\n const locale = localStorage.getItem('locale')\n const current = JSON.parse(localStorage.getItem('translation'))\n if (current && current.id === locale) {\n // Asynchronously reload the translation from the server\n retrieveTranslation(locale).then(() => {\n i18nProvider.changeLocale(locale)\n })\n return locale\n }\n return 'en'\n}\n\nfunction retrieveTranslation(locale) {\n return dataProvider.getOne('translation', { id: locale }).then((res) => {\n localStorage.setItem('translation', JSON.stringify(res.data))\n return prepareLanguage(JSON.parse(res.data.data))\n })\n}\n\nconst removeEmpty = (obj) => {\n for (let k in obj) {\n if (obj.hasOwnProperty(k) && typeof obj[k] === 'object') {\n removeEmpty(obj[k])\n } else {\n if (!obj[k]) {\n delete obj[k]\n }\n }\n }\n}\n\nconst prepareLanguage = (lang) => {\n removeEmpty(lang)\n // Make \"albumSong\" and \"playlistTrack\" resource use the same translations as \"song\"\n lang.resources.albumSong = lang.resources.song\n lang.resources.playlistTrack = lang.resources.song\n // ra.boolean.null should always be empty\n lang.ra.boolean.null = ''\n // Fallback to english translations\n return deepmerge(en, lang)\n}\n\nexport default polyglotI18nProvider((locale) => {\n // English is bundled\n if (locale === 'en') {\n return prepareLanguage(en)\n }\n // If the requested locale is in already loaded, return it\n const current = JSON.parse(localStorage.getItem('translation'))\n if (current && current.id === locale) {\n return prepareLanguage(JSON.parse(current.data))\n }\n // If not, get it from the server, and store it in localStorage\n return retrieveTranslation(locale)\n}, defaultLocale())\n","import React from 'react'\nimport { useDispatch, useSelector } from 'react-redux'\nimport {\n Card,\n FormControl,\n FormHelperText,\n FormControlLabel,\n Switch,\n} from '@material-ui/core'\nimport {\n SelectInput,\n SimpleForm,\n Title,\n useLocale,\n useNotify,\n useSetLocale,\n useTranslate,\n} from 'react-admin'\nimport { makeStyles } from '@material-ui/core/styles'\nimport HelpOutlineIcon from '@material-ui/icons/HelpOutline'\nimport { changeTheme, setNotificationsState } from '../actions'\nimport themes from '../themes'\nimport { docsUrl } from '../utils'\nimport { useGetLanguageChoices } from '../i18n'\nimport albumLists, { defaultAlbumList } from '../album/albumLists'\nimport { AUTO_THEME_ID } from '../consts'\n\nconst useStyles = makeStyles({\n root: { marginTop: '1em' },\n})\n\nconst helpKey = '_help'\n\nfunction openInNewTab(url) {\n const win = window.open(url, '_blank')\n win.focus()\n}\n\nconst HelpMsg = ({ caption }) => (\n <>\n \n {caption}\n \n)\n\nconst SelectLanguage = (props) => {\n const translate = useTranslate()\n const setLocale = useSetLocale()\n const locale = useLocale()\n const { choices } = useGetLanguageChoices()\n\n choices.push({\n id: helpKey,\n name: ,\n })\n\n return (\n {\n if (event.target.value === helpKey) {\n openInNewTab(docsUrl('/docs/developers/translations/'))\n return\n }\n setLocale(event.target.value).then(() => {\n localStorage.setItem('locale', event.target.value)\n })\n }}\n />\n )\n}\n\nconst SelectTheme = (props) => {\n const translate = useTranslate()\n const dispatch = useDispatch()\n const currentTheme = useSelector((state) => state.theme)\n const themeChoices = [\n {\n id: AUTO_THEME_ID,\n name: 'Auto',\n },\n ]\n themeChoices.push(\n ...Object.keys(themes).map((key) => {\n return { id: key, name: themes[key].themeName }\n })\n )\n themeChoices.push({\n id: helpKey,\n name: ,\n })\n return (\n {\n if (event.target.value === helpKey) {\n openInNewTab(docsUrl('/docs/developers/creating-themes/'))\n return\n }\n dispatch(changeTheme(event.target.value))\n }}\n />\n )\n}\n\nconst SelectDefaultView = (props) => {\n const translate = useTranslate()\n const current = localStorage.getItem('defaultView') || defaultAlbumList\n const choices = Object.keys(albumLists).map((type) => ({\n id: type,\n name: translate(`resources.album.lists.${type}`),\n }))\n\n return (\n {\n localStorage.setItem('defaultView', event.target.value)\n }}\n />\n )\n}\n\nconst NotificationsToggle = () => {\n const translate = useTranslate()\n const dispatch = useDispatch()\n const notify = useNotify()\n const currentSetting = useSelector((state) => state.settings.notifications)\n const notAvailable = !('Notification' in window) || !window.isSecureContext\n\n if (\n (currentSetting && Notification.permission !== 'granted') ||\n notAvailable\n ) {\n dispatch(setNotificationsState(false))\n }\n\n const toggleNotifications = (event) => {\n if (currentSetting && !event.target.checked) {\n dispatch(setNotificationsState(false))\n } else {\n if (Notification.permission === 'denied') {\n notify(translate('message.notifications_blocked'), 'warning')\n } else {\n Notification.requestPermission().then((permission) => {\n dispatch(setNotificationsState(permission === 'granted'))\n })\n }\n }\n }\n\n return (\n \n \n }\n label={\n \n {translate('menu.personal.options.desktop_notifications')}\n \n }\n />\n {notAvailable && (\n \n {translate('message.notifications_not_available')}\n \n )}\n \n )\n}\n\nconst Personal = () => {\n const translate = useTranslate()\n const classes = useStyles()\n\n return (\n \n \n \n \n \n \n \n \n \n )\n}\n\nexport default Personal\n","// React Hook to get a list of all languages available. English is hardcoded\nimport { useGetList } from 'react-admin'\n\nexport default () => {\n const { ids, data, loaded, loading } = useGetList(\n 'translation',\n { page: 1, perPage: -1 },\n { field: '', order: '' },\n {}\n )\n\n const choices = [{ id: 'en', name: 'English' }]\n if (loaded) {\n ids.forEach((id) => choices.push({ id: id, name: data[id].name }))\n }\n choices.sort((a, b) => a.name.localeCompare(b.name))\n\n return { choices, loaded, loading }\n}\n","export const CHANGE_THEME = 'CHANGE_THEME'\n\nexport const changeTheme = (theme) => ({\n type: CHANGE_THEME,\n payload: theme,\n})\n","import React from 'react'\nimport { Route } from 'react-router-dom'\nimport Personal from './personal/Personal'\n\nexport default [ } />]\n","import { CHANGE_THEME } from '../actions'\nimport config from '../config'\nimport themes from '../themes'\n\nconst defaultTheme = () => {\n return (\n Object.keys(themes).find(\n (t) => themes[t].themeName === config.defaultTheme\n ) || 'DarkTheme'\n )\n}\n\nexport const themeReducer = (\n previousState = defaultTheme(),\n { type, payload }\n) => {\n if (type === CHANGE_THEME) {\n return payload\n }\n return previousState\n}\n","import {\n ADD_TO_PLAYLIST_CLOSE,\n ADD_TO_PLAYLIST_OPEN,\n DUPLICATE_SONG_WARNING_OPEN,\n DUPLICATE_SONG_WARNING_CLOSE,\n} from '../actions'\n\nexport const addToPlaylistDialogReducer = (\n previousState = {\n open: false,\n duplicateSong: false,\n },\n payload\n) => {\n const { type } = payload\n switch (type) {\n case ADD_TO_PLAYLIST_OPEN:\n return {\n ...previousState,\n open: true,\n selectedIds: payload.selectedIds,\n onSuccess: payload.onSuccess,\n }\n case ADD_TO_PLAYLIST_CLOSE:\n return { ...previousState, open: false, onSuccess: undefined }\n case DUPLICATE_SONG_WARNING_OPEN:\n return {\n ...previousState,\n duplicateSong: true,\n duplicateIds: payload.duplicateIds,\n }\n case DUPLICATE_SONG_WARNING_CLOSE:\n return { ...previousState, duplicateSong: false }\n default:\n return previousState\n }\n}\n","import 'react-jinke-music-player/assets/index.css'\nimport get from 'lodash.get'\nimport { v4 as uuidv4 } from 'uuid'\nimport subsonic from '../subsonic'\nimport config from '../config'\n\nimport {\n PLAYER_CLEAR_QUEUE,\n PLAYER_SET_VOLUME,\n PLAYER_CURRENT,\n PLAYER_ADD_TRACKS,\n PLAYER_PLAY_NEXT,\n PLAYER_SET_TRACK,\n PLAYER_SYNC_QUEUE,\n PLAYER_SCROBBLE,\n PLAYER_PLAY_TRACKS,\n} from '../actions'\n\nconst mapToAudioLists = (item) => {\n // If item comes from a playlist, id is mediaFileId\n const id = item.mediaFileId || item.id\n return {\n trackId: id,\n name: item.title,\n singer: item.artist,\n album: item.album,\n albumId: item.albumId,\n artistId: item.albumArtistId,\n duration: item.duration,\n suffix: item.suffix,\n bitRate: item.bitRate,\n musicSrc: subsonic.url('stream', id, { ts: true }),\n cover: subsonic.getCoverArtUrl(\n {\n coverArtId: config.devFastAccessCoverArt ? item.albumId : id,\n updatedAt: item.updatedAt,\n },\n 300\n ),\n scrobbled: false,\n uuid: uuidv4(),\n }\n}\n\nconst initialState = {\n queue: [],\n clear: true,\n current: {},\n volume: 1,\n playIndex: 0,\n}\n\nexport const playQueueReducer = (previousState = initialState, payload) => {\n let queue, current\n let newQueue\n const { type, data } = payload\n switch (type) {\n case PLAYER_CLEAR_QUEUE:\n return initialState\n case PLAYER_SET_VOLUME:\n return {\n ...previousState,\n playIndex: undefined,\n volume: data.volume,\n }\n case PLAYER_CURRENT:\n queue = previousState.queue\n current = data.ended\n ? {}\n : {\n trackId: data.trackId,\n uuid: data.uuid,\n paused: data.paused,\n }\n return {\n ...previousState,\n current,\n playIndex: undefined,\n volume: data.volume,\n }\n case PLAYER_ADD_TRACKS:\n queue = previousState.queue\n Object.keys(data).forEach((id) => {\n queue.push(mapToAudioLists(data[id]))\n })\n return { ...previousState, queue, clear: false, playIndex: undefined }\n case PLAYER_PLAY_NEXT:\n current = get(previousState.current, 'uuid', '')\n newQueue = []\n let foundPos = false\n previousState.queue.forEach((item) => {\n newQueue.push(item)\n if (item.uuid === current) {\n foundPos = true\n Object.keys(data).forEach((id) => {\n newQueue.push(mapToAudioLists(data[id]))\n })\n }\n })\n if (!foundPos) {\n Object.keys(data).forEach((id) => {\n newQueue.push(mapToAudioLists(data[id]))\n })\n }\n return {\n ...previousState,\n queue: newQueue,\n clear: true,\n playIndex: undefined,\n }\n case PLAYER_SET_TRACK:\n return {\n ...previousState,\n queue: [mapToAudioLists(data)],\n clear: true,\n playIndex: 0,\n }\n case PLAYER_SYNC_QUEUE:\n current = data.length > 0 ? previousState.current : {}\n return {\n ...previousState,\n queue: data,\n clear: false,\n playIndex: undefined,\n current,\n }\n case PLAYER_SCROBBLE:\n newQueue = previousState.queue.map((item) => {\n return {\n ...item,\n scrobbled:\n item.scrobbled || (item.trackId === payload.id && payload.submit),\n }\n })\n return {\n ...previousState,\n queue: newQueue,\n playIndex: undefined,\n clear: false,\n }\n case PLAYER_PLAY_TRACKS:\n queue = []\n let match = false\n Object.keys(data).forEach((id) => {\n if (id === payload.id) {\n match = true\n }\n if (match) {\n queue.push(mapToAudioLists(data[id]))\n }\n })\n return {\n ...previousState,\n queue,\n playIndex: 0,\n clear: true,\n }\n default:\n return previousState\n }\n}\n","import { ALBUM_MODE_GRID, ALBUM_MODE_LIST } from '../actions'\n\nexport const albumViewReducer = (\n previousState = {\n grid: true,\n },\n payload\n) => {\n const { type } = payload\n switch (type) {\n case ALBUM_MODE_GRID:\n case ALBUM_MODE_LIST:\n return { ...previousState, grid: type === ALBUM_MODE_GRID }\n default:\n return previousState\n }\n}\n","import { EVENT_SCAN_STATUS, EVENT_SERVER_START } from '../actions'\n\nconst defaultState = {\n scanStatus: { scanning: false, folderCount: 0, count: 0 },\n}\n\nexport const activityReducer = (\n previousState = {\n scanStatus: defaultState,\n },\n payload\n) => {\n const { type, data } = payload\n switch (type) {\n case EVENT_SCAN_STATUS:\n return { ...previousState, scanStatus: data }\n case EVENT_SERVER_START:\n return {\n ...previousState,\n serverStart: {\n startTime: data.startTime && Date.parse(data.startTime),\n },\n }\n default:\n return previousState\n }\n}\n","import { SET_NOTIFICATIONS_STATE } from '../actions'\n\nconst initialState = {\n notifications: false,\n}\n\nexport const settingsReducer = (previousState = initialState, payload) => {\n const { type, data } = payload\n switch (type) {\n case SET_NOTIFICATIONS_STATE:\n return {\n ...previousState,\n notifications: data,\n }\n default:\n return previousState\n }\n}\n","import { applyMiddleware, combineReducers, compose, createStore } from 'redux'\nimport { routerMiddleware, connectRouter } from 'connected-react-router'\nimport createSagaMiddleware from 'redux-saga'\nimport { all, fork } from 'redux-saga/effects'\nimport { adminReducer, adminSaga, USER_LOGOUT } from 'react-admin'\nimport throttle from 'lodash.throttle'\nimport pick from 'lodash.pick'\nimport { loadState, saveState } from './persistState'\n\nexport default ({\n authProvider,\n dataProvider,\n history,\n customReducers = {},\n}) => {\n const reducer = combineReducers({\n admin: adminReducer,\n router: connectRouter(history),\n ...customReducers,\n })\n const resettableAppReducer = (state, action) =>\n reducer(action.type !== USER_LOGOUT ? state : undefined, action)\n\n const saga = function* rootSaga() {\n yield all([adminSaga(dataProvider, authProvider)].map(fork))\n }\n const sagaMiddleware = createSagaMiddleware()\n\n const composeEnhancers =\n (process.env.NODE_ENV === 'development' &&\n typeof window !== 'undefined' &&\n window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ &&\n window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({\n trace: true,\n traceLimit: 25,\n })) ||\n compose\n\n const persistedState = loadState()\n const store = createStore(\n resettableAppReducer,\n persistedState,\n composeEnhancers(applyMiddleware(sagaMiddleware, routerMiddleware(history)))\n )\n\n store.subscribe(\n throttle(() => {\n const state = store.getState()\n saveState({\n theme: state.theme,\n queue: pick(state.queue, ['queue', 'volume']),\n albumView: state.albumView,\n settings: state.settings,\n })\n }),\n 1000\n )\n\n sagaMiddleware.run(saga)\n return store\n}\n","export const loadState = () => {\n try {\n const serializedState = localStorage.getItem('state')\n if (serializedState === null) {\n return undefined\n }\n return JSON.parse(serializedState)\n } catch (err) {\n return undefined\n }\n}\n\nexport const saveState = (state) => {\n try {\n const serializedState = JSON.stringify(state)\n localStorage.setItem('state', serializedState)\n } catch (err) {\n // Ignore write errors\n }\n}\n","import React from 'react'\nimport ReactGA from 'react-ga'\nimport 'react-jinke-music-player/assets/index.css'\nimport { Provider, useDispatch } from 'react-redux'\nimport { createHashHistory } from 'history'\nimport { Admin as RAAdmin, Resource } from 'react-admin'\nimport dataProvider from './dataProvider'\nimport authProvider from './authProvider'\nimport { Layout, Login, Logout } from './layout'\nimport transcoding from './transcoding'\nimport player from './player'\nimport user from './user'\nimport song from './song'\nimport album from './album'\nimport artist from './artist'\nimport playlist from './playlist'\nimport { Player } from './audioplayer'\nimport customRoutes from './routes'\nimport {\n themeReducer,\n addToPlaylistDialogReducer,\n playQueueReducer,\n albumViewReducer,\n activityReducer,\n settingsReducer,\n} from './reducers'\nimport createAdminStore from './store/createAdminStore'\nimport { i18nProvider } from './i18n'\nimport config from './config'\nimport { setDispatch, startEventStream } from './eventStream'\nimport { HotKeys } from 'react-hotkeys'\nimport { keyMap } from './hotkeys'\n\nconst history = createHashHistory()\n\nif (config.gaTrackingId) {\n ReactGA.initialize(config.gaTrackingId)\n history.listen((location) => {\n ReactGA.pageview(location.pathname)\n })\n ReactGA.pageview(window.location.pathname)\n}\n\nconst App = () => (\n \n \n \n)\n\nconst Admin = (props) => {\n const dispatch = useDispatch()\n if (config.devActivityPanel) {\n setDispatch(dispatch)\n authProvider\n .checkAuth()\n .then(() => startEventStream())\n .catch(() => {}) // ignore if not logged in\n }\n\n return (\n \n {(permissions) => [\n ,\n ,\n ,\n ,\n permissions === 'admin' ? (\n \n ) : null,\n ,\n permissions === 'admin' ? (\n \n ) : (\n \n ),\n ,\n ,\n ,\n ,\n\n ,\n ]}\n \n )\n}\n\nconst AppWithHotkeys = () => (\n \n \n \n)\n\nexport default AppWithHotkeys\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.0/8 are considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n)\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href)\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/navidrome-service-worker.js`\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config)\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://bit.ly/CRA-PWA'\n )\n })\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config)\n }\n })\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then((registration) => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing\n if (installingWorker == null) {\n return\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n )\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration)\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.')\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration)\n }\n }\n }\n }\n }\n })\n .catch((error) => {\n console.error('Error during service worker registration:', error)\n })\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl, {\n headers: { 'Service-Worker': 'script' },\n })\n .then((response) => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type')\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then((registration) => {\n registration.unregister().then(() => {\n window.location.reload()\n })\n })\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config)\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n )\n })\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready\n .then((registration) => {\n registration.unregister()\n })\n .catch((error) => {\n console.error(error.message)\n })\n }\n}\n","import React from 'react'\nimport ReactDOM from 'react-dom'\nimport './index.css'\nimport App from './App'\nimport * as serviceWorker from './serviceWorker'\n\nReactDOM.render(, document.getElementById('root'))\n\n// If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: https://bit.ly/CRA-PWA\nserviceWorker.register()\n"],"sourceRoot":""}