import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _extends from "@babel/runtime/helpers/extends";
import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import _regeneratorRuntime from "@babel/runtime/regenerator";
import React, { useContext, useMemo, useEffect, useCallback } from 'react';
import { findDOMNode } from 'react-dom';
import { List, AutoSizer } from 'react-virtualized';
import { observer } from 'mobx-react-lite';
import { Draggable, Droppable } from 'react-beautiful-dnd';
import isFunction from 'lodash/isFunction'; // import noop from 'lodash/noop';

import { Col } from '../../../es/grid';
import classnames from 'classnames';
import QuoteItem from './QuoteItem';
import DataSet from '../data-set';
import BoardContext from './BoardContext';
import { ViewField } from './enum';
import Button from '../button';
import { FuncType } from '../button/interface';
export var getBackgroundColor = function getBackgroundColor(isDraggingOver, isDraggingFrom) {
  if (isDraggingOver) {
    return 'rgb(222, 235, 255)';
  }

  if (isDraggingFrom) {
    return "rgb(255, 250, 230)";
  }

  return "white";
};
export var getDraggingStyle = function getDraggingStyle(isDraggingOver, isDraggingFrom) {
  if (isDraggingOver) {
    return {
      background: 'rgba(8,64,248,0.02)',
      border: '1px dashed #82ACFF',
      borderRadius: '2px'
    };
  }

  if (isDraggingFrom) {
    return {
      background: 'rgba(8,64,248,0.02)',
      border: '1px dashed #82ACFF',
      borderRadius: '2px'
    };
  }

  return {
    background: 'white'
  };
}; // Using a higher order function so that we can look up the quotes data to retrieve
// our quote from within the rowRender function

var getRowRender = function getRowRender(quotes, columnId, prefixCls, viewProps, listDragging, command, renderCommand, dataSet, kanbanDS, displayFields, draggableProps, isDragDropDisabled) {
  return function (_ref) {
    var index = _ref.index,
        style = _ref.style;
    var quote = quotes.get(index);
    var isLast = quotes && quotes.length === index + 1; // We are rendering an extra item for the placeholder
    // Do do this we increased our data set size to include one 'fake' item

    if (!quote) {
      return null;
    } // Faking some nice spacing around the items


    var patchedStyle = _objectSpread(_objectSpread({}, style), {}, {
      left: Number(style.left) + 8,
      top: Number(style.top) + 8,
      width: "calc(".concat(style.width, " - ").concat(8 * 2, "px)"),
      height: Number(style.height) - (isLast && !listDragging ? 46 : 8)
    });

    var btnStyle = _objectSpread(_objectSpread({}, style), {}, {
      left: Number(style.left) + 8,
      top: Number(style.top) + Number(style.height) - 28,
      width: "calc(".concat(style.width, " - ").concat(8 * 2, "px)"),
      maxWidth: 'unset',
      height: 28
    });

    var restDraggableProps = function restDraggableProps() {
      if (isFunction(draggableProps)) {
        return draggableProps({
          columnDS: quotes,
          dataSet: dataSet
        });
      }

      return draggableProps;
    };

    return /*#__PURE__*/React.createElement(Draggable, _extends({
      draggableId: String(quote.id),
      index: index,
      key: quote.id,
      isDragDisabled: isDragDropDisabled && true
    }, restDraggableProps()), function (provided, snapshot) {
      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(QuoteItem, {
        command: command,
        renderCommand: renderCommand,
        provided: provided,
        quote: quote,
        isDragging: snapshot.isDragging,
        style: patchedStyle,
        prefixCls: prefixCls,
        viewProps: viewProps,
        displayFields: displayFields,
        index: index,
        dataSet: quotes
      }), isLast && (kanbanDS.getState("".concat(columnId, "_totalCount")) || quotes.totalCount) > quotes.length ? /*#__PURE__*/React.createElement(Button, {
        onClick: function () {
          var _onClick = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
            return _regeneratorRuntime.wrap(function _callee$(_context) {
              while (1) {
                switch (_context.prev = _context.next) {
                  case 0:
                    _context.next = 2;
                    return quotes.queryMore(quotes.currentPage + 1, undefined);

                  case 2:
                    kanbanDS.setState("".concat(columnId, "_totalCount"), undefined);

                  case 3:
                  case "end":
                    return _context.stop();
                }
              }
            }, _callee);
          }));

          function onClick() {
            return _onClick.apply(this, arguments);
          }

          return onClick;
        }(),
        style: _objectSpread(_objectSpread({}, btnStyle), {}, {
          maxWidth: 'unset'
        }),
        hidden: listDragging,
        funcType: FuncType.flat
      }, "\u52A0\u8F7D\u66F4\u591A") : null);
    });
  };
};

var KanbanColumn = function KanbanColumn(props) {
  var columnId = props.columnId,
      _props$quotes = props.quotes,
      quotes = _props$quotes === void 0 ? [] : _props$quotes,
      prefixCls = props.prefixCls,
      className = props.className,
      header = props.header,
      style = props.style,
      kanbanProps = props.kanbanProps,
      kanbanDS = props.kanbanDS,
      groupingBy = props.groupingBy;
  var droppableProps = kanbanProps.droppableProps,
      draggableProps = kanbanProps.draggableProps,
      isDragDropDisabled = kanbanProps.isDragDropDisabled;

  var _useContext = useContext(BoardContext),
      displayFields = _useContext.displayFields,
      customizedDS = _useContext.customizedDS,
      command = _useContext.command,
      renderCommand = _useContext.renderCommand,
      dataSet = _useContext.dataSet;

  var viewProps = useMemo(function () {
    return customizedDS.current.get(ViewField.viewProps) || {};
  }, [customizedDS.current]);
  var columnDS = useMemo(function () {
    return new DataSet(_objectSpread(_objectSpread({}, dataSet.props), {}, {
      queryParameter: _defineProperty({}, groupingBy, columnId === '_empty' ? 'null' : columnId),
      data: quotes.slice(),
      autoQuery: false
    }, kanbanProps.columnDsProps));
  }, [quotes]);
  var defaultRowHeight = useMemo(function () {
    return (viewProps[ViewField.displayFields] ? viewProps[ViewField.displayFields].length : 1) * 24 + 30 + 24;
  }, [viewProps[ViewField.displayFields] && viewProps[ViewField.displayFields].length]);
  var totalCount = useMemo(function () {
    return Math.max(kanbanDS.getState("".concat(columnId, "_totalCount")) || 0, columnDS.totalCount);
  }, [columnId, columnDS.totalCount]);
  useEffect(function () {
    if (kanbanDS) {
      kanbanDS.setState("".concat(columnId.toString().toLocaleUpperCase(), "_COLUMNDS"), columnDS);
    }
  }, [kanbanDS, columnDS]);
  var restDroppableProps = useCallback(function () {
    if (isFunction(droppableProps)) {
      return droppableProps({
        columnDS: columnDS,
        dataSet: dataSet
      });
    }

    return droppableProps;
  }, []);
  var cls = classnames("".concat(prefixCls, "-column-container"), {}, className);
  return /*#__PURE__*/React.createElement(Col, {
    span: viewProps[ViewField.cardWidth] || 6,
    "data-key": viewProps[ViewField.displayFields] && viewProps[ViewField.displayFields].length,
    style: style,
    className: cls
  }, /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefixCls, "-column-header")
  }, /*#__PURE__*/React.createElement("span", null, header), /*#__PURE__*/React.createElement("span", {
    className: "".concat(prefixCls, "-column-header-count")
  }, "(", columnDS ? totalCount : 0, ")")), /*#__PURE__*/React.createElement(Droppable, _extends({
    droppableId: columnId.toString(),
    mode: "virtual",
    renderClone: function renderClone(provided, snapshot, rubric) {
      return /*#__PURE__*/React.createElement(QuoteItem, {
        prefixCls: prefixCls,
        provided: provided,
        isDragging: snapshot.isDragging,
        quote: columnDS.get(rubric.source.index),
        style: {
          margin: 0
        },
        viewProps: viewProps,
        displayFields: displayFields,
        command: command,
        renderCommand: renderCommand,
        dataSet: columnDS
      });
    },
    isDropDisabled: isDragDropDisabled && true
  }, restDroppableProps()), function (droppableProvided, snapshot) {
    var itemCount = columnDS ? snapshot.isUsingPlaceholder ? columnDS.length + 1 : columnDS.length : 0;
    return /*#__PURE__*/React.createElement(AutoSizer, {
      disableHeight: true
    }, function (_ref2) {
      var width = _ref2.width;
      return /*#__PURE__*/React.createElement(List, {
        className: "".concat(prefixCls, "-column-list"),
        height: viewProps.viewHeight || 366,
        rowCount: itemCount,
        rowHeight: function rowHeight(_ref3) {
          var index = _ref3.index;
          return itemCount - 1 === index ? defaultRowHeight + 36 : defaultRowHeight;
        },
        width: width,
        ref: function ref(_ref4) {
          // react-virtualized has no way to get the list's ref that I can so
          // So we use the `ReactDOM.findDOMNode(ref)` escape hatch to get the ref
          // listRef = ref;
          if (_ref4) {
            _ref4.recomputeRowHeights(); // columnDS.setState('__REF__', ref);
            // eslint-disable-next-line react/no-find-dom-node


            var nodeRef = findDOMNode(_ref4);

            if (nodeRef instanceof HTMLElement) {
              droppableProvided.innerRef(nodeRef);
            }
          }
        },
        style: getDraggingStyle(snapshot.isDraggingOver, Boolean(snapshot.draggingFromThisWith)),
        // style={{
        //   backgroundColor: getBackgroundColor(
        //     snapshot.isDraggingOver,
        //     Boolean(snapshot.draggingFromThisWith),
        //   ),
        //   transition: 'background-color 0.2s ease',
        // }}
        rowRenderer: columnDS ? getRowRender(columnDS, columnId, prefixCls, viewProps, snapshot.isDraggingOver || Boolean(snapshot.draggingFromThisWith), command, renderCommand, dataSet, kanbanDS, displayFields, draggableProps, isDragDropDisabled) : null
      });
    });
  }));
};

KanbanColumn.displayName = 'KanbanColumn';
export default observer(KanbanColumn);
//# sourceMappingURL=KanbanColumn.js.map
