Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 | 1x 1x 1x 1x 1x 1x 2x 2x 2x 1x 1x 1x 1x 1x 1x 1x 1x 1x | import React from 'react'; import PropTypes from 'prop-types'; import { compose } from 'redux'; import { connect } from 'react-redux'; import { sagaInjector } from '@source4society/scepter-ui-utilities'; import { isEmpty, valueOrDefault, eitherOf } from '@source4society/scepter-utility-lib'; import { uploadToS3 } from './action'; import saga from './saga'; const fileInputRef = { input: null }; const S3FileUploadButton = ({ children, name, id, fileInputVisibility, fileSelectedHandler, className, signedUrl, accept, disabled, buttonProps, inputProps }) => { const changeHandler = makeChangeHandler(fileSelectedHandler, signedUrl); const refCallback = makeRefCallback(fileInputRef); const clickHandler = makeClickHandler(fileInputRef); return ( <button className={className} onClick={clickHandler} disabled={eitherOf(isEmpty(signedUrl), disabled)} {...buttonProps}> {children} <input type="file" ref={refCallback} name={name} id={id} onChange={changeHandler} style={{ display: fileInputVisibility }} accept={accept} {...inputProps} /> </button> ); }; export const makeClickHandler = (superScopedObject) => () => superScopedObject.input.click(); export const makeChangeHandler = (fileSelectedHandler, signedUrl) => () => fileSelectedHandler(signedUrl); export const makeRefCallback = (superScopedObject) => (input) => { const referenceObject = superScopedObject; referenceObject.input = input; }; S3FileUploadButton.defaultProps = { fileInputVisibility: 'none', className: '', accept: 'image/*', disabled: false, buttonProps: {}, inputProps: {}, }; S3FileUploadButton.propTypes = { children: PropTypes.any, fileInputVisibility: PropTypes.string, fileSelectedHandler: PropTypes.func, name: PropTypes.string.isRequired, id: PropTypes.string.isRequired, className: PropTypes.string, signedUrl: PropTypes.string.isRequired, accept: PropTypes.string, disabled: PropTypes.bool, buttonProps: PropTypes.object, inputProps: PropTypes.object, }; export const mapDispatchToProps = (dispatch) => ({ fileSelectedHandler: (signedUrl, injectedFileInput) => { const fileInput = valueOrDefault(injectedFileInput, fileInputRef && fileInputRef.input); return dispatch(uploadToS3(signedUrl, fileInput)); }, }); const withConnect = connect(null, mapDispatchToProps); const withSaga = sagaInjector({ key: 'uploadToS3Button', saga }); export { S3FileUploadButton }; export default compose( withConnect, withSaga, )(S3FileUploadButton); |