media-library: upload by url janitorial

Automattic · Mar 8, 2017 · 2474f28 · 2474f28
1 parent 41b01d1
commit 2474f28
Showing 1 changed file with 41 additions and 42 deletions.
diff --git a/client/my-sites/media-library/upload-url.jsx b/client/my-sites/media-library/upload-url.jsx
@@ -1,10 +1,11 @@
 /**
  * External dependencies
  */
-import React from 'react';
+import React, { Component, PropTypes } from 'react';
 import noop from 'lodash/noop';
 import classNames from 'classnames';
 import Gridicon from 'gridicons';
+import { localize } from 'i18n-calypso';
 
 /**
  * Internal dependencies
@@ -13,68 +14,62 @@ import analytics from 'lib/analytics';
 import FormTextInput from 'components/forms/form-text-input';
 import MediaActions from 'lib/media/actions';
 
-export default React.createClass( {
-	displayName: 'MediaLibraryUploadUrl',
-
-	propTypes: {
-		site: React.PropTypes.object,
-		onAddMedia: React.PropTypes.func,
-		onClose: React.PropTypes.func,
-		className: React.PropTypes.string
-	},
-
-	getInitialState() {
-		return {
-			value: '',
-			isError: false
-		};
-	},
-
-	getDefaultProps() {
-		return {
-			onAddMedia: noop,
-			onClose: noop
-		};
-	},
-
-	upload( event ) {
-		var isError = ! event.target.checkValidity();
+class MediaLibraryUploadUrl extends Component {
+	static propTypes = {
+		className: PropTypes.string,
+		site: PropTypes.object,
+		onAddMedia: PropTypes.func,
+		onClose: PropTypes.func,
+	};
 
-		this.setState( {
-			isError: isError
-		} );
+	static defaultProps = {
+		onAddMedia: noop,
+		onClose: noop,
+	};
+
+	state = {
+		value: '',
+		isError: false,
+	};
+
+	upload = event => {
+		const isError = ! event.target.checkValidity();
+
+		this.setState( { isError } );
 
 		if ( isError || ! this.props.site ) {
 			return;
 		}
 
+		event.preventDefault();
+
 		MediaActions.clearValidationErrors( this.props.site.ID );
 		MediaActions.add( this.props.site.ID, this.state.value );
 
-		this.replaceState( this.getInitialState() );
+		this.setState( { value: '', isError: false } );
 		this.props.onAddMedia();
 		this.props.onClose();
 		analytics.mc.bumpStat( 'editor_upload_via', 'url' );
-		event.preventDefault();
-	},
+	};
 
-	onChange( event ) {
+	onChange = event => {
 		this.setState( {
+			isError: false,
 			value: event.target.value,
-			isError: false
 		} );
-	},
+	};
 
-	onKeyDown( event ) {
+	onKeyDown = event => {
 		if ( event.key !== 'Enter' ) {
 			return;
 		}
 
 		this.upload( event );
-	},
+	};
 
 	render() {
 		const classes = classNames( 'media-library__upload-url', this.props.className );
+		const { onClose, translate } = this.props;
 
 		return (
 			<form className={ classes } onSubmit={ this.upload }>
@@ -89,16 +84,20 @@ export default React.createClass( {
 					required />
 				<div className="media-library__upload-url-button-group">
 					<button type="submit" className="button is-primary">
-						{ this.translate( 'Upload', { context: 'verb' } ) }
+						{ translate( 'Upload', { context: 'verb' } ) }
 					</button>
-					<button type="button" className="media-library__upload-url-cancel" onClick={ this.props.onClose }>
+
+					<button type="button" className="media-library__upload-url-cancel" onClick={ onClose }>
 						<span className="screen-reader-text">
-							{ this.translate( 'Cancel' ) }
+							{ translate( 'Cancel' ) }
 						</span>
 						<Gridicon icon="cross" />
 					</button>
 				</div>
 			</form>
 		);
 	}
-} );
+}
+
+export default localize( MediaLibraryUploadUrl );
+