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 _inherits from 'babel-runtime/helpers/inherits';
import React, { Component } from "react";
import { Tabs } from 'antd';
import { DragSource, DropTarget } from 'react-dnd';
// Drag & Drop node

var TabNode = function (_Component) {
    _inherits(TabNode, _Component);

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

        return _possibleConstructorReturn(this, (TabNode.__proto__ || Object.getPrototypeOf(TabNode)).apply(this, arguments));
    }

    _createClass(TabNode, [{
        key: 'render',
        value: function render() {
            var _props = this.props,
                connectDragSource = _props.connectDragSource,
                connectDropTarget = _props.connectDropTarget,
                children = _props.children;

            return connectDragSource(connectDropTarget(children));
        }
    }]);

    return TabNode;
}(Component);

var cardTarget = {
    drop: function drop(props, monitor) {
        var dragKey = monitor.getItem().index;
        var hoverKey = props.index;
        if (dragKey === hoverKey) {
            return;
        }
        props.moveTabNode(dragKey, hoverKey);
        monitor.getItem().index = hoverKey;
    }
};
var cardSource = {
    beginDrag: function beginDrag(props) {
        return {
            id: props.id,
            index: props.index
        };
    }
};
var WrapTabNode = DropTarget('DND_NODE', cardTarget, function (connect) {
    return {
        connectDropTarget: connect.dropTarget()
    };
})(DragSource('DND_NODE', cardSource, function (connect, monitor) {
    return {
        connectDragSource: connect.dragSource(),
        isDragging: monitor.isDragging()
    };
})(TabNode));
export var DraggableTabs = function (_React$Component) {
    _inherits(DraggableTabs, _React$Component);

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

        var _this2 = _possibleConstructorReturn(this, (DraggableTabs.__proto__ || Object.getPrototypeOf(DraggableTabs)).apply(this, arguments));

        _this2.state = {
            order: []
        };
        _this2.moveTabNode = function (dragKey, hoverKey) {
            var newOrder = _this2.state.order.slice();
            var children = _this2.props.children;

            React.Children.forEach(children, function (c) {
                if (newOrder.indexOf(c.key) === -1) {
                    newOrder.push(c.key);
                }
            });
            var dragIndex = newOrder.indexOf(dragKey);
            var hoverIndex = newOrder.indexOf(hoverKey);
            newOrder.splice(dragIndex, 1);
            newOrder.splice(hoverIndex, 0, dragKey);
            _this2.setState({
                order: newOrder
            });
        };
        _this2.renderTabBar = function (props, DefaultTabBar) {
            return React.createElement(
                DefaultTabBar,
                props,
                function (node) {
                    return React.createElement(
                        WrapTabNode,
                        { key: node.key, index: node.key, moveTabNode: _this2.moveTabNode },
                        node
                    );
                }
            );
        };
        return _this2;
    }

    _createClass(DraggableTabs, [{
        key: 'render',
        value: function render() {
            var order = this.state.order;
            var children = this.props.children;

            var tabs = [];
            React.Children.forEach(children, function (c) {
                tabs.push(c);
            });
            var orderTabs = tabs.slice().sort(function (a, b) {
                var orderA = order.indexOf(a.key);
                var orderB = order.indexOf(b.key);
                if (orderA !== -1 && orderB !== -1) {
                    return orderA - orderB;
                }
                if (orderA !== -1) {
                    return -1;
                }
                if (orderB !== -1) {
                    return 1;
                }
                var ia = tabs.indexOf(a);
                var ib = tabs.indexOf(b);
                return ia - ib;
            });
            return React.createElement(
                Tabs,
                _extends({ renderTabBar: this.renderTabBar }, this.props),
                orderTabs
            );
        }
    }]);

    return DraggableTabs;
}(React.Component);