music-player/src/pages/tools/trackdropzone.js

import {useCallback} from "react";
import {useDropzone} from "react-dropzone";
import {connect} from "react-redux";
import {actionFullUploadTrack} from "../../actions/no-playlist-track-actions";


function TrackDropZone({ onLoad, children }) {
    const onDrop = useCallback((acceptedFiles) => {
        // Do something with the files
        onLoad(acceptedFiles);
    }, []);
    const { getRootProps, isDragActive } = useDropzone({ onDrop });
    return (
        <div {...getRootProps()}>
            {isDragActive ? (
                <p>Перетащите файл сюда ...</p>
            ) : (
                <p>Для добавления трэка перетащите файлы в плейлист</p>
            )}
            {children}
        </div>
    );

}

export const CTrackDropZone = connect (null, {onLoad: actionFullUploadTrack}) (TrackDropZone)