import _objectSpread from "@babel/runtime/helpers/objectSpread";
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 React from 'react';
import { connect } from 'react-redux';
import classNames from 'classnames';
import SourceTree from './Tree/Source/';
import CodeCrumbsExtraInfo from './Tree/CodeCrumbs/ExtraInfo';
import { UnderLayer } from './UnderLayer';
import './TreeDiagram.less';
import { buildShiftToPoint } from '../../../core/dataBus/utils/geometry';
import { getProjectMetadata, getSourceLayout, getCodeCrumbsUserChoice, getNamespacesList } from '../../../core/dataBus/selectors';
import { getCheckedState, getValuesState } from '../../../core/controlsBus/selectors';
import { selectDependencyEdge, selectCcFlowEdge } from '../../../core/dataBus/actions';
import { setActiveNamespace } from '../../../core/namespaceIntegration/actions';
import { gatherFlowStepsData, getMaxWidthForNs } from './Tree/CodeCrumbs/helpers';

var TreeDiagram =
/*#__PURE__*/
function (_React$Component) {
  _inherits(TreeDiagram, _React$Component);

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

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

  _createClass(TreeDiagram, [{
    key: "render",
    value: function render() {
      // TODO: fix diagramZoom
      var _this$props = this.props,
          namespace = _this$props.namespace,
          projectName = _this$props.projectName,
          codeCrumbsDiagramOn = _this$props.codeCrumbsDiagramOn,
          multiple = _this$props.multiple,
          active = _this$props.active,
          diagramZoom = _this$props.diagramZoom,
          layoutSize = _this$props.layoutSize,
          maxWidth = _this$props.maxWidth,
          sourceLayoutTree = _this$props.sourceLayoutTree,
          onUnderLayerClick = _this$props.onUnderLayerClick,
          flowSteps = _this$props.flowSteps,
          sortedFlowSteps = _this$props.sortedFlowSteps,
          involvedNsData = _this$props.involvedNsData,
          ccShiftIndexMap = _this$props.ccShiftIndexMap;

      if (!layoutSize) {
        return null;
      }

      var width = layoutSize.width,
          height = layoutSize.height,
          xShift = layoutSize.xShift,
          yShift = layoutSize.yShift;
      var shiftToCenterPoint = buildShiftToPoint({
        x: xShift,
        y: yShift
      });
      return React.createElement("div", {
        className: classNames('TreeDiagram', {
          border: multiple
        })
      }, multiple ? React.createElement("p", {
        className: classNames('namespaceTitle', {
          activeTreeDiagram: multiple && active
        })
      }, projectName) : null, React.createElement("svg", {
        width: maxWidth || width,
        height: height,
        xmlns: "http://www.w3.org/2000/svg",
        shapeRendering: "optimizeSpeed"
      }, sourceLayoutTree && React.createElement(React.Fragment, null, React.createElement(UnderLayer, {
        width: maxWidth || width,
        height: height,
        onClick: onUnderLayerClick
      }), React.createElement(SourceTree, {
        namespace: namespace,
        shiftToCenterPoint: shiftToCenterPoint,
        areaHeight: height,
        sortedFlowSteps: sortedFlowSteps,
        involvedNsData: involvedNsData,
        ccShiftIndexMap: ccShiftIndexMap
      }))), codeCrumbsDiagramOn ? React.createElement(CodeCrumbsExtraInfo, {
        namespace: namespace,
        shiftToCenterPoint: shiftToCenterPoint,
        ccShiftIndexMap: ccShiftIndexMap,
        sortedFlowSteps: sortedFlowSteps,
        flowSteps: flowSteps
      }) : null);
    }
  }]);

  return TreeDiagram;
}(React.Component);

var mapStateToProps = function mapStateToProps(state, props) {
  var namespace = props.namespace;

  var _getSourceLayout = getSourceLayout(state, {
    namespace: namespace
  }),
      sourceLayoutTree = _getSourceLayout.sourceLayoutTree,
      layoutSize = _getSourceLayout.layoutSize;

  if (!sourceLayoutTree) {
    return {};
  }

  var _getProjectMetadata = getProjectMetadata(state, {
    namespace: namespace
  }),
      projectName = _getProjectMetadata.projectName;

  var _getValuesState = getValuesState(state),
      diagramZoom = _getValuesState.diagramZoom;

  var _getCheckedState = getCheckedState(state),
      codeCrumbsDiagramOn = _getCheckedState.codeCrumbsDiagramOn;

  var extendedCcProps = {};

  if (codeCrumbsDiagramOn) {
    var codeCrumbsUserChoice = getCodeCrumbsUserChoice(state, {
      namespace: namespace
    });
    var namespacesList = getNamespacesList(state);

    var _gatherFlowStepsData = gatherFlowStepsData(state, {
      currentSelectedCrumbedFlowKey: codeCrumbsUserChoice.selectedCrumbedFlowKey,
      namespacesList: namespacesList
    }),
        flowSteps = _gatherFlowStepsData.flowSteps,
        sortedFlowSteps = _gatherFlowStepsData.sortedFlowSteps,
        involvedNsData = _gatherFlowStepsData.involvedNsData,
        ccShiftIndexMap = _gatherFlowStepsData.ccShiftIndexMap;

    var maxWidth = getMaxWidthForNs(state, {
      namespacesList: namespacesList
    });
    extendedCcProps = {
      flowSteps: flowSteps,
      sortedFlowSteps: sortedFlowSteps,
      involvedNsData: involvedNsData,
      ccShiftIndexMap: ccShiftIndexMap,
      maxWidth: maxWidth
    };
  }

  return _objectSpread({
    namespace: namespace,
    projectName: projectName,
    codeCrumbsDiagramOn: codeCrumbsDiagramOn,
    diagramZoom: diagramZoom,
    sourceLayoutTree: sourceLayoutTree,
    layoutSize: layoutSize
  }, extendedCcProps);
};

var mapDispatchToProps = function mapDispatchToProps(dispatch, props) {
  var namespace = props.namespace;
  return {
    onUnderLayerClick: function onUnderLayerClick() {
      dispatch(setActiveNamespace(namespace));
      dispatch(selectDependencyEdge(undefined, namespace));
      dispatch(selectCcFlowEdge(undefined, namespace));
    }
  };
};

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