import React, { PropTypes } from 'react'; import { reduxForm } from 'redux-form'; import classNames from 'classnames'; import InlineSVG from 'react-inlinesvg'; import NewFileForm from './NewFileForm'; import FileUploader from './FileUploader'; const exitUrl = require('../../../images/exit.svg'); // At some point this will probably be generalized to a generic modal // in which you can insert different content // but for now, let's just make this work class NewFileModal extends React.Component { constructor(props) { super(props); this.focusOnModal = this.focusOnModal.bind(this); } componentDidMount() { this.focusOnModal(); } focusOnModal() { this.modal.focus(); } render() { const modalClass = classNames({ 'modal': true, 'modal--reduced': !this.props.canUploadMedia }); return (
{ this.modal = element; }}>

Add File

{(() => { if (this.props.canUploadMedia) { return (

OR

); } return ''; })()}
); } } NewFileModal.propTypes = { closeModal: PropTypes.func.isRequired, canUploadMedia: PropTypes.bool.isRequired }; function validate(formProps) { const errors = {}; if (!formProps.name) { errors.name = 'Please enter a name'; } else if (!formProps.name.match(/(.+\.js$|.+\.css$|.+\.json$|.+\.txt$|.+\.csv$)/i)) { errors.name = 'File must be of type JavaScript, CSS, JSON, TXT, or CSV.'; } return errors; } export default reduxForm({ form: 'new-file', fields: ['name'], validate })(NewFileModal);