import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
import 'core-js/modules/es.array.concat.js';
import 'core-js/modules/es.array.find.js';
import 'core-js/modules/es.array.find-index.js';
import 'core-js/modules/es.array.map.js';
import 'core-js/modules/es.array.slice.js';
import 'core-js/modules/es.object.to-string.js';
import 'core-js/modules/es.regexp.exec.js';
import 'core-js/modules/es.string.replace.js';
import React__default, { useState, useEffect } from 'react';
import PropTypes from 'prop-types';
import { BreadcrumbItem } from '@carbon/react';
import ComposedModal from '../../../ComposedModal/ComposedModal.js';
import BreadCrumb from '../../../Breadcrumb/Breadcrumb.js';
import { settings } from '../../../../constants/Settings.js';
import RadioButtonGroup from './HierarchyReorderModalRadioGroup.js';

var iotPrefix = settings.iotPrefix,
  prefix = settings.prefix;
var propTypes = {
  /** ListItems to be displayed */
  items: PropTypes.arrayOf(PropTypes.any).isRequired,
  selectedIds: PropTypes.arrayOf(PropTypes.string).isRequired,
  /** Internationalization text */
  i18n: PropTypes.shape({
    itemTitle: PropTypes.string,
    /** String e.g. 'Move %d items underneath' that gets %d replaced by items count or
     * function receiving the selectedCount as param:
     * (itemsCount) => `Move ${itemsCount} items underneath` */
    itemsTitle: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
    allRows: PropTypes.string,
    modalDescription: PropTypes.string
  }),
  /**   Close the dialog */
  onClose: PropTypes.func.isRequired,
  /** Callback to submit the dialog/form */
  onSubmit: PropTypes.func,
  /**  Is data currently being sent to the backend */
  sendingData: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
  /** Should the dialog be open or not */
  open: PropTypes.bool // eslint-disable-line react/boolean-prop-naming
};

/* istanbul ignore next */
var noop = function noop() {};
var defaultProps = {
  i18n: {
    itemTitle: 'Move 1 item underneath',
    itemsTitle: function itemsTitle(itemsCount) {
      return "Move ".concat(itemsCount, " items underneath");
    },
    allRows: 'All rows'
  },
  sendingData: null,
  onSubmit: noop,
  open: false
};
var handleSubmit = function handleSubmit(onSubmitCB, resetSelectionCB, item) {
  onSubmitCB(item);
  resetSelectionCB();
};
var handleClose = function handleClose(resetSelectionCB, onCloseCB) {
  resetSelectionCB();
  onCloseCB();
};
var getBreadCrumbData = function getBreadCrumbData(breadcrumbs, selectedItems, path, pathIndex) {
  if (pathIndex < path.length) {
    var breadCrumbItem = selectedItems.find(function (item) {
      return item.id === path[pathIndex];
    });
    return getBreadCrumbData([].concat(_toConsumableArray(breadcrumbs), [breadCrumbItem]), breadCrumbItem.children, path, pathIndex + 1);
  }
  return breadcrumbs;
};
var HierarchyListReorderModal = function HierarchyListReorderModal(_ref) {
  var i18n = _ref.i18n,
    items = _ref.items,
    sendingData = _ref.sendingData,
    selectedIds = _ref.selectedIds,
    open = _ref.open,
    _onClose = _ref.onClose,
    _onSubmit = _ref.onSubmit;
  var _useState = useState([]),
    _useState2 = _slicedToArray(_useState, 2),
    selectedParentPath = _useState2[0],
    setSelectedParentPath = _useState2[1];
  var _useState3 = useState(null),
    _useState4 = _slicedToArray(_useState3, 2),
    selectedItem = _useState4[0],
    setSelectedItem = _useState4[1];
  var _useState5 = useState(getBreadCrumbData([], items, selectedParentPath, 0)),
    _useState6 = _slicedToArray(_useState5, 2),
    breadCrumbData = _useState6[0],
    setBreadCrumbData = _useState6[1];
  useEffect(function () {
    setBreadCrumbData(getBreadCrumbData([], items, selectedParentPath, 0));
  },
  // eslint-disable-next-line react-hooks/exhaustive-deps
  [items, selectedParentPath]);
  var resetSelection = function resetSelection() {
    setSelectedParentPath([]);
    setSelectedItem(null);
  };
  var handleLineItemClicked = function handleLineItemClicked(item) {
    if (item.children && item.children.length > 0) {
      setSelectedParentPath([].concat(_toConsumableArray(selectedParentPath), [item.id]));
      setSelectedItem(null);
    } else {
      setSelectedItem(item.id);
    }
  };
  var handleBreadcrumbClick = function handleBreadcrumbClick(item, isCurrent) {
    if (isCurrent) {
      return;
    }
    var index = selectedParentPath.findIndex(function (pathItem) {
      return pathItem === (item === null || item === void 0 ? void 0 : item.id);
    });
    if (item !== null && index >= 0) {
      setSelectedParentPath(selectedParentPath.slice(0, index + 1));
    } else {
      setSelectedParentPath([]);
    }
  };
  var group = breadCrumbData.length > 0 ? breadCrumbData[breadCrumbData.length - 1].children : items;
  var firstCrumb = [/*#__PURE__*/React__default.createElement(BreadcrumbItem, {
    className: "".concat(iotPrefix, "--hierarchy-list-bulk-modal--breadcrumb"),
    title: i18n.allRows,
    key: "breadcrumb-all-".concat(i18n.allRows),
    isCurrentPage: selectedParentPath.length === 0
  }, /*#__PURE__*/React__default.createElement("button", {
    type: "button",
    className: "".concat(iotPrefix, "--hierarchy-list-bulk-modal--breadcrumb-button"),
    kind: "ghost",
    onClick: function onClick() {
      return handleBreadcrumbClick(null, selectedParentPath.length === 0);
    }
  }, i18n.allRows))];
  var renderedCrumbs = [].concat(firstCrumb, _toConsumableArray(breadCrumbData.map(function (crumb, index) {
    var _crumb$content, _crumb$content2, _crumb$content3;
    return /*#__PURE__*/React__default.createElement(BreadcrumbItem, {
      className: "".concat(iotPrefix, "--hierarchy-list-bulk-modal--breadcrumb"),
      title: crumb === null || crumb === void 0 || (_crumb$content = crumb.content) === null || _crumb$content === void 0 ? void 0 : _crumb$content.value,
      key: "breadcrumb-".concat(crumb === null || crumb === void 0 ? void 0 : crumb.id, "-").concat(crumb === null || crumb === void 0 || (_crumb$content2 = crumb.content) === null || _crumb$content2 === void 0 ? void 0 : _crumb$content2.value),
      isCurrentPage: index === breadCrumbData.length - 1
    }, /*#__PURE__*/React__default.createElement("button", {
      type: "button",
      className: "".concat(iotPrefix, "--hierarchy-list-bulk-modal--breadcrumb-button"),
      kind: "ghost",
      onClick: function onClick() {
        return handleBreadcrumbClick(crumb, index === breadCrumbData.length - 1);
      }
    }, crumb === null || crumb === void 0 || (_crumb$content3 = crumb.content) === null || _crumb$content3 === void 0 ? void 0 : _crumb$content3.value));
  })));
  return /*#__PURE__*/React__default.createElement(ComposedModal, {
    selectorPrimaryFocus: ".".concat(prefix, "--modal-header"),
    className: "".concat(iotPrefix, "--hierarchy-list-bulk-modal"),
    open: open,
    header: {
      title: selectedIds.length > 1 ? typeof i18n.itemsTitle === 'function' ? i18n.itemsTitle(selectedIds.length) : // Kept for backward compatability with existing i18n strings
      "".concat(i18n.itemsTitle.replace('%d', selectedIds.length)) : "".concat(i18n.itemTitle)
    },
    onClose: function onClose() {
      return handleClose(resetSelection, _onClose);
    },
    onSubmit: function onSubmit() {
      return handleSubmit(_onSubmit, resetSelection, selectedItem);
    },
    sendingData: sendingData
  }, /*#__PURE__*/React__default.createElement("div", {
    className: "".concat(iotPrefix, "--hierarchy-list-bulk-modal--title")
  }, i18n.modalDescription), /*#__PURE__*/React__default.createElement(BreadCrumb, {
    "data-testid": "modal-breadcrumb",
    hasOverflow: true,
    noTrailingSlash: true
  }, renderedCrumbs), /*#__PURE__*/React__default.createElement(RadioButtonGroup, {
    selectedItems: group,
    setSelectedItem: setSelectedItem,
    selectedItem: selectedItem,
    selectedIds: selectedIds,
    handleLineItemClicked: handleLineItemClicked
  }));
};
HierarchyListReorderModal.propTypes = propTypes;
HierarchyListReorderModal.defaultProps = defaultProps;
HierarchyListReorderModal.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "HierarchyListReorderModal",
  "props": {
    "i18n": {
      "defaultValue": {
        "value": "{\n  itemTitle: 'Move 1 item underneath',\n  itemsTitle: (itemsCount) => `Move ${itemsCount} items underneath`,\n  allRows: 'All rows',\n}",
        "computed": false
      },
      "description": "Internationalization text",
      "type": {
        "name": "shape",
        "value": {
          "itemTitle": {
            "name": "string",
            "required": false
          },
          "itemsTitle": {
            "name": "union",
            "value": [{
              "name": "string"
            }, {
              "name": "func"
            }],
            "description": "String e.g. 'Move %d items underneath' that gets %d replaced by items count or\nfunction receiving the selectedCount as param:\n(itemsCount) => `Move ${itemsCount} items underneath`",
            "required": false
          },
          "allRows": {
            "name": "string",
            "required": false
          },
          "modalDescription": {
            "name": "string",
            "required": false
          }
        }
      },
      "required": false
    },
    "sendingData": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "Is data currently being sent to the backend",
      "type": {
        "name": "union",
        "value": [{
          "name": "bool"
        }, {
          "name": "string"
        }]
      },
      "required": false
    },
    "onSubmit": {
      "defaultValue": {
        "value": "() => {}",
        "computed": false
      },
      "description": "Callback to submit the dialog/form",
      "type": {
        "name": "func"
      },
      "required": false
    },
    "open": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "Should the dialog be open or not",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "items": {
      "description": "ListItems to be displayed",
      "type": {
        "name": "arrayOf",
        "value": {
          "name": "any"
        }
      },
      "required": true
    },
    "selectedIds": {
      "description": "",
      "type": {
        "name": "arrayOf",
        "value": {
          "name": "string"
        }
      },
      "required": true
    },
    "onClose": {
      "description": "Close the dialog",
      "type": {
        "name": "func"
      },
      "required": true
    }
  }
};
var HierarchyListReorderModal$1 = HierarchyListReorderModal;

export { HierarchyListReorderModal$1 as default, handleClose, handleSubmit };
