music-player/src/pages/trackdropzone.js

import {useCallback} from "react";
import {store} from "../reducers";
import {actionFullUploadTracks} from "../actions";
import {useDropzone} from "react-dropzone";
import {connect} from "react-redux";

function TrackDropZone({ onLoad }) {
    const onDrop = useCallback((acceptedFiles) => {
        // Do something with the files
        onLoad(acceptedFiles[0]);
    }, []);
    const { getRootProps, getInputProps, isDragActive } = useDropzone({ onDrop });

    return (
        <div {...getRootProps()}>
            <input {...getInputProps()} />
            {isDragActive ? (
                <p>Перетащите файл сюда ...</p>
            ) : (
                <p>Для добавления трэка перетащите файлы в плейлист</p>

            )}
        </div>
    );

}


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