diff --git a/resources/i18n/pt.json b/resources/i18n/pt.json index f1c1fcf09..eb8bf691b 100644 --- a/resources/i18n/pt.json +++ b/resources/i18n/pt.json @@ -22,8 +22,9 @@ }, "actions": { "addToQueue": "Adicionar à fila", - "playNow": "Tocar agora", "addToPlaylist": "Adicionar à playlist", + "playNow": "Tocar agora", + "playNext": "Toca a seguir", "shuffleAll": "Aleatório", "download": "Baixar" } diff --git a/ui/package-lock.json b/ui/package-lock.json index 7be6ca0b7..d67593035 100644 --- a/ui/package-lock.json +++ b/ui/package-lock.json @@ -14031,6 +14031,13 @@ "tough-cookie": "~2.5.0", "tunnel-agent": "^0.6.0", "uuid": "^3.3.2" + }, + "dependencies": { + "uuid": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", + "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==" + } } }, "request-promise-core": { @@ -14842,6 +14849,13 @@ "faye-websocket": "^0.10.0", "uuid": "^3.4.0", "websocket-driver": "0.6.5" + }, + "dependencies": { + "uuid": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", + "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==" + } } }, "sockjs-client": { @@ -16135,9 +16149,9 @@ "integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM=" }, "uuid": { - "version": "3.4.0", - "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", - "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==" + "version": "8.3.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.0.tgz", + "integrity": "sha512-fX6Z5o4m6XsXBdli9g7DtWgAx+osMsRRZFKma1mIUsLCz6vRvv+pz5VNbyu9UEDzpMWulZfvpgb/cmDXVulYFQ==" }, "v8-compile-cache": { "version": "2.1.1", @@ -16685,6 +16699,13 @@ "requires": { "ansi-colors": "^3.0.0", "uuid": "^3.3.2" + }, + "dependencies": { + "uuid": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", + "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==" + } } }, "webpack-manifest-plugin": { diff --git a/ui/package.json b/ui/package.json index 4877cc246..cb08dfdab 100644 --- a/ui/package.json +++ b/ui/package.json @@ -17,11 +17,13 @@ "react-dom": "^16.13.1", "react-drag-listview": "^0.1.7", "react-ga": "^3.1.2", + "react-icons": "^3.11.0", "react-image-lightbox": "^5.1.1", "react-jinke-music-player": "^4.18.2", "react-measure": "^2.5.2", "react-redux": "^7.2.1", - "react-scripts": "^3.4.3" + "react-scripts": "^3.4.3", + "uuid": "^8.3.0" }, "devDependencies": { "@testing-library/jest-dom": "^5.11.4", diff --git a/ui/src/album/AlbumActions.js b/ui/src/album/AlbumActions.js index f67ad1eeb..b9547da90 100644 --- a/ui/src/album/AlbumActions.js +++ b/ui/src/album/AlbumActions.js @@ -10,8 +10,8 @@ import { import PlayArrowIcon from '@material-ui/icons/PlayArrow' import ShuffleIcon from '@material-ui/icons/Shuffle' import CloudDownloadOutlinedIcon from '@material-ui/icons/CloudDownloadOutlined' -import AddToQueueIcon from '@material-ui/icons/AddToQueue' -import { addTracks, playTracks, shuffleTracks } from '../audioplayer' +import { RiPlayListAddFill, RiPlayList2Fill } from 'react-icons/ri' +import { playNext, addTracks, playTracks, shuffleTracks } from '../audioplayer' import subsonic from '../subsonic' const AlbumActions = ({ className, ids, data, record, ...rest }) => { @@ -22,6 +22,10 @@ const AlbumActions = ({ className, ids, data, record, ...rest }) => { dispatch(playTracks(data, ids)) }, [dispatch, data, ids]) + const handlePlayNext = React.useCallback(() => { + dispatch(playNext(data, ids)) + }, [dispatch, data, ids]) + const handlePlayLater = React.useCallback(() => { dispatch(addTracks(data, ids)) }, [dispatch, data, ids]) @@ -48,11 +52,17 @@ const AlbumActions = ({ className, ids, data, record, ...rest }) => { > + + ) } +AddToQueueButton.defaultProps = { + action: addTracks, + label: 'resources.song.actions.addToQueue', + icon: , +} + export default AddToQueueButton diff --git a/ui/src/song/SongBulkActions.js b/ui/src/song/SongBulkActions.js index ac60363e1..34e4284bb 100644 --- a/ui/src/song/SongBulkActions.js +++ b/ui/src/song/SongBulkActions.js @@ -1,10 +1,18 @@ import React, { Fragment } from 'react' import AddToQueueButton from './AddToQueueButton' import AddToPlaylistButton from './AddToPlaylistButton' +import { RiPlayList2Fill } from 'react-icons/ri' +import { playNext } from '../audioplayer' export const SongBulkActions = (props) => { return ( + } + />