var _excluded = ["folderUuid", "handleNavigatingThroughArrows", "DetailsView", "hideTopOptions", "openFolderOnClick"];
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
import { useRef, useEffect } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import ignoreEvent from '@filerobot/utils/lib/ignoreEvent';
import getFolderDetails from '@filerobot/utils/lib/getFolderDetails';
import handlePromise from '@filerobot/utils/lib/handlePromise';
import DnD from '../../../DnD';
import FolderTopOptions from './FolderTopOptions';
import Styled from '../../AssetsList.styled';
import FolderPreviewGrid from './FolderPreviewGrid';
import { useExplorer } from '../../../../hooks';
import { selectIsItemChecked, toggleSelection } from '../../../../slices/selections.slice';
import { itemRenameOpened, selectIsRenameItemFromSidebar, selectRenameItemFor } from '../../../../slices/panels.slice';
import { renameFolder, selectFolderByUuid } from '../../../../slices/folders.slice';
import { selectIsShareboxView } from '../../../../slices/views.slice';
import { INVALID_FOLDER_OR_FILE_CHARS_REGEX } from '@filerobot/utils/lib/constants';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var checkboxOnChange = function checkboxOnChange() {};
var FolderCell = function FolderCell(_ref) {
  var folderUuid = _ref.folderUuid,
    handleNavigatingThroughArrows = _ref.handleNavigatingThroughArrows,
    DetailsView = _ref.DetailsView,
    hideTopOptions = _ref.hideTopOptions,
    openFolderOnClick = _ref.openFolderOnClick,
    props = _objectWithoutProperties(_ref, _excluded);
  var dispatch = useDispatch();
  var _useExplorer = useExplorer(),
    i18n = _useExplorer.i18n,
    info = _useExplorer.info,
    _useExplorer$opts = _useExplorer.opts,
    disableFolderSelection = _useExplorer$opts.disableFolderSelection,
    disableFoldersContextMenu = _useExplorer$opts.disableFoldersContextMenu,
    hideFolderOptions = _useExplorer$opts.hideFolderOptions;
  var folder = useSelector(function (state) {
    return selectFolderByUuid(state, folderUuid) || {};
  });
  var renameItemFor = useSelector(selectRenameItemFor);
  var renameSidebarItem = useSelector(selectIsRenameItemFromSidebar);
  var isShareboxView = useSelector(selectIsShareboxView);
  var isChecked = useSelector(function (state) {
    return selectIsItemChecked(state, getFolderDetails(folder).uuid);
  });
  var isLoading = folder.loading;
  var stagedFileName = useRef(folder.name);
  var focusedInput = useRef();
  var id = getFolderDetails(folder).uuid;
  var folderName = getFolderDetails(folder).name;
  var isItemBeingRenamed = renameItemFor === id;
  var isFolderChecked = isChecked;
  var isRenamingFolder = !renameSidebarItem && renameItemFor && isItemBeingRenamed;
  useEffect(function () {
    if (focusedInput.current) {
      focusedInput.current.focus();
    }
  }, [renameSidebarItem, renameItemFor]);
  useEffect(function () {
    window.addEventListener('mousedown', handleSubmitRename);
    return function () {
      window.removeEventListener('mousedown', handleSubmitRename);
    };
  }, [isRenamingFolder, isLoading]);
  var handleToggleCheckbox = function handleToggleCheckbox(event) {
    if (isLoading || isShareboxView || disableFolderSelection) {
      return;
    }
    dispatch(toggleSelection({
      event: event,
      itemUuid: id,
      isMultiple: event.isMultiple
    }));
  };
  var handleOnContextMenu = function handleOnContextMenu(event) {
    event.preventDefault();
    event.stopPropagation();
    if (!isShareboxView && !isLoading && !disableFoldersContextMenu && typeof props.handleContextMenuToggle === 'function') {
      props.handleContextMenuToggle(event, folder);
    }
  };
  var triggerRenaming = function triggerRenaming(newName) {
    var renameAction = renameFolder({
      uuid: id,
      name: newName
    });
    handlePromise(dispatch(renameAction), function () {
      return info(i18n('mutualizedRenamedSuccessfullyInfo'), 'success');
    }, info);
  };
  var handleRenaming = function handleRenaming(newName) {
    if (isLoading) return;
    var newNameIsInvalid = INVALID_FOLDER_OR_FILE_CHARS_REGEX.test(newName);
    var oldName = folderName;
    if (!newName || newName === oldName) {
      dispatch(itemRenameOpened(null));
      return;
    }
    if (newNameIsInvalid) {
      info(i18n('mutualizedFolderInvalidNameError'));
    } else if (newName) {
      triggerRenaming(newName);
    } else if (newName === '') {
      // 'else if' not 'else' Cuz maybe the user would cancel then we don't need to show the msg.
      info(i18n('explorerInvalidNameInfo'));
    }
  };
  var handleSubmitRename = function handleSubmitRename(event) {
    if (!isRenamingFolder || isLoading || event.target.dataset.folderName === folder.name) return;
    event.target.value = stagedFileName.current;
    handleRenaming(event.target.value);
  };
  var handleKeyUp = function handleKeyUp(event) {
    if (isLoading) {
      return;
    }
    var eventKey = event.key.toLowerCase();
    var newName = event.target.value;
    if (eventKey === 'escape') {
      dispatch(itemRenameOpened(null));
      return;
    }
    stagedFileName.current = newName;
    if (eventKey !== 'enter') {
      return;
    }
    handleRenaming(newName);
  };
  var startRenameOnSecondClick = function startRenameOnSecondClick(event) {
    if (isLoading || DetailsView || event.detail !== 1) return;
    event.stopPropagation();
    dispatch(itemRenameOpened(folder.uuid || folder.id));
  };
  var _getFolderDetails = getFolderDetails(folder),
    filesDirect = _getFolderDetails.filesDirect,
    filesRecursive = _getFolderDetails.filesRecursive;
  return /*#__PURE__*/_jsx(DnD, {
    disableDrag: isItemBeingRenamed || isLoading,
    disableDrop: isLoading,
    item: folder,
    children: /*#__PURE__*/_jsxs(Styled.FolderSectionItem, {
      role: "button",
      className: "item-folder".concat(props.isDragging ? ' filerobot-Dragging-folders' : ''),
      onKeyDown: isLoading ? undefined : handleNavigatingThroughArrows,
      "data-filerobot-focusable-uuid": id,
      tabIndex: "-1",
      selected: isFolderChecked && !DetailsView && !isShareboxView,
      onClick: handleToggleCheckbox,
      onDoubleClick: function onDoubleClick(e) {
        return isLoading ? ignoreEvent(e) : openFolderOnClick(folder);
      },
      onContextMenu: handleOnContextMenu,
      "aria-label": isFolderChecked && !DetailsView ? i18n('mutualizedUnselectFileNamedLabel', {
        name: folderName
      }) : i18n('mutualizedSelectFileNamedLabel', {
        name: folderName
      }),
      $loading: isLoading,
      children: [!DetailsView && !isShareboxView && !disableFolderSelection && /*#__PURE__*/_jsx(Styled.FolderSectionItemCheckbox, {
        // TODO: fix
        // we use onClick instead of onChange as onChange causes multiple rerenders
        // we add onChnage as emty function to avoid type warning
        onClick: function onClick(e) {
          e.isMultiple = true;
        },
        onChange: checkboxOnChange,
        checked: isFolderChecked,
        onContextMenu: handleOnContextMenu,
        size: "md"
      }), /*#__PURE__*/_jsx(Styled.FolderIcon, {}), /*#__PURE__*/_jsxs(Styled.FolderContent, {
        children: [/*#__PURE__*/_jsx(FolderPreviewGrid, {
          folder: folder
        }), /*#__PURE__*/_jsxs(Styled.FolderInfo, {
          children: [/*#__PURE__*/_jsx(Styled.FolderTitle, {
            onClick: isFolderChecked ? startRenameOnSecondClick : undefined,
            children: isRenamingFolder ? /*#__PURE__*/_jsx(Styled.FolderInputRename, {
              type: "text",
              size: "sm",
              defaultValue: folderName,
              onKeyUp: handleKeyUp,
              onKeyDown: ignoreEvent,
              onClick: ignoreEvent,
              onDoubleClick: ignoreEvent,
              onContextMenu: ignoreEvent,
              ref: focusedInput,
              disabled: isLoading,
              focusOnMount: true,
              "data-folder-name": folder.name
            }) : /*#__PURE__*/_jsx("span", {
              children: folderName
            })
          }), /*#__PURE__*/_jsxs(Styled.FolderSubTitle, {
            children: [/*#__PURE__*/_jsx(Styled.FolderSubTitleText, {
              size: "sm",
              children: i18n('gridViewFolderSubTitleAssets', {
                count: filesDirect
              })
            }), /*#__PURE__*/_jsx(Styled.FolderSubTitleText, {
              size: "sm",
              children: i18n('gridViewFolderSubTitleSubAssets', {
                count: filesRecursive
              })
            })]
          })]
        })]
      }), !hideTopOptions && !isLoading && !isShareboxView && !hideFolderOptions && /*#__PURE__*/_jsx(FolderTopOptions, {
        folder: folder,
        onContextMenu: handleOnContextMenu,
        style: {
          top: '16%',
          right: '5%'
        }
      })]
    })
  });
};
export default FolderCell;