12345678910111213141516171819202122232425262728293031 |
- import {Link} from "react-router-dom";
- import {useState} from "react";
- import {connect} from "react-redux";
- import {actionPlaylistFindByOwner} from "../../actions";
- import {store} from "../../reducers";
- import {actionCreatePlaylist} from "../../actions";
- const Playlist = ({playlist:{_id, name}={}}) => {
- return (
- <div>
- {name !== null ? ( <div className='list1a-li'><Link to={`/myPlaylist/${_id}`}>{name}</Link></div>) : <></>}
- </div>
- )
- }
- const MyPlaylists = ({playlists={},createPlaylist}) => {
- const [p, setP] = useState ('')
- return (
- <div className='my-playlists'>
- <input placeholder='Имя плейлиста' onChange={e => setP(e.target.value)}/>
- <button disabled={p.length >= 6 && p !== "" ? false : true} onClick={()=>createPlaylist(p)}>Создать</button>
- <div className="list1a">
- {playlists.map((playlist,playlistIndex) => <Playlist key={`playlist-${playlistIndex}`} playlist={playlist}/> )}
- </div>
- </div>
- )
- }
- export const CMyPlaylists = connect(state => ({playlists: state.promise.playlistFindByOwner?.payload || []}),
- {createPlaylist:actionCreatePlaylist})(MyPlaylists)
|