import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import React from 'react';
import { connect } from 'react-redux';
import { DependenciesEdge, DependenciesArrow } from '../../Edge/DepenenciesEdge';
import { FileName } from '../../../component/Node/File';
import { selectDependencyEdge } from '../../../../../core/dataBus/actions';
import { getSourceLayout, getSourceUserChoice, getDependenciesUserChoice } from '../../../../../core/dataBus/selectors';
import { getCheckedState } from '../../../../../core/controlsBus/selectors';
import { getGroupsAroundNode, checkIsEdgeSelected } from './utils';

var DependenciesTree = function DependenciesTree(props) {
  var language = props.language,
      selectedNode = props.selectedNode,
      filesLayoutMap = props.filesLayoutMap,
      shiftToCenterPoint = props.shiftToCenterPoint,
      sourceDiagramOn = props.sourceDiagramOn,
      onDependencyEdgeClick = props.onDependencyEdgeClick,
      selectedDependencyEdgeNodes = props.selectedDependencyEdgeNodes;

  if (!selectedNode || !selectedNode.dependencies) {
    return null;
  }

  var selectedNodeDependencies = selectedNode.dependencies[selectedNode.path];
  return React.createElement(React.Fragment, null, selectedNodeDependencies && [selectedNodeDependencies].map(function (_ref) {
    var moduleName = _ref.moduleName,
        importedModuleNames = _ref.importedModuleNames;
    var moduleNode = filesLayoutMap[moduleName];
    if (!moduleNode) return null;
    var _moduleNode$data = moduleNode.data,
        name = _moduleNode$data.name,
        path = _moduleNode$data.path;
    var _ref2 = [moduleNode.y, moduleNode.x],
        mX = _ref2[0],
        mY = _ref2[1];
    var targetPosition = shiftToCenterPoint(mX, mY);
    var sourceNodes = [];

    if (!sourceDiagramOn) {
      // TODO: un sync with FileName in SourceTree, duplication
      sourceNodes.push(React.createElement(FileName, {
        language: language,
        key: path,
        position: targetPosition,
        name: name,
        dependency: true
      }));
    }

    var importedNodes = importedModuleNames.map(function (name) {
      return filesLayoutMap[name];
    }).filter(function (node) {
      return !!node;
    });
    var edges = [];
    var selectedEdges = [];
    Object.entries(getGroupsAroundNode(moduleNode, importedNodes)).forEach(function (_ref3) {
      var _ref4 = _slicedToArray(_ref3, 2),
          groupName = _ref4[0],
          groupNodes = _ref4[1];

      if (!groupNodes.length) {
        return;
      } // swap here as well


      var firstSourceNode = groupNodes[0];
      var firstSourcePosition = shiftToCenterPoint(firstSourceNode.y, firstSourceNode.x);
      groupNodes.forEach(function (importedNode, i) {
        var _ref5 = [importedNode.y, importedNode.x],
            iX = _ref5[0],
            iY = _ref5[1];
        var sourcePosition = shiftToCenterPoint(iX, iY);
        var _importedNode$data = importedNode.data,
            importedNodePath = _importedNode$data.path,
            name = _importedNode$data.name;
        var selected = selectedDependencyEdgeNodes && checkIsEdgeSelected(selectedDependencyEdgeNodes, moduleName, importedNodePath);
        var edge = React.createElement(DependenciesEdge, {
          key: "dep-edge-".concat(importedNodePath, "-").concat(sourcePosition.x, "-").concat(targetPosition.x),
          anyEdgeSelected: !!selectedDependencyEdgeNodes,
          selected: selected,
          groupName: groupName,
          sourcePosition: sourcePosition,
          targetPosition: targetPosition,
          firstSourcePosition: i ? firstSourcePosition : null,
          onClick: function onClick() {
            return onDependencyEdgeClick({
              target: moduleName,
              sources: [importedNodePath],
              groupName: groupName
            });
          }
        });
        selected ? selectedEdges.push(edge) : edges.push(edge);

        if (!i) {
          var arrowSelected = selectedDependencyEdgeNodes && groupName === selectedDependencyEdgeNodes.groupName && checkIsEdgeSelected(selectedDependencyEdgeNodes, moduleName);
          var arrow = React.createElement(DependenciesArrow, {
            key: "dep-arrow-".concat(importedNodePath, "-").concat(groupName),
            selected: arrowSelected,
            groupName: groupName,
            targetPosition: targetPosition
          });
          arrowSelected ? selectedEdges.push(arrow) : edges.push(arrow);
        }

        if (!sourceDiagramOn) {
          sourceNodes.push(React.createElement(FileName, {
            key: importedNodePath,
            language: language,
            position: sourcePosition,
            name: name,
            dependency: true
          }));
        }
      });
    });
    return React.createElement(React.Fragment, {
      key: moduleName
    }, edges, selectedEdges, sourceNodes);
  }));
};

var mapStateToProps = function mapStateToProps(state, props) {
  var _getCheckedState = getCheckedState(state),
      sourceDiagramOn = _getCheckedState.sourceDiagramOn;

  var namespace = props.namespace;
  var namespaceProps = {
    namespace: namespace
  };

  var _getSourceLayout = getSourceLayout(state, namespaceProps),
      filesLayoutMap = _getSourceLayout.filesLayoutMap;

  var _getSourceUserChoice = getSourceUserChoice(state, namespaceProps),
      selectedNode = _getSourceUserChoice.selectedNode;

  var _getDependenciesUserC = getDependenciesUserChoice(state, namespaceProps),
      selectedDependencyEdgeNodes = _getDependenciesUserC.selectedDependencyEdgeNodes;

  return {
    sourceDiagramOn: sourceDiagramOn,
    filesLayoutMap: filesLayoutMap,
    selectedNode: selectedNode,
    selectedDependencyEdgeNodes: selectedDependencyEdgeNodes
  };
};

var mapDispatchToProps = function mapDispatchToProps(dispatch, props) {
  var namespace = props.namespace;
  return {
    onDependencyEdgeClick: function onDependencyEdgeClick(options) {
      return dispatch(selectDependencyEdge(options, namespace));
    }
  };
};

export default connect(mapStateToProps, mapDispatchToProps)(DependenciesTree);