UploadButton using hooks

1 files changed, 16 insertions, 21 deletions

diff --git a/vnext/src/components/UploadButton.js b/vnext/src/components/UploadButton.js
index 5dfa7a1d..115ff32e 100644
--- a/vnext/src/components/UploadButton.js
+++ b/vnext/src/components/UploadButton.js
@@ -3,32 +3,27 @@ import PropTypes from 'prop-types';
 
 import Icon from './Icon';
 
-export default class UploadButton extends React.Component {
-    constructor(props) {
-        super(props);
-    }
-    openfile = () => {
-        const input = this.props.inputRef.current;
-        if (this.props.value) {
-            this.props.onChange('');
+export default function UploadButton(props) {
+    let openfile = () => {
+        const input = props.inputRef.current;
+        if (props.value) {
+            props.onChange('');
         } else {
             input.click();
         }
     }
-    attachmentChanged = (event) => {
-        this.props.onChange(event.target.value);
-    }
-    render() {
-        return (
-            <div style={this.props.value ? activeStyle : inactiveStyle}
-                onClick={this.openfile}>
-                <Icon name="ei-camera" size="s" />
-                <input type="file" accept="image/jpeg,image/png" onClick={e => e.stopPropagation()}
-                    style={{ display: 'none' }} ref={this.props.inputRef} value={this.props.value}
-                    onChange={this.attachmentChanged} />
-            </div>
-        );
+    let attachmentChanged = (event) => {
+        props.onChange(event.target.value);
     }
+    return (
+        <div style={props.value ? activeStyle : inactiveStyle}
+            onClick={openfile}>
+            <Icon name="ei-camera" size="s" />
+            <input type="file" accept="image/jpeg,image/png" onClick={e => e.stopPropagation()}
+                style={{ display: 'none' }} ref={props.inputRef} value={props.value}
+                onChange={attachmentChanged} />
+        </div>
+    );
 }
 
 UploadButton.propTypes = {