import _extends from "@babel/runtime/helpers/extends";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
import _inherits from "@babel/runtime/helpers/inherits";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import React, { PureComponent } from 'react';
import { withTheme } from '@material-ui/core/styles';
import PropTypes from 'prop-types';
import { style } from 'typestyle';
import { DropTarget } from 'react-dnd';
import { NativeTypes } from 'react-dnd-html5-backend';
import includes from 'lodash/includes';
import FileCard from './FileCard';
import DragTypes from '../../utils/dragTypes';
import { compose } from 'redux';
var cn = {
  root: style({
    borderWidth: 0,
    paddingTop: 16,
    paddingRight: 0,
    paddingBottom: 80,
    paddingLeft: 16
  })
};

var getCn = function getCn(props) {
  return {
    dir: style({
      display: 'flex',
      flexDirection: 'column',
      alignItems: 'stretch',
      justifyContent: 'space-around',
      boxSizing: 'border-box',
      marginTop: 4,
      marginRight: 8,
      borderWidth: 4,
      borderRadius: 2,
      height: props.isDirOpened(props.dir, 'auto', 40),
      paddingBottom: props.isDirOpened(props.dir, props.theme.spacing.unit * 2, 0),
      paddingLeft: props.isDirOpened(props.dir, props.theme.spacing.unit * 2, 0),
      borderStyle: props.isOver && !includes(props.dir.files, props.dragSource) ? 'dashed' : 'solid',
      borderColor: props.theme.palette.primary.main,
      transition: props.theme.transitions.create(['margin', 'padding-bottom', 'border'])
    }),
    closed: style({
      cursor: 'pointer',
      color: props.theme.palette.text.secondary,
      paddingLeft: props.theme.spacing.unit * 2
    }),
    closer: style({
      cursor: 'pointer',
      marginLeft: -props.theme.spacing.unit * 2,
      backgroundColor: props.theme.palette.primary.main
    }),
    closerLabel: style({
      fontWeight: 'bold',
      paddingLeft: props.theme.spacing.unit * 2,
      color: props.theme.palette.primary.contrastText
    })
  };
};

var spec = {
  drop: function drop(props, monitor) {
    if (monitor.getDropResult()) {
      return;
    }

    var _monitor$getItem = monitor.getItem(),
        files = _monitor$getItem.files;

    switch (monitor.getItemType()) {
      case DragTypes.File:
        files.filter(function (file) {
          return !includes(props.dir.files, file);
        }).forEach(function (file) {
          return props.handleFileMove(file, props.dir);
        });
        break;

      case NativeTypes.FILE:
        props.handleNativeDrop(files, props.dir);
        break;
    }

    return {};
  }
};

var collect = function collect(connect, monitor) {
  return {
    connectDropTarget: connect.dropTarget(),
    isOver: monitor.isOver({
      shallow: true
    }),
    dragSource: monitor.getItem()
  };
};

var DirCard =
/*#__PURE__*/
function (_PureComponent) {
  _inherits(DirCard, _PureComponent);

  function DirCard() {
    _classCallCheck(this, DirCard);

    return _possibleConstructorReturn(this, _getPrototypeOf(DirCard).apply(this, arguments));
  }

  _createClass(DirCard, [{
    key: "render",
    value: function render() {
      var dcn = getCn(this.props);
      var _this$props = this.props,
          isRoot = _this$props.isRoot,
          isDirOpened = _this$props.isDirOpened,
          handleDirToggle = _this$props.handleDirToggle,
          connectDropTarget = _this$props.connectDropTarget;
      var cd = this.props.dir;
      var transfer = {
        isDirOpened: this.props.isDirOpened,
        handleFileSelect: this.props.handleFileSelect,
        handleDirToggle: this.props.handleDirToggle,
        handleFileMove: this.props.handleFileMove,
        handleNativeDrop: this.props.handleNativeDrop,
        openFileDialog: this.props.openFileDialog
      };
      return connectDropTarget(React.createElement("div", {
        className: isRoot ? cn.root : dcn.dir
      }, isDirOpened(cd, [].concat(isRoot ? null : React.createElement(DirCloser, {
        key: "closer",
        classes: dcn,
        onClick: function onClick() {
          return handleDirToggle(cd);
        }
      }), cd.dirs.map(function (dir) {
        return React.createElement(ConnectedDirCard, _extends({
          key: dir.path,
          dir: dir
        }, transfer));
      }), cd.files.map(function (file) {
        return React.createElement(FileCard, _extends({
          key: file.name,
          file: file
        }, transfer));
      })), React.createElement("div", {
        className: dcn.closed,
        onClick: function onClick() {
          return handleDirToggle(cd);
        }
      }, cd.path))));
    }
  }]);

  return DirCard;
}(PureComponent);

_defineProperty(DirCard, "propTypes", {
  theme: PropTypes.object.isRequired,
  dir: PropTypes.object.isRequired,
  isDirOpened: PropTypes.func.isRequired,
  handleFileSelect: PropTypes.func.isRequired,
  handleDirToggle: PropTypes.func.isRequired,
  handleFileMove: PropTypes.func.isRequired,
  handleNativeDrop: PropTypes.func.isRequired,
  isRoot: PropTypes.bool,
  openFileDialog: PropTypes.func.isRequired,
  connectDropTarget: PropTypes.func.isRequired,
  isOver: PropTypes.bool.isRequired,
  dragSource: PropTypes.object
});

_defineProperty(DirCard, "defaultProps", {
  isRoot: false
});

var ConnectedDirCard = compose(withTheme(), DropTarget([DragTypes.File, NativeTypes.FILE], spec, collect))(DirCard);
export default ConnectedDirCard;
export var DirCloser = withTheme()(function (props) {
  return React.createElement("div", {
    className: props.classes.closer,
    onClick: props.onClick
  }, React.createElement("span", {
    className: props.classes.closerLabel
  }, "../"));
});
DirCloser.propTypes = {
  classes: PropTypes.object.isRequired,
  onClick: PropTypes.func.isRequired
};