merge master
[arvados-workbench2.git] / src / views-components / file-uploader / file-uploader.tsx
1 // Copyright (C) The Arvados Authors. All rights reserved.
2 //
3 // SPDX-License-Identifier: AGPL-3.0
4
5 import * as React from 'react';
6 import { FileUpload } from '~/components/file-upload/file-upload';
7 import { connect } from 'react-redux';
8 import { RootState } from '~/store/store';
9 import { FileUploadProps } from '../../components/file-upload/file-upload';
10 import { Dispatch } from 'redux';
11 import { fileUploaderActions } from '~/store/file-uploader/file-uploader-actions';
12 import { WrappedFieldProps } from 'redux-form';
13 import { Typography } from '@material-ui/core';
14
15 export type FileUploaderProps = Pick<FileUploadProps, 'disabled' | 'onDrop'>;
16
17 const mapStateToProps = (state: RootState, { disabled }: FileUploaderProps): Pick<FileUploadProps, 'files' | 'disabled'> => ({
18     disabled,
19     files: state.fileUploader,
20 });
21
22 const mapDispatchToProps = (dispatch: Dispatch, { onDrop }: FileUploaderProps): Pick<FileUploadProps, 'onDrop'> => ({
23     onDrop: files => {
24         dispatch(fileUploaderActions.SET_UPLOAD_FILES(files));
25         onDrop(files);
26     },
27 });
28
29 export const FileUploader = connect(mapStateToProps, mapDispatchToProps)(FileUpload);
30
31 export const FileUploaderField = (props: WrappedFieldProps & { label?: string }) =>
32     <div>
33         <Typography variant='caption'>{props.label}</Typography>
34         <FileUploader disabled={props.meta.submitting} onDrop={props.input.onChange} />
35     </div>;