import React from 'react';
import ReactDOM from 'react-dom';
import Upload from '..';
import { Button, Icon } from '../..';

class App extends React.Component {
  uploaderRef: any;

  saveUploaderRef = ref => {
    if (!ref.typeahead) return;
    this.uploaderRef = ref.typeahead.getInstance();
  };

  onSubmit = () => {
    if (!this.uploaderRef) return;
    this.uploaderRef.startUpload();
  };

  beforeUpload(info, options) {
    console.log('beforeUpload callback : ', info, options);
    return options;
  }
  render() {
    return (
      <div>
        <Upload
          action="https://www.easy-mock.com/mock/5b713974309d0d7d107a74a3/alifd/upload"
          autoUpload={false}
          ref={this.saveUploaderRef}
          listType="image"
          beforeUpload={this.beforeUpload}
          useDataURL
        >
          <Button style={{ marginBottom: 8 }}>
            <Icon type="upload" />
            Select File
          </Button>
        </Upload>
        <br />
        <Button type="primary" onClick={this.onSubmit}>
          Upload
        </Button>
      </div>
    );
  }
}

ReactDOM.render(<App />, document.getElementById('upload-demo-8'));