Repository URL to install this package:
|
Version:
3.12.20 ▾
|
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 Drawer from '../Drawer';
import Details from '../Details';
import LabelsTree from './LabelsTree';
import AssetsList from '../AssetsList';
import TopSection from '../TopSection';
import Styled from './LabelsView.styled';
import { useExplorer, useIsSmallScreen } from '../../hooks';
import { detailsViewToggled, selectIsDetailsViewOpened } from '../../slices/panels.slice';
import { fetchLabelFiles, toggleLabelsTree, selectActiveLabelSid, selectIsLabelsLoading, selectIsLabelsTreeOpened, selectLabelsSortBy, selectLabelsSortOrder, selectLabelsError, activateFirstLabel } from '../../slices/labels.slice';
import { selectFilesUuids, selectIsFilesLoading } from '../../slices/files.slice';
import Sort from '../common/Sort';
import { LABELS_VIEW_SORT_OPTIONS } from '../common/Sort/Sort.constants';
import { selectIsListLayout } from '../../slices/views.slice';
import ErroredViewPlaceholder from '../Views/ErroredViewPlaceholder';
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 LabelsView = function LabelsView() {
var dispatch = useDispatch();
var _useExplorer = useExplorer(),
opts = _useExplorer.opts,
i18n = _useExplorer.i18n;
var isLabelsLoading = useSelector(selectIsLabelsLoading);
var isFilesLoading = useSelector(selectIsFilesLoading);
var filesUuids = useSelector(selectFilesUuids);
var isDetailsViewOpened = useSelector(selectIsDetailsViewOpened);
var showLabelsTree = useSelector(selectIsLabelsTreeOpened);
var sortOrder = useSelector(selectLabelsSortOrder);
var sortBy = useSelector(selectLabelsSortBy);
var activeLabelSid = useSelector(selectActiveLabelSid);
var isListLayout = useSelector(selectIsListLayout);
var error = useSelector(selectLabelsError);
var isWidgetSmallSize = useIsSmallScreen();
var hideHeaderBar = opts.hideHeaderBar,
showBar = opts.showBar,
noItemsBrowser = opts.noItemsBrowser,
floaty = opts.floaty;
var fetchNextLabelFiles = function fetchNextLabelFiles() {
return dispatch(fetchLabelFiles());
};
var toggleLabelTree = function toggleLabelTree() {
return dispatch(toggleLabelsTree());
};
var toggleDetailsView = function toggleDetailsView() {
return dispatch(detailsViewToggled());
};
var applyLeftSideNavigation = function applyLeftSideNavigation(child, closeFunc) {
return /*#__PURE__*/_jsx(Drawer, {
direction: "e",
position: "left",
closeFn: closeFunc,
showCloseIcon: showLabelsTree,
children: child
});
};
var applyRightSideNavigation = function applyRightSideNavigation(child, closeFunc) {
return /*#__PURE__*/_jsx(Drawer, {
direction: "w",
position: "right",
closeFn: closeFunc,
style: {
overflow: floaty ? 'inherit' : undefined
},
showCloseIcon: !floaty || isDetailsViewOpened,
disableResizer: true,
children: child
});
};
var renderLeftSideNavigation = function renderLeftSideNavigation() {
return showLabelsTree && applyLeftSideNavigation( /*#__PURE__*/_jsx(LabelsTree, {}), toggleLabelTree);
};
var renderRightSideNavigation = function renderRightSideNavigation() {
return isDetailsViewOpened && applyRightSideNavigation( /*#__PURE__*/_jsx(Details, {}), toggleDetailsView);
};
var handleChangeSort = function handleChangeSort(sortedBy, order) {
dispatch(fetchLabelFiles({
labelSid: activeLabelSid,
sortBy: sortedBy,
sortOrder: order,
updateSorting: true,
replaceOldFiles: true,
offset: 0,
skipPending: false
}));
};
var openFirstLabel = function openFirstLabel() {
dispatch(activateFirstLabel());
};
var sortProps = {
options: LABELS_VIEW_SORT_OPTIONS,
sortBy: sortBy,
sortOrder: sortOrder,
onChange: handleChangeSort
};
var SortElement = !!activeLabelSid && /*#__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(Styled.BrowserBody, {
className: "filerobot-ProviderBrowser-body".concat(isListLayout ? ' filerobot-ProviderBrowser-body-list' : ''),
children: [renderLeftSideNavigation(), /*#__PURE__*/_jsxs(Styled.ViewBody, {
className: "filerobot-ProviderBrowser-mainContent",
children: [renderTopSection(isWidgetSmallSize), !isLabelsLoading && !isFilesLoading && 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: openFirstLabel,
backToLabel: i18n('labelsViewGoToFirstLabel')
}) : /*#__PURE__*/_jsx(AssetsList, {
filesUuids: filesUuids,
isInitialLoading: isLabelsLoading,
fetchNextFiles: fetchNextLabelFiles,
sortProps: sortProps,
hideAccordionHeader: true
})]
}), renderRightSideNavigation()]
})]
});
};
export default LabelsView;