12345678910111213141516171819202122232425262728293031323334 |
- import play from '../play.svg'
- import pause from '../pause.svg'
- import {actionTrackPlay,actionTrackStop,actionSetPlaylist} from "../reducers";
- import {connect} from "react-redux";
- export const Track = ({player:{isPlaying,playlist,playlistIndex}={},
- playlistP,
- track={}, trackIndex=0,
- trackStop,setPlaylist}) => {
- const {originalFileName} = track
- return (
- <div className='Tracks'>
- {!isPlaying || playlist[playlistIndex]._id !== track._id ?
- (<button onClick={() => {
- setPlaylist(playlistP,trackIndex,track);
- }}>
- <img src={play} alt='play'/>
- </button>) : (<button onClick={() => trackStop()}>
- <img src={pause} alt='pause'/>
- </button>)}
- <span>{originalFileName}</span>
- </div>
- )
- }
- export const CTrack = connect(state => ({playlistP: state.promise.playlistById?.payload?.tracks || [], player: state.player}),
- {trackPlay: actionTrackPlay, trackStop: actionTrackStop,setPlaylist:actionSetPlaylist})(Track)
|