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 _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure 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 _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; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { useTheme } from '@scaleflex/ui/theme/hooks';
import { ArrowRightOutline } from '@scaleflex/icons';
import { BackdropOverlay, PC } from '@filerobot/common';
import { useContextMenu, useContextMenuData } from '@filerobot/core/lib/hooks';
import { TooltipV2 } from '@scaleflex/ui/core';
import { CONTEXTMENU_MODES, CONTEXTMENU_TYPES } from '@filerobot/utils/lib/constants';
import Styled from './ContextMenu.styled';
import { selectContainerHeight, selectContainerWidth } from '../../slices/common.slice';
import { useExplorer } from '../../hooks';
import { getAccurateElementCoordinates, modeToOptions } from './ContextMenu.utils';
import { selectCurrentFilesByIdsOrUuids } from '../../slices/files.slice';
import { selectFoldersByUuids } from '../../slices/folders.slice';
import { selectionsCleared } from '../../slices/selections.slice';
import { selectIsShareboxView } from '../../slices/views.slice';

// TODO: We should refactor this, to be more simple logic (if we found time).
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
var verticalMargin = 4;
var oneOptionHeight = 34; // should be synchronized with the height value in styles
var separatorHeight = 16;
var iconSize = 10;
var initialSubListState = {
  isSubList: false,
  subListOptions: [],
  subListBottom: 0,
  subListLeft: 0
};
var ContextMenuContent = function ContextMenuContent(_ref) {
  var _modeToOptions$mode, _passedCommonProps, _menuStyles, _filteredOptions;
  var _ref$zIndex = _ref.zIndex,
    zIndex = _ref$zIndex === void 0 ? 999999 : _ref$zIndex,
    _ref$isSubList = _ref.isSubList,
    isSubList = _ref$isSubList === void 0 ? false : _ref$isSubList,
    _ref$subListOptions = _ref.subListOptions,
    subListOptions = _ref$subListOptions === void 0 ? [] : _ref$subListOptions,
    _ref$subListBottom = _ref.subListBottom,
    subListBottom = _ref$subListBottom === void 0 ? 0 : _ref$subListBottom,
    _ref$subListLeft = _ref.subListLeft,
    subListLeft = _ref$subListLeft === void 0 ? 0 : _ref$subListLeft;
  // const options = isCommonMenu ? contextMenuCommonOptions : props.options
  // const { isContextMenuFromUpload } = props
  var dispatch = useDispatch();
  var toggleContextMenu = useContextMenu();
  var _useExplorer = useExplorer(),
    i18n = _useExplorer.i18n,
    info = _useExplorer.info,
    rootElement = _useExplorer.el;
  var containerWidth = useSelector(selectContainerWidth);
  var containerHeight = useSelector(selectContainerHeight);
  var theme = useTheme();
  var _useContextMenuData = useContextMenuData(),
    _useContextMenuData$e = _useContextMenuData.event,
    event = _useContextMenuData$e === void 0 ? {} : _useContextMenuData$e,
    _useContextMenuData$f = _useContextMenuData.foldersUuids,
    foldersUuids = _useContextMenuData$f === void 0 ? [] : _useContextMenuData$f,
    _useContextMenuData$f2 = _useContextMenuData.filesUuids,
    filesUuids = _useContextMenuData$f2 === void 0 ? [] : _useContextMenuData$f2,
    _useContextMenuData$t = _useContextMenuData.type,
    type = _useContextMenuData$t === void 0 ? CONTEXTMENU_TYPES.FILE : _useContextMenuData$t,
    _useContextMenuData$i = _useContextMenuData.itemsPropName,
    itemsPropName = _useContextMenuData$i === void 0 ? 'items' : _useContextMenuData$i,
    _useContextMenuData$m = _useContextMenuData.mode,
    mode = _useContextMenuData$m === void 0 ? CONTEXTMENU_MODES.AUTO : _useContextMenuData$m,
    _useContextMenuData$o = _useContextMenuData.options,
    customOptions = _useContextMenuData$o === void 0 ? null : _useContextMenuData$o,
    _useContextMenuData$i2 = _useContextMenuData.items,
    items = _useContextMenuData$i2 === void 0 ? null : _useContextMenuData$i2,
    _useContextMenuData$f3 = _useContextMenuData.fromSidebar,
    fromSidebar = _useContextMenuData$f3 === void 0 ? false : _useContextMenuData$f3;
  var folders = useSelector(function (state) {
    return selectFoldersByUuids(state, foldersUuids);
  });
  var files = useSelector(function (state) {
    return selectCurrentFilesByIdsOrUuids(state, filesUuids);
  });
  var isShareboxView = useSelector(selectIsShareboxView);
  var _useState = useState(initialSubListState),
    _useState2 = _slicedToArray(_useState, 2),
    subListProps = _useState2[0],
    setSubListProps = _useState2[1];
  var otherOptions = typeof customOptions === 'function' ? customOptions({
    folders: folders,
    files: files,
    isShareboxView: isShareboxView
  }) : customOptions;
  var options = isSubList ? subListOptions : otherOptions || ((_modeToOptions$mode = modeToOptions[mode]) === null || _modeToOptions$mode === void 0 ? void 0 : _modeToOptions$mode.call(modeToOptions, {
    folders: folders,
    files: files,
    isShareboxView: isShareboxView
  }));
  if (!options) {
    return null;
  }
  var iconPrimaryColor = theme.palette[PC.IconsPrimary];
  var _getAccurateElementCo = getAccurateElementCoordinates(rootElement, event),
    _getAccurateElementCo2 = _slicedToArray(_getAccurateElementCo, 2),
    left = _getAccurateElementCo2[0],
    top = _getAccurateElementCo2[1];

  // We should provide the basic/common needed props, and do the operations are in the specific option function.
  var passedCommonProps = (_passedCommonProps = {
    i18n: i18n,
    info: info,
    dispatch: dispatch,
    folders: folders,
    files: files,
    foldersUuids: foldersUuids,
    filesUuids: filesUuids
  }, _defineProperty(_passedCommonProps, itemsPropName, items), _defineProperty(_passedCommonProps, "toggleContextMenu", toggleContextMenu), _defineProperty(_passedCommonProps, "isContextMenuFromSidebar", fromSidebar), _defineProperty(_passedCommonProps, "iconPrimaryColor", iconPrimaryColor), _passedCommonProps);
  var isFileType = type === CONTEXTMENU_TYPES.FILE;
  var tooltipTitle = function tooltipTitle(tooltip) {
    return typeof tooltip === 'function' ? tooltip(passedCommonProps) : i18n(tooltip) || tooltip;
  };
  var disabledOption = function disabledOption(disabled) {
    return typeof disabled === 'function' ? disabled(passedCommonProps) : disabled;
  };
  var menuPadding = isFileType ? 9 : 4;
  var buttonHeight = isFileType ? 64 : 44;
  var menuHeight = menuPadding * 2 + buttonHeight; // top and bottom padding
  // We are implementing this here for calculating the exact menu height first, also we utilized it in rendering below.

  var filteredOptions = options.filter(function (option) {
    var _option$hideOption;
    return !((_option$hideOption = option.hideOption) !== null && _option$hideOption !== void 0 && _option$hideOption.call(option, passedCommonProps));
  });

  // Remove separator duplications and separator if it's the last option
  filteredOptions = filteredOptions.reduce(function (accum, currentOption, currentIndex) {
    var _currentOption$key, _accum$key;
    if (!((_currentOption$key = currentOption.key) !== null && _currentOption$key !== void 0 && _currentOption$key.includes('SEPARATOR')) || accum.length && !((_accum$key = accum[accum.length - 1].key) !== null && _accum$key !== void 0 && _accum$key.includes('SEPARATOR')) && currentIndex !== filteredOptions.length - 1) {
      accum.push(currentOption);
    }
    return accum;
  }, []);
  filteredOptions.forEach(function (option) {
    var _option$key;
    if ((_option$key = option.key) !== null && _option$key !== void 0 && _option$key.includes('SEPARATOR')) {
      menuHeight += separatorHeight;
    } else if (disabledOption(option.disabled)) {
      menuHeight += 34; // 4 = the disabled option height (as till now it is separator only)
    } else {
      menuHeight += oneOptionHeight;
    }
  });
  var contextMenuWrapper = null;
  var handleMenuClosing = function handleMenuClosing() {
    var keepItemsSelected = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
    toggleContextMenu();
    if (!keepItemsSelected) {
      dispatch(selectionsCleared());
    }
  };
  var distanceKeys = {
    x: 'left',
    y: isSubList ? 'bottom' : 'top'
  };
  var distanceVals = {
    x: left + Math.abs(subListLeft),
    y: Math.abs(subListBottom) || top
  };
  var contextMenuWidth = 250;
  if (distanceVals.x + contextMenuWidth > containerWidth) {
    distanceKeys.x = 'right';
    distanceVals.x = containerWidth - left;
    if (isSubList && subListLeft < 0) {
      distanceVals.x += Math.abs(subListLeft);
    }
  }
  if (!isSubList && distanceVals.y + menuHeight >= containerHeight) {
    distanceVals.y -= distanceVals.y + menuHeight + verticalMargin - containerHeight;
  }
  if (distanceVals.y <= 0) {
    distanceVals.y = verticalMargin;
  }
  var menuStyles = (_menuStyles = {}, _defineProperty(_menuStyles, distanceKeys.y, distanceVals.y), _defineProperty(_menuStyles, distanceKeys.x, distanceVals.x), _defineProperty(_menuStyles, "zIndex", zIndex), _menuStyles);
  var handleOptionClick = function handleOptionClick(_ref2) {
    var keepMenuOpened = _ref2.keepMenuOpened,
      keepItemsSelected = _ref2.keepItemsSelected,
      onClick = _ref2.onClick,
      disabled = _ref2.disabled;
    if (!keepMenuOpened && !disabled) {
      handleMenuClosing(keepItemsSelected);
    }
    if (onClick) {
      onClick();
    }
  };
  var handleSubListOpening = function handleSubListOpening(event, subListOptions) {
    var optionElem = event.currentTarget;
    // 1 is const for overlapping the sub list over the parent menu
    var subListLeft = contextMenuWrapper.getBoundingClientRect().width - 1;
    var subListYOffset = containerHeight - parseInt(contextMenuWrapper.offsetTop + optionElem.offsetTop + optionElem.offsetHeight - contextMenuWrapper.scrollTop);
    setSubListProps({
      isSubList: true,
      // (-) sign to know which starting position parent menu coming from
      subListLeft: distanceKeys.x === 'right' ? -subListLeft : subListLeft,
      subListBottom: subListYOffset,
      subListOptions: subListOptions
    });
  };
  var handleSubListClosing = function handleSubListClosing() {
    return setSubListProps(initialSubListState);
  };
  var assignContextMenuRef = function assignContextMenuRef(menu) {
    contextMenuWrapper = menu;
    if (contextMenuWrapper) {
      var _getComputedStyle = getComputedStyle(contextMenuWrapper),
        height = _getComputedStyle.height,
        _top = _getComputedStyle.top,
        bottom = _getComputedStyle.bottom;
      if (parseFloat(height) + verticalMargin >= containerHeight) {
        contextMenuWrapper.style.maxHeight = "".concat(containerHeight - verticalMargin - Math.max(parseInt(_top), parseInt(bottom)), "px");
      }
      if (isSubList && contextMenuWrapper.offsetTop < 0) {
        contextMenuWrapper.style.top = "".concat(verticalMargin, "px");
        contextMenuWrapper.style.bottom = 'unset';
      }
    }
  };
  var renderOptionContent = function renderOptionContent(_ref3) {
    var content = _ref3.content,
      desc = _ref3.desc;
    return /*#__PURE__*/_jsxs(Styled.OptionContent, {
      className: "filerobot-Explorer-contextMenu-option-content",
      children: [typeof content === 'function' ? content(passedCommonProps) : typeof content === 'string' ? i18n(content) || content : content, desc && /*#__PURE__*/_jsx(Styled.OptionContentDesc, {
        className: "filerobot-Explorer-contextMenu-option-content-desc",
        children: desc
      })]
    });
  };

  // prefix, content & suffix might be a inited component, declared component, function or string.
  // if it's a component or function it would contain the general props.
  var renderOption = function renderOption(_ref4, index) {
    var prefix = _ref4.prefix,
      content = _ref4.content,
      desc = _ref4.desc,
      suffix = _ref4.suffix,
      key = _ref4.key,
      _onClick = _ref4.onClick,
      keepItemsSelected = _ref4.keepItemsSelected,
      subListItemsFn = _ref4.subListItemsFn,
      keepMenuOpened = _ref4.keepMenuOpened,
      disabled = _ref4.disabled,
      isActive = _ref4.isActive,
      hoverTheme = _ref4.hoverTheme,
      singleCustomMenuOption = _ref4.singleCustomMenuOption;
    var subListItems = subListItemsFn === null || subListItemsFn === void 0 ? void 0 : subListItemsFn(passedCommonProps);
    var subListOnMouseOverHandler = subListItems ? function (e) {
      return handleSubListOpening(e, subListItems);
    } : handleSubListClosing;
    return /*#__PURE__*/_jsxs(Styled.OptionWrapper, _objectSpread(_objectSpread({
      $disabled: disabledOption(disabled)
    }, isActive ? {
      className: 'active'
    } : {}), {}, {
      onClick: function onClick(event) {
        return handleOptionClick({
          keepMenuOpened: keepMenuOpened,
          keepItemsSelected: keepItemsSelected,
          disabled: disabled,
          onClick: _onClick && !disabledOption(disabled) ? function () {
            return _onClick(_objectSpread({
              event: event
            }, passedCommonProps));
          } : undefined
        });
      },
      onContextMenu: function onContextMenu(e) {
        return e.preventDefault();
      },
      onMouseOver: !isSubList ? subListOnMouseOverHandler : undefined,
      isFileType: isFileType,
      isSubList: isSubList,
      isLabelsContext: key === 'LABELS',
      hasPrefix: Boolean(prefix),
      $hoverTheme: hoverTheme,
      $key: key,
      $singleCustomMenuOption: singleCustomMenuOption,
      children: [prefix && (typeof prefix === 'function' ? prefix(passedCommonProps) : prefix), content && renderOptionContent({
        content: content,
        desc: desc
      }), (suffix || subListItemsFn) && /*#__PURE__*/_jsxs(Styled.OptionSuffix, {
        className: "filerobot-Explorer-contextMenu-option-suffix",
        children: [typeof suffix === 'function' ? suffix(passedCommonProps) : suffix, (subListItemsFn === null || subListItemsFn === void 0 ? void 0 : subListItemsFn(passedCommonProps)) && /*#__PURE__*/_jsx(ArrowRightOutline, {
          color: iconPrimaryColor,
          size: iconSize
        })]
      })]
    }), key || "".concat(index, "-").concat(content === null || content === void 0 ? void 0 : content.toString()));
  };
  return /*#__PURE__*/_jsxs(_Fragment, {
    children: [/*#__PURE__*/_jsx(Styled.ContextMenuWrapper, {
      style: menuStyles,
      ref: assignContextMenuRef,
      isFileType: isFileType,
      isSubList: isSubList,
      $zIndex: zIndex,
      isHidden: ((_filteredOptions = filteredOptions) === null || _filteredOptions === void 0 ? void 0 : _filteredOptions.length) === 0,
      onClick: function onClick(e) {
        return e.stopPropagation();
      },
      children: /*#__PURE__*/_jsx(Styled.OptionsList, {
        children: filteredOptions.map(function (option, index) {
          if (tooltipTitle(option.tooltip)) {
            var _option$content;
            return /*#__PURE__*/_jsx(TooltipV2, {
              title: tooltipTitle(option.tooltip),
              children: renderOption(option)
            }, option.key || "".concat(index, "-").concat((_option$content = option.content) === null || _option$content === void 0 ? void 0 : _option$content.toString()));
          } else {
            return renderOption(option);
          }
        })
      })
    }), !isSubList && /*#__PURE__*/_jsx(BackdropOverlay, {
      zIndex: zIndex - 1,
      onClick: handleMenuClosing,
      acceptScroll: true
    }), subListProps.isSubList && /*#__PURE__*/_jsx(ContextMenuContent, _objectSpread({
      zIndex: zIndex + 1
    }, subListProps))]
  });
};
export default ContextMenuContent;