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 { useDispatch, useSelector } from 'react-redux';
import { NoAssets } from '@scaleflex/icons';
import { useExplorer, useIsSmallScreen } from '../../hooks';
import { selectActiveCollection, selectIsActiveVirtualFolderLoading, selectIsCollectionsLoading, selectIsCollectionTreeOpened, toggleCollectionsTree, selectIsIntermediateVirtualFolder, selectCollectionsSortOrder, selectCollectionsSortBy, collectionsSortingUpdated, fetchCollectionsFiles, selectCollectionsError, activateFirstCollection } from '../../slices/collections.slice';
import { selectFilesUuids } from '../../slices/files.slice';
import { selectIsDetailsViewOpened, detailsViewToggled } from '../../slices/panels.slice';
import NoItems from '../NoItems';
import CollectionsTree from './CollectionsTree';
import VirtualFoldersGrid from './VirtualFoldersGrid';
import Drawer from '../Drawer';
import TopSection from '../TopSection';
import AssetsList from '../AssetsList';
import Details from '../Details';
import AssestViewStyled from '../AssetsView/AssetsView.styled';
import Sort from '../common/Sort';
import { COLLECTIONS_FOLDERS_SORT_OPTIONS, COLLECTIONS_SORT_OPTIONS } from '../common/Sort/Sort.constants';
import { selectIsListLayout } from '../../slices/views.slice';
import GridLayoutFoldersSkeleton from '../AssetsList/GridView/FoldersSkeleton';
import GridLayoutFilesSkeleton from '../AssetsList/GridView/FilesSkeleton';
import ErroredViewPlaceholder from '../Views/ErroredViewPlaceholder';
import { jsx as _jsx } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var CollectionsView = function CollectionsView() {
  var dispatch = useDispatch();
  var _useExplorer = useExplorer(),
    i18n = _useExplorer.i18n,
    opts = _useExplorer.opts;
  var isDetailsViewOpened = useSelector(selectIsDetailsViewOpened);
  var filesUuids = useSelector(selectFilesUuids);
  var isCollectionTreeOpened = useSelector(selectIsCollectionTreeOpened);
  var isCollectionsLoading = useSelector(selectIsCollectionsLoading);
  var isActiveCollectionVirtualFoldersLoading = useSelector(selectIsActiveVirtualFolderLoading);
  var activeCollection = useSelector(selectActiveCollection);
  var isCollectionIntermediateVirtualFolder = useSelector(selectIsIntermediateVirtualFolder);
  var sortOrder = useSelector(selectCollectionsSortOrder);
  var sortBy = useSelector(selectCollectionsSortBy);
  var isListLayout = useSelector(selectIsListLayout);
  var error = useSelector(selectCollectionsError);
  var isWidgetSmallSize = useIsSmallScreen();
  var floaty = opts.floaty,
    hideHeaderBar = opts.hideHeaderBar,
    noItemsBrowser = opts.noItemsBrowser,
    showBar = opts.showBar;
  var fetchNextCollectionFiles = function fetchNextCollectionFiles() {
    return dispatch(fetchCollectionsFiles());
  };
  var applyLeftSideNavigation = function applyLeftSideNavigation(child, closeFunc) {
    return /*#__PURE__*/_jsx(Drawer, {
      direction: "e",
      position: "left",
      closeFn: closeFunc,
      showCloseIcon: isCollectionTreeOpened,
      children: child
    });
  };
  var applyRightSideNavigation = function applyRightSideNavigation(child, closeFunc) {
    return /*#__PURE__*/_jsx(Drawer, {
      direction: "w",
      position: "right",
      closeFn: closeFunc,
      style: {
        overflow: floaty && 'inherit'
      },
      showCloseIcon: !floaty || isDetailsViewOpened,
      disableResizer: true,
      children: child
    });
  };
  var renderLeftSideNavigation = function renderLeftSideNavigation() {
    return isCollectionTreeOpened && applyLeftSideNavigation( /*#__PURE__*/_jsx(CollectionsTree, {}), function () {
      return dispatch(toggleCollectionsTree());
    });
  };
  var renderRightSideNavigation = function renderRightSideNavigation() {
    return isDetailsViewOpened && applyRightSideNavigation( /*#__PURE__*/_jsx(Details, {}), function () {
      return dispatch(detailsViewToggled());
    });
  };

  // TODO: Split those skeletons and maybe them separate and show the files/folders alone besides the other items skelecton if loaded
  var renderContent = function renderContent() {
    if (isCollectionsLoading || isActiveCollectionVirtualFoldersLoading) {
      return /*#__PURE__*/_jsxs(_Fragment, {
        children: [!isActiveCollectionVirtualFoldersLoading && /*#__PURE__*/_jsx(GridLayoutFoldersSkeleton, {}), /*#__PURE__*/_jsx(GridLayoutFilesSkeleton, {})]
      });
    }
    if (isCollectionIntermediateVirtualFolder) {
      return /*#__PURE__*/_jsx(VirtualFoldersGrid, {});
    }
    if (!activeCollection) {
      return /*#__PURE__*/_jsx(NoItems, {
        primary: i18n('collectionsNoActivePrimaryPlaceholder'),
        primaryFont: "LabelExtraLargeEmphasis",
        secondary: i18n('collectionsNoActiveSecondaryPlaceholder'),
        icon: NoAssets,
        size: 130,
        mt: 80
      });
    }
    return /*#__PURE__*/_jsx(AssetsList, {
      filesUuids: filesUuids,
      isInitialLoading: isCollectionsLoading,
      fetchNextFiles: fetchNextCollectionFiles,
      sortProps: sortProps,
      hideAccordionHeader: true
    });
  };
  var handleChangeSort = function handleChangeSort(sortedBy, order) {
    if (!isCollectionIntermediateVirtualFolder) {
      // Fetch files again with the new sort
      dispatch(fetchCollectionsFiles({
        sortBy: sortedBy,
        sortOrder: order,
        updateSorting: true,
        offset: 0
      }));
    } else {
      dispatch(collectionsSortingUpdated({
        sortBy: sortedBy,
        order: order
      }));
    }
  };
  var openFirstCollection = function openFirstCollection() {
    dispatch(activateFirstCollection());
  };
  var sortOptions = isCollectionIntermediateVirtualFolder ? COLLECTIONS_FOLDERS_SORT_OPTIONS : COLLECTIONS_SORT_OPTIONS;
  var sortProps = {
    options: sortOptions,
    sortBy: sortBy,
    sortOrder: sortOrder,
    onChange: handleChangeSort
  };
  var SortElement = !!activeCollection && /*#__PURE__*/_jsx(Sort, _objectSpread({}, sortProps));
  var renderTopSection = function renderTopSection(hideTopSection) {
    return /*#__PURE__*/_jsx(TopSection, {
      showTopBar: showBar && !noItemsBrowser,
      showHeaderBar: !hideHeaderBar,
      SortElement: SortElement,
      hideTopSection: hideTopSection
    });
  };
  return /*#__PURE__*/_jsxs(_Fragment, {
    children: [renderTopSection(!isWidgetSmallSize), /*#__PURE__*/_jsxs(AssestViewStyled.BrowserBody, {
      className: "filerobot-ProviderBrowser-body".concat(isListLayout ? ' filerobot-ProviderBrowser-body-list' : ''),
      children: [renderLeftSideNavigation(), /*#__PURE__*/_jsxs(AssestViewStyled.ViewBody, {
        className: "filerobot-ProviderBrowser-mainContent",
        children: [renderTopSection(isWidgetSmallSize), !isCollectionsLoading && !isActiveCollectionVirtualFoldersLoading && error ? /*#__PURE__*/_jsx(ErroredViewPlaceholder, {
          title: (error === null || error === void 0 ? void 0 : error.message) || error,
          description: error === null || error === void 0 ? void 0 : error.details,
          backTo: openFirstCollection,
          backToLabel: i18n('collectionsViewGoToFirstCollection')
        }) : renderContent()]
      }), renderRightSideNavigation()]
    })]
  });
};
export default CollectionsView;