import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Button } from '@redux-devtools/ui';
import { TiUpload } from 'react-icons/ti';
import { importState } from '../../actions';
class ImportButton extends Component {
  shouldComponentUpdate() {
    return false;
  }
  mapRef = node => {
    this.fileInput = node;
  };
  handleImport = () => {
    this.fileInput.click();
  };
  handleImportFile = e => {
    const file = e.target.files[0];
    const reader = new FileReader();
    reader.onload = () => {
      this.props.importState(reader.result);
    };
    reader.readAsText(file);
    e.target.value = '';
  };
  render() {
    return /*#__PURE__*/React.createElement(Button, {
      title: "Import from a file",
      onClick: this.handleImport
    }, /*#__PURE__*/React.createElement(TiUpload, null), /*#__PURE__*/React.createElement("input", {
      type: "file",
      ref: this.mapRef,
      style: {
        display: 'none'
      },
      onChange: this.handleImportFile
    }));
  }
}
const actionCreators = {
  importState
};
export default connect(null, actionCreators)(ImportButton);