function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
import { useMemo } from 'react';
import { Button, TooltipV2 } from '@scaleflex/ui/core';
import PlusIcon from '@scaleflex/icons/plus';
import { Typography, PC, FV } from '@filerobot/common';
import { DragDropContext, Droppable, Draggable } from 'react-beautiful-dnd';
import reorder from '@filerobot/utils/lib/reorder';
import GroupItem from './GroupItem';
import Styled from './Groups.styled';
import ModalStyled from './CollectionModal.styled';
import { InfoOutline } from '@scaleflex/icons';
import { useTheme } from '@scaleflex/ui/theme/hooks';
import { useExplorer } from '../../../../hooks';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var Groups = function Groups(_ref) {
  var form = _ref.form,
    setForm = _ref.setForm,
    attrKeys = _ref.attrKeys,
    submited = _ref.submited,
    addGroup = _ref.addGroup;
  var theme = useTheme();
  var _useExplorer = useExplorer(),
    i18n = _useExplorer.i18n;
  var iconPrimaryColor = theme.palette[PC.IconsPrimary];
  var notUsedAttrKeys = useMemo(function () {
    var _form$data;
    var usedGroupSysKeys = ((form === null || form === void 0 ? void 0 : (_form$data = form.data) === null || _form$data === void 0 ? void 0 : _form$data.groupby) || []).map(function (group) {
      return group === null || group === void 0 ? void 0 : group.attribute_sys_key;
    });
    return attrKeys.filter(function (attrKey) {
      return !usedGroupSysKeys.includes(attrKey.sys_key);
    });
  }, [form === null || form === void 0 ? void 0 : form.data, attrKeys]);
  var handleRemoveGroup = function handleRemoveGroup(group) {
    return function () {
      var _form$data2;
      var newGroups = _toConsumableArray(((_form$data2 = form.data) === null || _form$data2 === void 0 ? void 0 : _form$data2.groupby) || []);
      var index = newGroups.findIndex(function (g) {
        return g.uuid === group.uuid || g.attribute_sys_key === group.attributeSysKey;
      });
      if (index > -1) {
        newGroups.splice(index, 1);
      }
      setForm(function (oldForm) {
        return _objectSpread(_objectSpread({}, oldForm), {}, {
          data: _objectSpread(_objectSpread({}, oldForm.data), {}, {
            groupby: newGroups
          })
        });
      });
    };
  };
  var handleChangeGroup = function handleChangeGroup(group) {
    return function (newValue) {
      var _attrKeys$find, _form$data3;
      var sysKey = (_attrKeys$find = attrKeys.find(function (key) {
        return key.slug === newValue;
      })) === null || _attrKeys$find === void 0 ? void 0 : _attrKeys$find.sys_key;
      var newGroups = _toConsumableArray(((_form$data3 = form.data) === null || _form$data3 === void 0 ? void 0 : _form$data3.groupby) || []);
      var index = newGroups.findIndex(function (g) {
        return g.uuid === group.uuid || g.attribute_sys_key === group.attributeSysKey;
      });
      if (index > -1) {
        newGroups[index] = _objectSpread(_objectSpread({}, newGroups[index]), {}, {
          attribute_sys_key: sysKey
        });
      }
      setForm(function (oldForm) {
        return _objectSpread(_objectSpread({}, oldForm), {}, {
          data: _objectSpread(_objectSpread({}, oldForm.data), {}, {
            groupby: newGroups
          })
        });
      });
    };
  };
  var onDragEnd = function onDragEnd(result) {
    var _form$data4;
    if (!result.destination) {
      return;
    }
    if (result.destination.index === result.source.index) {
      return;
    }
    var reorderedGroups = reorder((_form$data4 = form.data) === null || _form$data4 === void 0 ? void 0 : _form$data4.groupby, result.source.index, result.destination.index);
    setForm(function (oldForm) {
      return _objectSpread(_objectSpread({}, oldForm), {}, {
        data: _objectSpread(_objectSpread({}, oldForm.data), {}, {
          groupby: reorderedGroups
        })
      });
    });
  };
  var Item = function Item(_ref2) {
    var group = _ref2.group,
      index = _ref2.index;
    return /*#__PURE__*/_jsx(Draggable, {
      draggableId: group.attribute_sys_key || group.uuid,
      index: index,
      children: function children(provided) {
        return /*#__PURE__*/_jsx(GroupItem, _objectSpread(_objectSpread(_objectSpread({
          ref: provided.innerRef
        }, provided.draggableProps), provided.dragHandleProps), {}, {
          dragHandleProps: provided.dragHandleProps,
          group: group,
          onChange: handleChangeGroup(group),
          onRemove: handleRemoveGroup(group),
          attrKeys: attrKeys,
          notUsedAttrKeys: notUsedAttrKeys,
          iconPrimaryColor: iconPrimaryColor,
          showDragHandler: form.data.groupby.length > 1,
          index: index,
          submited: submited,
          i18n: i18n
        }));
      }
    });
  };
  var List = function List() {
    return /*#__PURE__*/_jsx(DragDropContext, {
      onDragEnd: onDragEnd,
      children: /*#__PURE__*/_jsx(Droppable, {
        droppableId: "list",
        children: function children(provided) {
          var _form$data5;
          return /*#__PURE__*/_jsxs(Styled.GroupsContainer, _objectSpread(_objectSpread({}, provided.droppableProps), {}, {
            ref: provided.innerRef,
            children: [(((_form$data5 = form.data) === null || _form$data5 === void 0 ? void 0 : _form$data5.groupby) || []).map(function (group, index) {
              return /*#__PURE__*/_jsx(Item, {
                group: group,
                index: index
              }, group.attribute_sys_key || group.uuid);
            }), provided.placeholder]
          }));
        }
      })
    });
  };
  return /*#__PURE__*/_jsxs(Styled.Container, {
    children: [/*#__PURE__*/_jsxs(ModalStyled.Label, {
      $withMarginBottom: true,
      children: [/*#__PURE__*/_jsx(Typography, {
        fontVariant: FV.TitleH4,
        colorVariant: PC.TextPrimary,
        children: i18n('mutualizedGroupsLabel')
      }), /*#__PURE__*/_jsx(TooltipV2, {
        arrow: true,
        position: "right",
        size: "md",
        title: i18n('collectionDialogGroupsLabelTooltip'),
        children: /*#__PURE__*/_jsx(InfoOutline, {
          size: 12,
          color: iconPrimaryColor
        })
      })]
    }), /*#__PURE__*/_jsx(List, {}), attrKeys.length === 0 && /*#__PURE__*/_jsx(Typography, {
      fontVariant: FV.Button,
      colorVariant: PC.TextSecondary,
      children: i18n('mutualizedNoAvailableGroups')
    }), notUsedAttrKeys.length > 0 && form.data.groupby.length < 4 && /*#__PURE__*/_jsx(Button, {
      color: "link-primary",
      startIcon: function startIcon(iconProps) {
        return /*#__PURE__*/_jsx(PlusIcon, _objectSpread({}, iconProps));
      },
      size: "sm",
      onClick: function onClick() {
        return addGroup();
      },
      children: i18n('collectionDialogAddGroupLabel')
    })]
  });
};
export default Groups;