p5.js-web-editor/client/modules/IDE/components/NewFolderForm.jsx

68 lines
1.8 KiB
React
Raw Normal View History

import PropTypes from 'prop-types';
import React from 'react';
import { withTranslation } from 'react-i18next';
cool to share some of this code between client and server Squashed commit of the following: commit fb5e82cea930b011792983c7d1cc9f6ecacc7dd4 Author: Cassie Tarakajian <ctarakajian@gmail.com> Date: Wed Nov 16 12:28:10 2016 -0500 add server side rendering, untested commit 5c60fb30c46ea49a8d9a0ecb56f39ec778464a8b Author: Cassie Tarakajian <ctarakajian@gmail.com> Date: Tue Nov 15 18:26:06 2016 -0500 add redux-form bandage post react update, should probably update to redux-form 6 at some point commit 057b5871e7137179abc93f7821a9690f0ea52c92 Author: Cassie Tarakajian <ctarakajian@gmail.com> Date: Tue Nov 15 16:30:09 2016 -0500 remove passing jsFiles and cssFiles to PreviewFrame, fix rendering bug commit 88c56fd36d3a8d88902c79642171988ce37825f2 Author: Cassie Tarakajian <ctarakajian@gmail.com> Date: Tue Nov 15 16:21:59 2016 -0500 code cleanup, untested commit 82e5dcf8bca461892f1daf06d38f1eaebe72983f Author: Cassie Tarakajian <ctarakajian@gmail.com> Date: Tue Nov 15 15:53:50 2016 -0500 update react and react router, fix a few bugs in rendering code, add ability to parse inline js and css commit e02f4b67803ea45328eff4e53659222f3149964c Author: Cassie Tarakajian <ctarakajian@gmail.com> Date: Tue Nov 15 14:43:38 2016 -0500 add almost full code to create preview html correctly, untested commit 12f61b2a1aed4607fab24d01572b647ca6210262 Author: Cassie Tarakajian <ctarakajian@gmail.com> Date: Wed Nov 2 17:09:26 2016 -0400 refactor some of the preview html generation code commit 111825846703d5c8959cb18795a3aadb7ebe505c Author: Cassie Tarakajian <ctarakajian@gmail.com> Date: Wed Nov 2 11:06:36 2016 -0400 add comments as plan of action commit 1cc2cf5203674732b4057382f1937de38b687078 Author: Cassie Tarakajian <ctarakajian@gmail.com> Date: Thu Oct 27 19:34:55 2016 -0400 add href parsing commit e67189298cda9b70645f454ecd541a363980f0e4 Author: Cassie Tarakajian <ctarakajian@gmail.com> Date: Thu Oct 27 10:48:36 2016 -0400 continue parsing html commit 1458fb940a15a3dc5d74890211a3073e920b84b8 Author: Cassie Tarakajian <ctarakajian@gmail.com> Date: Wed Oct 26 17:40:31 2016 -0400 start to add html parsing
2016-11-16 18:12:36 +00:00
import { domOnlyProps } from '../../../utils/reduxFormUtils';
2016-08-30 03:23:10 +00:00
2020-04-26 09:52:12 +00:00
import Button from '../../../common/Button';
2016-08-30 03:23:10 +00:00
class NewFolderForm extends React.Component {
constructor(props) {
super(props);
this.createFolder = this.props.createFolder.bind(this);
}
componentDidMount() {
this.fileName.focus();
}
2016-08-30 03:23:10 +00:00
render() {
const {
2019-08-22 20:47:22 +00:00
fields: { name }, handleSubmit
} = this.props;
2016-08-30 03:23:10 +00:00
return (
<form
className="new-folder-form"
onSubmit={(data) => {
handleSubmit(this.createFolder)(data);
}}
>
<div className="new-folder-form__input-wrapper">
<label className="new-folder-form__name-label" htmlFor="name">Name:</label>
<input
className="new-folder-form__name-input"
id="name"
type="text"
2020-04-06 16:46:17 +00:00
maxLength="128"
placeholder={this.props.t('NewFolderForm.Placeholder')}
ref={(element) => { this.fileName = element; }}
{...domOnlyProps(name)}
/>
2020-04-26 09:52:12 +00:00
<Button
type="submit"
>{this.props.t('NewFolderForm.AddFolderSubmit')}
2020-04-26 09:52:12 +00:00
</Button>
</div>
{name.touched && name.error && <span className="form-error">{name.error}</span>}
2016-08-30 03:23:10 +00:00
</form>
);
}
}
NewFolderForm.propTypes = {
fields: PropTypes.shape({
2016-08-30 03:26:45 +00:00
name: PropTypes.object.isRequired
2016-08-30 03:23:10 +00:00
}).isRequired,
handleSubmit: PropTypes.func.isRequired,
createFolder: PropTypes.func.isRequired,
closeModal: PropTypes.func.isRequired,
submitting: PropTypes.bool,
pristine: PropTypes.bool,
t: PropTypes.func.isRequired
};
NewFolderForm.defaultProps = {
submitting: false,
pristine: true
2016-08-30 03:23:10 +00:00
};
export default withTranslation()(NewFolderForm);