Why Gemfury? Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Debian packages RPM packages NuGet packages

Repository URL to install this package:

Details    
Size: Mime:
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); }
import { useEffect, useMemo, useRef } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import ignoreEvent from '@filerobot/utils/lib/ignoreEvent';
import { PERMISSIONS } from '@filerobot/utils/lib/constants';
import { uploadUpdated } from '@filerobot/core/lib/slices/uploads.slice';
import handlePromise from '@filerobot/utils/lib/handlePromise';
import isFile from '@filerobot/utils/lib/isFile';
import isUploadableFile from '@filerobot/utils/lib/isUploadableFile';
import { Filerobot } from '@filerobot/core/lib';
import extractFileDataNoBlob from '@filerobot/utils/lib/extractFileDataNoBlob';
import truncateString from '../../../utils/truncateString';
import Styled from './FileInfo.styled';
import { itemRenameOpened, selectRenameItemFor } from '../../../slices/panels.slice';
import { renameFile } from '../../../slices/files.slice';
import { renameFolder } from '../../../slices/folders.slice';
import { useExplorer, useValidateFileRenaming } from '../../../hooks';
import { selectIsItemChecked } from '../../../slices/selections.slice';

// TODO: seems like it's used from both folders & files, then we need to change to more referrable naming, not file but (item).
import { jsx as _jsx } from "react/jsx-runtime";
var FileName = function FileName(_ref) {
  var _item$info;
  var item = _ref.file,
    noTruncate = _ref.noTruncate,
    containerWidth = _ref.containerWidth,
    isListView = _ref.isListView,
    renameOnDblClick = _ref.renameOnDblClick;
  var dispatch = useDispatch();
  var renameItemFor = useSelector(selectRenameItemFor);
  var _useExplorer = useExplorer(),
    i18n = _useExplorer.i18n,
    info = _useExplorer.info,
    checkUserPermissions = _useExplorer.checkUserPermissions;
  var handleItemRenamingValidation = useValidateFileRenaming();
  var stagedFileName = useRef(item.name);
  var isFileType = isFile(item);
  var isFileSelected = useSelector(function (state) {
    return selectIsItemChecked(state, item.uuid);
  });
  var isLoading = item.loading;
  var isUserPermittedToRename = useMemo(function () {
    return checkUserPermissions([PERMISSIONS[isFileType ? 'FILE_RENAME' : 'FOLDER_RENAME']]);
  }, [checkUserPermissions, isFileType]);
  if (stagedFileName.current !== item.name) {
    stagedFileName.current = item.name;
  }
  var isRenamingEnabled = isUserPermittedToRename && renameItemFor && renameItemFor === (item.uuid || item.id);

  // Take up at most 2 lines on any screen
  var maxNameLength;
  // For very small mobile screens
  if (containerWidth <= 352) {
    maxNameLength = 35;
    // For regular mobile screens
  } else if (containerWidth <= 576) {
    maxNameLength = 60;
    // For desktops
  } else {
    maxNameLength = 30;
  }
  var fileName = item.name || (item === null || item === void 0 ? void 0 : (_item$info = item.info) === null || _item$info === void 0 ? void 0 : _item$info.name);
  var handleMouseDown = function handleMouseDown(event) {
    if (!isRenamingEnabled || isLoading || !isUserPermittedToRename || event.target.dataset.fileName === item.name) return;
    event.target.value = stagedFileName.current;
    handleRenaming(event.target.value);
  };
  var triggerRenaming = function triggerRenaming(newName) {
    var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
      beforeRequest = _ref2.beforeRequest;
    if (typeof beforeRequest === 'function') {
      beforeRequest();
    }

    // Before/Pre upload case, if the file has id property means it's uploadable item.
    var isPreUpload = isUploadableFile(item);
    if (isPreUpload && isFileType) {
      var newFile = _objectSpread(_objectSpread({}, item), {}, {
        data: Filerobot.uploadFilesData[item.id]
      });
      var fileRelativePath = newFile.data.relativePath;
      var renamedFileData = new File([newFile.data], newName, {
        type: newFile.data.type
      });
      newFile.name = newName;
      newFile.data = extractFileDataNoBlob(renamedFileData);
      newFile.data.relativePath = fileRelativePath; // for not losing it after changing the data object.
      if (newFile.info) {
        newFile.info = _objectSpread(_objectSpread({}, newFile.info), {}, {
          name: newName
        });
      }
      dispatch(uploadUpdated(newFile));
      dispatch(itemRenameOpened(null));
      // Updating the file data in Filerobot's static object that has all uploads [File] class instance.
      Filerobot.uploadFilesData[item.id] = renamedFileData;
      info(i18n('mutualizedRenamedSuccessfullyInfo'), 'success');
      return;
    }
    var renameAction = isFileType ? renameFile({
      uuid: item.uuid,
      name: newName
    }) : renameFolder({
      uuid: item.uuid,
      name: newName
    });
    handlePromise(dispatch(renameAction), function () {
      return info(i18n('mutualizedRenamedSuccessfullyInfo'), 'success');
    }, info, function () {
      dispatch(itemRenameOpened(null));
    });
  };
  var handleRenaming = function handleRenaming(newName) {
    var oldName = item.name;
    if (!newName || newName === oldName) {
      dispatch(itemRenameOpened(null));
      return;
    }
    if (isFileType) {
      var renameValidation = handleItemRenamingValidation(oldName, newName, {
        onChangeExtension: function onChangeExtension(handleCancellation) {
          return triggerRenaming(newName, {
            beforeRequest: function beforeRequest() {
              return handleCancellation();
            }
          });
        },
        onKeepOldExtension: function onKeepOldExtension(newNameWithOldExtension, handleCancellation) {
          if (newNameWithOldExtension !== oldName) {
            triggerRenaming(newNameWithOldExtension, {
              beforeRequest: function beforeRequest() {
                return handleCancellation();
              }
            });
          } else {
            dispatch(itemRenameOpened(null));
            handleCancellation();
          }
        }
      });
      if (!renameValidation.valid) {
        return;
      }
    }
    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 handleKeyUp = function handleKeyUp(event) {
    if (!isUserPermittedToRename || isLoading) return;
    event.stopPropagation();
    event.preventDefault();
    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 startRenameSecondClick = function startRenameSecondClick(event) {
    if (!isUserPermittedToRename || event.detail !== 1 && !renameOnDblClick) return;
    event.stopPropagation();
    dispatch(itemRenameOpened(item.uuid || item.id));
  };
  useEffect(function () {
    if (isRenamingEnabled) {
      window.addEventListener('mousedown', handleMouseDown);
    }
    return function () {
      window.removeEventListener('mousedown', handleMouseDown);
    };
  }, [isRenamingEnabled, isLoading]);
  if (isRenamingEnabled) {
    return /*#__PURE__*/_jsx(Styled.FileRename, {
      type: "text",
      "data-file-name": item.name,
      defaultValue: fileName,
      onKeyUp: handleKeyUp,
      onKeyDown: ignoreEvent,
      onClick: ignoreEvent,
      disabled: isLoading,
      focusOnMount: true,
      size: "sm"
    });
  }
  return /*#__PURE__*/_jsx(Styled.FileName, {
    isListView: isListView,
    title: fileName,
    onClick: isFileSelected && !renameOnDblClick ? startRenameSecondClick : undefined,
    onDoubleClick: renameOnDblClick ? startRenameSecondClick : undefined,
    children: noTruncate ? fileName : truncateString(fileName, maxNameLength)
  });
};
export default FileName;