@webiny/app-admin 0.0.0-unstable.615a930a68 → 0.0.0-unstable.61c048f412

package/components/FileManager/FileManagerView.js

@@ -1,728 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
-
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _emotion = require("emotion");
-
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-
-var _reactButterfiles = _interopRequireDefault(require("react-butterfiles"));
-
-var _Button = require("@webiny/ui/Button");
-
-var _Icon = require("@webiny/ui/Icon");
-
-var _File = _interopRequireDefault(require("./File"));
-
-var _reactHooks = require("@apollo/react-hooks");
-
-var _graphql = require("./graphql");
-
-var _getFileTypePlugin = _interopRequireDefault(require("./getFileTypePlugin"));
-
-var _get = _interopRequireDefault(require("lodash/get"));
-
-var _debounce = _interopRequireDefault(require("lodash/debounce"));
-
-var _getFileUploader = _interopRequireDefault(require("./getFileUploader"));
-
-var _outputFileSelectionError = require("./outputFileSelectionError");
-
-var _DropFilesHere = _interopRequireDefault(require("./DropFilesHere"));
-
-var _NoResults = _interopRequireDefault(require("./NoResults"));
-
-var _FileDetails = _interopRequireDefault(require("./FileDetails"));
-
-var _LeftSidebar = _interopRequireDefault(require("./LeftSidebar"));
-
-var _BottomInfoBar = _interopRequireDefault(require("./BottomInfoBar"));
-
-var _OverlayLayout = require("../OverlayLayout");
-
-var _useSnackbar2 = require("../../hooks/useSnackbar");
-
-var _Scrollbar = require("@webiny/ui/Scrollbar");
-
-var _Progress = require("@webiny/ui/Progress");
-
-var _i18n = require("@webiny/app/i18n");
-
-var _appSecurity = require("@webiny/app-security");
-
-var _reactHotkeyz = require("react-hotkeyz");
-
-var _FileManagerContext = require("./FileManagerContext");
-
-var _roundSearch24px = require("./icons/round-search-24px.svg");
-
-var _roundCloud_upload24px = require("./icons/round-cloud_upload-24px.svg");
-
-var _NoPermissionView = _interopRequireDefault(require("./NoPermissionView"));
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-
-var t = _i18n.i18n.ns("app-admin/file-manager/file-manager-view");
-
-var style = {
-  draggingFeedback: /*#__PURE__*/(0, _emotion.css)({
-    position: "fixed",
-    top: 0,
-    left: 0,
-    width: "100%",
-    height: "100%",
-    opacity: 0.5,
-    background: "white",
-    zIndex: 100
-  }, "label:draggingFeedback;"),
-  leftDrawer: {
-    header: /*#__PURE__*/(0, _emotion.css)({
-      textAlign: "center",
-      fontSize: 18,
-      padding: 10,
-      fontWeight: 600,
-      color: "var(--mdc-theme-on-surface)"
-    }, "label:header;")
-  }
-};
-var InputSearch = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "ee8m09m0",
-  label: "InputSearch"
-})({
-  backgroundColor: "var(--mdc-theme-on-background)",
-  position: "relative",
-  height: 32,
-  padding: 3,
-  width: "100%",
-  borderRadius: 2,
-  "> input": {
-    border: "none",
-    fontSize: 14,
-    width: "calc(100% - 10px)",
-    height: "100%",
-    marginLeft: 50,
-    backgroundColor: "transparent",
-    outline: "none",
-    color: "var(--mdc-theme-text-primary-on-background)"
-  }
-});
-var searchIcon = /*#__PURE__*/(0, _emotion.css)({
-  "&.mdc-button__icon": {
-    color: "var(--mdc-theme-text-secondary-on-background)",
-    position: "absolute",
-    width: 24,
-    height: 24,
-    left: 15,
-    top: 7
-  }
-}, "label:searchIcon;");
-var FileListWrapper = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "ee8m09m1",
-  label: "FileListWrapper"
-})({
-  float: "right",
-  display: "inline-block",
-  width: "calc(100vw - 270px)",
-  height: "100%"
-});
-var FileList = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "ee8m09m2",
-  label: "FileList"
-})({
-  width: "100%",
-  display: "grid",
-
-  /* define the number of grid columns */
-  gridTemplateColumns: "repeat( auto-fill, minmax(220px, 1fr) )",
-  marginBottom: 95
-});
-
-var renderFile = function renderFile(props) {
-  var file = props.file;
-  var plugin = (0, _getFileTypePlugin.default)(file);
-
-  if (!plugin) {
-    return null;
-  }
-
-  return /*#__PURE__*/_react.default.createElement(_File.default, Object.assign({}, props, {
-    key: file.id
-  }), plugin.render({
-    /**
-     * TODO @ts-refactor
-     */
-    // @ts-ignore
-    file: file
-  }));
-};
-
-var renderEmpty = function renderEmpty(_ref) {
-  var hasPreviouslyUploadedFiles = _ref.hasPreviouslyUploadedFiles,
-      browseFiles = _ref.browseFiles,
-      fmFilePermission = _ref.fmFilePermission;
-
-  if (!fmFilePermission) {
-    return /*#__PURE__*/_react.default.createElement(_NoPermissionView.default, null);
-  }
-
-  if (hasPreviouslyUploadedFiles) {
-    return /*#__PURE__*/_react.default.createElement(_NoResults.default, null);
-  }
-
-  return /*#__PURE__*/_react.default.createElement(_DropFilesHere.default, {
-    empty: true,
-    onClick: function onClick() {
-      return browseFiles();
-    }
-  });
-};
-
-var FileManagerView = function FileManagerView(props) {
-  var onClose = props.onClose,
-      onChange = props.onChange,
-      accept = props.accept,
-      _props$multiple = props.multiple,
-      multiple = _props$multiple === void 0 ? false : _props$multiple,
-      maxSize = props.maxSize,
-      multipleMaxCount = props.multipleMaxCount,
-      multipleMaxSize = props.multipleMaxSize,
-      onUploadCompletion = props.onUploadCompletion;
-
-  var _useFileManager = (0, _FileManagerContext.useFileManager)(),
-      selected = _useFileManager.selected,
-      toggleSelected = _useFileManager.toggleSelected,
-      dragging = _useFileManager.dragging,
-      setDragging = _useFileManager.setDragging,
-      uploading = _useFileManager.uploading,
-      setUploading = _useFileManager.setUploading,
-      _showFileDetails = _useFileManager.showFileDetails,
-      showingFileDetails = _useFileManager.showingFileDetails,
-      queryParams = _useFileManager.queryParams,
-      setQueryParams = _useFileManager.setQueryParams,
-      hasPreviouslyUploadedFiles = _useFileManager.hasPreviouslyUploadedFiles,
-      setHasPreviouslyUploadedFiles = _useFileManager.setHasPreviouslyUploadedFiles;
-
-  var _useSnackbar = (0, _useSnackbar2.useSnackbar)(),
-      showSnackbar = _useSnackbar.showSnackbar;
-
-  var _useSecurity = (0, _appSecurity.useSecurity)(),
-      identity = _useSecurity.identity,
-      getPermission = _useSecurity.getPermission;
-
-  var fmFilePermission = (0, _react.useMemo)(function () {
-    return getPermission("fm.file");
-  }, [identity]);
-  var canCreate = (0, _react.useMemo)(function () {
-    // Bail out early if no access
-    if (!fmFilePermission) {
-      return false;
-    }
-
-    if (fmFilePermission.own) {
-      return true;
-    }
-
-    if (typeof fmFilePermission.rwd === "string") {
-      return fmFilePermission.rwd.includes("w");
-    }
-
-    return true;
-  }, [fmFilePermission]);
-  var canEdit = (0, _react.useCallback)(function (item) {
-    // Bail out early if no access
-    if (!fmFilePermission) {
-      return false;
-    }
-
-    var creatorId = (0, _get.default)(item, "createdBy.id");
-
-    if (fmFilePermission.own && creatorId) {
-      var identityId = identity ? identity.id || identity.login : null;
-      return creatorId === identityId;
-    }
-
-    if (typeof fmFilePermission.rwd === "string") {
-      return fmFilePermission.rwd.includes("w");
-    }
-
-    return true;
-  }, [fmFilePermission]);
-  var searchOnChange = (0, _react.useCallback)( // @ts-ignore
-  (0, _debounce.default)(function (search) {
-    return setQueryParams({
-      search: search
-    });
-  }, 500), []);
-
-  var _toggleTag = (0, _react.useCallback)( /*#__PURE__*/function () {
-    var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee(_ref2) {
-      var tag, queryParams, finalTags;
-      return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              tag = _ref2.tag, queryParams = _ref2.queryParams;
-              finalTags = Array.isArray(queryParams.tags) ? (0, _toConsumableArray2.default)(queryParams.tags) : [];
-
-              if (finalTags.includes(tag)) {
-                finalTags.splice(finalTags.indexOf(tag), 1);
-              } else {
-                finalTags.push(tag);
-              }
-
-              setQueryParams((0, _objectSpread2.default)((0, _objectSpread2.default)({}, queryParams), {}, {
-                tags: finalTags
-              }));
-
-            case 4:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee);
-    }));
-
-    return function (_x) {
-      return _ref3.apply(this, arguments);
-    };
-  }(), []);
-
-  var getFileUploadErrorMessage = (0, _react.useCallback)(function (e) {
-    if (typeof e === "string") {
-      var match = e.match(/Message>(.*?)<\/Message/);
-
-      if (match) {
-        var _match = (0, _slicedToArray2.default)(match, 2),
-            message = _match[1];
-
-        return message;
-      }
-
-      return e;
-    }
-
-    return e.message;
-  }, []);
-
-  var updateCacheAfterCreateFile = function updateCacheAfterCreateFile(cache, newFile) {
-    var _data$fileManager;
-
-    var newFileData = (0, _get.default)(newFile, "data.fileManager.createFile.data");
-    var data = cache.readQuery({
-      query: _graphql.LIST_FILES,
-      variables: queryParams
-    });
-    cache.writeQuery({
-      query: _graphql.LIST_FILES,
-      variables: queryParams,
-      data: {
-        fileManager: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (data === null || data === void 0 ? void 0 : data.fileManager) || {}), {}, {
-          listFiles: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, ((data === null || data === void 0 ? void 0 : data.fileManager) || {}).listFiles), {}, {
-            data: [newFileData].concat((0, _toConsumableArray2.default)(((data === null || data === void 0 ? void 0 : (_data$fileManager = data.fileManager) === null || _data$fileManager === void 0 ? void 0 : _data$fileManager.listFiles) || {}).data || []))
-          })
-        })
-      }
-    });
-  };
-
-  var getFileDetailsFile = (0, _react.useCallback)(function (_ref4) {
-    var src = _ref4.src,
-        list = _ref4.list;
-    return list.find(function (item) {
-      return item.src === src;
-    });
-  }, []);
-  (0, _reactHotkeyz.useHotkeys)({
-    zIndex: 50,
-    keys: {
-      esc: onClose
-    }
-  });
-  var searchInput = (0, _react.useRef)(null);
-  var apolloClient = (0, _reactHooks.useApolloClient)();
-  var gqlQuery = (0, _reactHooks.useQuery)(_graphql.LIST_FILES, {
-    variables: queryParams,
-    onCompleted: function onCompleted(response) {
-      var list = (0, _get.default)(response, "fileManager.listFiles.data") || [];
-
-      if (hasPreviouslyUploadedFiles === null) {
-        setHasPreviouslyUploadedFiles(list.length > 0);
-      }
-    }
-  });
-  var refreshOnScroll = (0, _react.useCallback)((0, _debounce.default)(function (_ref5) {
-    var scrollFrame = _ref5.scrollFrame,
-        fetchMore = _ref5.fetchMore;
-
-    if (scrollFrame.top > 0.9) {
-      var cursor = (0, _get.default)(gqlQuery.data, "fileManager.listFiles.meta.cursor");
-
-      if (cursor) {
-        fetchMore({
-          variables: {
-            after: cursor
-          },
-          updateQuery: function updateQuery(prev, result) {
-            var fetchMoreResult = result.fetchMoreResult;
-
-            if (!fetchMoreResult) {
-              return prev;
-            }
-
-            var next = (0, _objectSpread2.default)({}, fetchMoreResult);
-            next.fileManager.listFiles.data = [].concat((0, _toConsumableArray2.default)(prev.fileManager.listFiles.data), (0, _toConsumableArray2.default)(fetchMoreResult.fileManager.listFiles.data));
-            return next;
-          }
-        });
-      }
-    }
-  }, 500), [gqlQuery]);
-  var data = gqlQuery.data,
-      fetchMore = gqlQuery.fetchMore,
-      loading = gqlQuery.loading;
-  var list = (0, _get.default)(data, "fileManager.listFiles.data") || [];
-
-  var _useMutation = (0, _reactHooks.useMutation)(_graphql.CREATE_FILE, {
-    update: updateCacheAfterCreateFile
-  }),
-      _useMutation2 = (0, _slicedToArray2.default)(_useMutation, 1),
-      createFile = _useMutation2[0];
-
-  var uploadFile = /*#__PURE__*/function () {
-    var _ref6 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee3(files) {
-      var list, errors, uploadedFiles;
-      return (0, _regeneratorRuntime2.default)().wrap(function _callee3$(_context3) {
-        while (1) {
-          switch (_context3.prev = _context3.next) {
-            case 0:
-              setUploading(true);
-              list = Array.isArray(files) ? files : [files];
-              errors = [];
-              uploadedFiles = [];
-              _context3.next = 6;
-              return Promise.all(list.map( /*#__PURE__*/function () {
-                var _ref7 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2(file) {
-                  var response, createFileResponse;
-                  return (0, _regeneratorRuntime2.default)().wrap(function _callee2$(_context2) {
-                    while (1) {
-                      switch (_context2.prev = _context2.next) {
-                        case 0:
-                          _context2.prev = 0;
-                          _context2.next = 3;
-                          return (0, _getFileUploader.default)()(file, {
-                            apolloClient: apolloClient
-                          });
-
-                        case 3:
-                          response = _context2.sent;
-                          _context2.next = 6;
-                          return createFile({
-                            variables: {
-                              data: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, response), {}, {
-                                tags: queryParams.scope ? [queryParams.scope] : []
-                              })
-                            }
-                          });
-
-                        case 6:
-                          createFileResponse = _context2.sent;
-                          // Save create file data for later
-                          uploadedFiles.push((0, _get.default)(createFileResponse, "data.fileManager.createFile.data"));
-                          _context2.next = 13;
-                          break;
-
-                        case 10:
-                          _context2.prev = 10;
-                          _context2.t0 = _context2["catch"](0);
-                          errors.push({
-                            file: file,
-                            e: _context2.t0
-                          });
-
-                        case 13:
-                        case "end":
-                          return _context2.stop();
-                      }
-                    }
-                  }, _callee2, null, [[0, 10]]);
-                }));
-
-                return function (_x3) {
-                  return _ref7.apply(this, arguments);
-                };
-              }()));
-
-            case 6:
-              if (!hasPreviouslyUploadedFiles) {
-                setHasPreviouslyUploadedFiles(true);
-              }
-
-              setUploading(false);
-
-              if (!(errors.length > 0)) {
-                _context3.next = 10;
-                break;
-              }
-
-              return _context3.abrupt("return", setTimeout(function () {
-                showSnackbar( /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["One or more files were not uploaded successfully:"]))), /*#__PURE__*/_react.default.createElement("ol", null, errors.map(function (_ref8) {
-                  var file = _ref8.file,
-                      e = _ref8.e;
-                  return /*#__PURE__*/_react.default.createElement("li", {
-                    key: file.name
-                  }, /*#__PURE__*/_react.default.createElement("strong", null, file.name), ": ", getFileUploadErrorMessage(e));
-                })))); // TODO @ts-refactor
-              }, 750));
-
-            case 10:
-              // We wait 750ms, just for everything to settle down a bit.
-              setTimeout(function () {
-                return showSnackbar(t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["File upload complete."]))));
-              }, 750);
-
-              if (!(typeof onUploadCompletion === "function")) {
-                _context3.next = 13;
-                break;
-              }
-
-              return _context3.abrupt("return", setTimeout(function () {
-                onUploadCompletion(uploadedFiles);
-                onClose && onClose(); // TODO @ts-refactor
-              }, 750));
-
-            case 13:
-              return _context3.abrupt("return", null);
-
-            case 14:
-            case "end":
-              return _context3.stop();
-          }
-        }
-      }, _callee3);
-    }));
-
-    return function uploadFile(_x2) {
-      return _ref6.apply(this, arguments);
-    };
-  }();
-
-  var renderUploadFileAction = (0, _react.useCallback)(function (_ref9) {
-    var browseFiles = _ref9.browseFiles;
-
-    if (!canCreate) {
-      return null;
-    }
-
-    return /*#__PURE__*/_react.default.createElement(_Button.ButtonPrimary, {
-      onClick: browseFiles,
-      disabled: uploading
-    }, /*#__PURE__*/_react.default.createElement(_Button.ButtonIcon, {
-      icon: /*#__PURE__*/_react.default.createElement(_roundCloud_upload24px.ReactComponent, null)
-    }), t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["Upload..."]))));
-  }, [uploading, canCreate]);
-  var settingsQuery = (0, _reactHooks.useQuery)(_graphql.GET_FILE_SETTINGS);
-  var settings = (0, _get.default)(settingsQuery.data, "fileManager.getSettings.data") || {};
-  return /*#__PURE__*/_react.default.createElement(_reactButterfiles.default, {
-    multiple: true,
-    maxSize: settings.uploadMaxFileSize ? settings.uploadMaxFileSize + "b" : maxSize,
-    multipleMaxSize: multipleMaxSize,
-    multipleMaxCount: multipleMaxCount,
-    accept: accept,
-    onSuccess: function onSuccess(files) {
-      uploadFile(files.map(function (file) {
-        return file.src.file;
-      }).filter(Boolean));
-    },
-    onError: function onError(errors) {
-      console.log("onError", errors);
-      /**
-       * TODO @ts-refactor
-       * Figure out if incoming errors var is wrong or the one in the outputFileSelectionError
-       */
-      // @ts-ignore
-
-      var message = (0, _outputFileSelectionError.outputFileSelectionError)(errors);
-      showSnackbar(message);
-    }
-  }, function (_ref10) {
-    var getDropZoneProps = _ref10.getDropZoneProps,
-        browseFiles = _ref10.browseFiles,
-        validateFiles = _ref10.validateFiles;
-    return /*#__PURE__*/_react.default.createElement(_OverlayLayout.OverlayLayout, Object.assign({}, getDropZoneProps({
-      onDragEnter: function onDragEnter() {
-        return hasPreviouslyUploadedFiles && setDragging(true);
-      },
-      onExited: onClose
-    }), {
-      barLeft: /*#__PURE__*/_react.default.createElement(InputSearch, null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
-        className: searchIcon,
-        icon: /*#__PURE__*/_react.default.createElement(_roundSearch24px.ReactComponent, null)
-      }), /*#__PURE__*/_react.default.createElement("input", {
-        ref: searchInput,
-        onChange: function onChange(e) {
-          return searchOnChange(e.target.value);
-        },
-        placeholder: t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["Search by filename or tags"]))),
-        disabled: !fmFilePermission,
-        "data-testid": "file-manager.search-input"
-      })),
-      barRight: selected.length > 0 ? /*#__PURE__*/_react.default.createElement(_Button.ButtonPrimary, {
-        disabled: uploading,
-        onClick: function onClick() {
-          (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee4() {
-            return (0, _regeneratorRuntime2.default)().wrap(function _callee4$(_context4) {
-              while (1) {
-                switch (_context4.prev = _context4.next) {
-                  case 0:
-                    if (!(typeof onChange === "function")) {
-                      _context4.next = 4;
-                      break;
-                    }
-
-                    _context4.next = 3;
-                    return onChange(multiple ? selected : selected[0]);
-
-                  case 3:
-                    onClose && onClose();
-
-                  case 4:
-                  case "end":
-                    return _context4.stop();
-                }
-              }
-            }, _callee4);
-          }))();
-        }
-      }, t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Select"]))), " ", multiple && "(".concat(selected.length, ")")) : renderUploadFileAction({
-        browseFiles: browseFiles
-      })
-    }), /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, dragging && hasPreviouslyUploadedFiles && /*#__PURE__*/_react.default.createElement(_DropFilesHere.default // @ts-ignore TODO: @adrian - className is never rendered?!
-    , {
-      className: style.draggingFeedback,
-      onDragLeave: function onDragLeave() {
-        return setDragging(false);
-      },
-      onDrop: function onDrop() {
-        return setDragging(false);
-      }
-    }), /*#__PURE__*/_react.default.createElement(_FileDetails.default, {
-      validateFiles: validateFiles,
-      uploadFile: uploadFile,
-      file: getFileDetailsFile({
-        list: list,
-        src: showingFileDetails
-      }),
-      canEdit: canEdit
-    }), /*#__PURE__*/_react.default.createElement(_LeftSidebar.default, {
-      queryParams: queryParams,
-      toggleTag: function toggleTag(tag) {
-        return _toggleTag({
-          tag: tag,
-          queryParams: queryParams
-        });
-      }
-    }), /*#__PURE__*/_react.default.createElement(FileListWrapper, {
-      "data-testid": "fm-list-wrapper"
-    }, loading && /*#__PURE__*/_react.default.createElement(_Progress.CircularProgress, {
-      label: t(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["Loading Files..."]))),
-      style: {
-        opacity: 1
-      }
-    }), /*#__PURE__*/_react.default.createElement(_Scrollbar.Scrollbar, {
-      onScrollFrame: function onScrollFrame(scrollFrame) {
-        return refreshOnScroll({
-          scrollFrame: scrollFrame,
-          fetchMore: fetchMore
-        });
-      }
-    }, /*#__PURE__*/_react.default.createElement(FileList, null, list.length ? list.map(function (file) {
-      return renderFile({
-        uploadFile: uploadFile,
-        file: file,
-        showFileDetails: function showFileDetails() {
-          return _showFileDetails(file.src);
-        },
-        selected: selected.find(function (current) {
-          return current.src === file.src;
-        }),
-        onSelect: function () {
-          var _onSelect = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee5() {
-            return (0, _regeneratorRuntime2.default)().wrap(function _callee5$(_context5) {
-              while (1) {
-                switch (_context5.prev = _context5.next) {
-                  case 0:
-                    if (!(typeof onChange === "function")) {
-                      _context5.next = 7;
-                      break;
-                    }
-
-                    if (!multiple) {
-                      _context5.next = 4;
-                      break;
-                    }
-
-                    toggleSelected(file);
-                    return _context5.abrupt("return");
-
-                  case 4:
-                    _context5.next = 6;
-                    return onChange(file);
-
-                  case 6:
-                    onClose && onClose();
-
-                  case 7:
-                  case "end":
-                    return _context5.stop();
-                }
-              }
-            }, _callee5);
-          }));
-
-          function onSelect() {
-            return _onSelect.apply(this, arguments);
-          }
-
-          return onSelect;
-        }()
-      });
-    }) : renderEmpty({
-      hasPreviouslyUploadedFiles: hasPreviouslyUploadedFiles,
-      browseFiles: browseFiles,
-      fmFilePermission: fmFilePermission
-    }))), /*#__PURE__*/_react.default.createElement(_BottomInfoBar.default, {
-      accept: accept,
-      uploading: uploading
-    }))));
-  });
-};
-
-FileManagerView.defaultProps = {
-  multiple: false,
-  maxSize: "1000mb",
-  multipleMaxSize: "1000mb",
-  multipleMaxCount: 100
-};
-var _default = FileManagerView;
-exports.default = _default;