@krowdy-ui/views/es/Filters/FiltersTree/FiltersTree.js

React components that implement Google's Material Design.

import React from 'react';
import PropTypes from 'prop-types';
import SortableTree, { removeNodeAtPath } from 'react-sortable-tree';
import Theme from './Theme';
import { IconButton } from '@krowdy-ui/core';
import { Close as CloseIcon, Edit as EdiIcon } from '@material-ui/icons';

var _ref = /*#__PURE__*/React.createElement(CloseIcon, {
  fontSize: "small"
});

var _ref2 = /*#__PURE__*/React.createElement(EdiIcon, {
  fontSize: "small"
});

function FiltersTree(props) {
  const {
    treeData,
    // : treeDataProps,
    onChange = () => {},
    onClickEdit = () => {},
    dots
  } = props; // const [ treeData, setTreeData ] = React.useState([])
  // React.useEffect(() => {
  // setTreeData(treeDataProps)
  // eslint-disable-next-line react-hooks/exhaustive-deps
  // }, [ treeDataProps ])

  const _handleUpdateTreeData = data => {
    // setTreeData(data)
    onChange(data);
  };

  const _handleClickDelete = rowInfo => () => {
    const newTree = removeNodeAtPath({
      getNodeKey: ({
        treeIndex
      }) => treeIndex,
      path: rowInfo.path,
      treeData
    });

    _handleUpdateTreeData(newTree);
  };

  const _handleClickEdit = rowInfo => () => {
    onClickEdit(rowInfo.node);
  };

  return /*#__PURE__*/React.createElement(SortableTree, {
    generateNodeProps: rowInfo => ({
      buttons: [/*#__PURE__*/React.createElement(React.Fragment, {
        key: rowInfo.node._id
      }, /*#__PURE__*/React.createElement(IconButton, {
        onClick: _handleClickDelete(rowInfo),
        size: "small"
      }, _ref), /*#__PURE__*/React.createElement(IconButton, {
        onClick: _handleClickEdit(rowInfo),
        size: "small"
      }, _ref2))],
      dots
    }),
    isVirtualized: false,
    onChange: _handleUpdateTreeData,
    theme: Theme,
    treeData: treeData
  });
}

process.env.NODE_ENV !== "production" ? FiltersTree.propTypes = {
  onChange: PropTypes.func,
  treeData: PropTypes.array
} : void 0;
export default FiltersTree;