@filerobot/approvals
Version:
Asset approvals package for Filerobot
162 lines (159 loc) • 9.05 kB
JavaScript
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(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
import { useCallback } from 'react';
import { useSelector, useDispatch } from 'react-redux';
import { Button, TooltipV2 } from '@scaleflex/ui/core';
import { PlusOutline, VersioningOutline } from '@scaleflex/icons';
// import { APPROVAL_STATUSES } from '@filerobot/utils/lib/constants'
import { activateApproval, selectActiveVersionUuid, selectApprovalsCurrentUserGalleryRoleName, selectCurrentFile, selectHasPendingApproval, selectIsCurrentUserApproverInPendingApproval, selectIsCurrentUserAssetOwner, selectVersionsWithApprovalsArray } from '../../../common.slice';
import Approval from '../../Approval';
import useApprovals from '../../../hooks/useApprovals';
import { useRequestApprovalModal } from '../../Modals/RequestApproval';
import NoResultsIcon from './NoResultsIcon';
import ListViewSkeleton from './ListViewSkeleton';
import Styled from './ListView.styled';
import { useApprovalsHistoryModal } from '../../Modals/ApprovalsHistory';
import ModalViewSkeleton from '../ModalView/ModalViewSkeleton';
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
var ListView = function ListView(_ref) {
var approvals = _ref.approvals,
onActivateApproval = _ref.onActivateApproval,
originalFile = _ref.originalFile,
_ref$isLoading = _ref.isLoading,
isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
_ref$forHistoryModal = _ref.forHistoryModal,
forHistoryModal = _ref$forHistoryModal === void 0 ? false : _ref$forHistoryModal,
_ref$isModalViewMode = _ref.isModalViewMode,
isModalViewMode = _ref$isModalViewMode === void 0 ? false : _ref$isModalViewMode,
_ref$marginBottom = _ref.marginBottom,
marginBottom = _ref$marginBottom === void 0 ? 0 : _ref$marginBottom,
onClickDetailsButton = _ref.onClickDetailsButton,
_ref$approvalsListVie = _ref.approvalsListViewStyle,
approvalsListViewStyle = _ref$approvalsListVie === void 0 ? {} : _ref$approvalsListVie;
var _useApprovals = useApprovals(),
i18n = _useApprovals.i18n,
manageApprovalsGalleryRoles = _useApprovals.opts.manageApprovalsGalleryRoles;
var dispatch = useDispatch();
var triggerRequestApprovalModal = useRequestApprovalModal();
var currentUserGalleryRoleName = useSelector(selectApprovalsCurrentUserGalleryRoleName);
var hasPendingApproval = useSelector(selectHasPendingApproval);
var isCurrentUserApproverInPendingApproval = useSelector(selectIsCurrentUserApproverInPendingApproval);
var isCurrentUserAssetOwner = useSelector(selectIsCurrentUserAssetOwner);
var hasCreateApprovalPerm = manageApprovalsGalleryRoles.includes(currentUserGalleryRoleName) || isCurrentUserAssetOwner;
var versions = useSelector(selectVersionsWithApprovalsArray);
var activeVersionUuid = useSelector(selectActiveVersionUuid); // Only for History case
var triggerApprovalsHistoryModal = useApprovalsHistoryModal();
var _ref2 = useSelector(selectCurrentFile) || {},
fileUuid = _ref2.uuid;
// TODO: use approvedVersionUuid later
// const approvedVersionUuid = useMemo(() => (
// versions.find(({ latestApprovalStatus, latestApprovalVoteStatus }) => (
// latestApprovalStatus !== APPROVAL_STATUSES.PENDING && latestApprovalVoteStatus === APPROVAL_STATUSES.APPROVED
// ))?.uuid
// ), [versions])
var handleApprovalActivation = useCallback(function () {
var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
if (typeof onActivateApproval === 'function') {
return onActivateApproval(data);
}
dispatch(activateApproval(data));
}, [dispatch, onActivateApproval]);
var handleNewApprovalClick = function handleNewApprovalClick() {
triggerRequestApprovalModal({
originalFile: originalFile
});
};
var renderNoApprovalsSection = function renderNoApprovalsSection(title, desc) {
var showRequestBtn = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
return /*#__PURE__*/_jsxs(Styled.NoApprovals, {
children: [/*#__PURE__*/_jsxs(Styled.NoApprovalsContent, {
children: [/*#__PURE__*/_jsx(NoResultsIcon, {}), /*#__PURE__*/_jsxs(Styled.NoApprovalsDesc, {
children: [/*#__PURE__*/_jsx(Styled.NoApprovalsTitle, {
children: title
}), desc]
})]
}), showRequestBtn && hasCreateApprovalPerm && /*#__PURE__*/_jsx(Button, {
size: "md",
color: "secondary",
onClick: handleNewApprovalClick,
children: i18n('approvalsRequestButton')
})]
});
};
var renderBody = function renderBody() {
if (approvals.length === 0) {
var isCurrentVersion = activeVersionUuid === fileUuid;
if (forHistoryModal && (!isCurrentVersion || !hasCreateApprovalPerm)) {
return renderNoApprovalsSection(i18n('approvalsVersionEmptyListTitle'));
}
return renderNoApprovalsSection(i18n('approvalsEmptyListTitle'), i18n(hasCreateApprovalPerm ? 'approvalsEmptyListDescription' : 'approvalsEmptyListNoPermsDescription'), true);
}
return /*#__PURE__*/_jsxs(_Fragment, {
children: [hasCreateApprovalPerm && !isCurrentUserApproverInPendingApproval && !forHistoryModal && !isModalViewMode && /*#__PURE__*/_jsx(Button, {
startIcon: function startIcon(iconsProps) {
return /*#__PURE__*/_jsx(PlusOutline, _objectSpread(_objectSpread({}, iconsProps), {}, {
size: 14
}));
},
onClick: handleNewApprovalClick,
disabled: hasPendingApproval,
children: i18n('approvalsStartNewButton')
}), approvals.map(function (approval) {
return /*#__PURE__*/_jsx(Approval, {
approval: approval,
i18n: i18n,
onActivateApproval: handleApprovalActivation,
readOnly: forHistoryModal,
onClickDetailsButton: onClickDetailsButton,
isModalViewMode: isModalViewMode,
marginBottom: marginBottom
}, approval.uuid);
})]
});
};
var renderHistoryButton = function renderHistoryButton() {
var disabled = versions.length <= 1;
var button = /*#__PURE__*/_jsx(Styled.HistoryButton, {
onClick: triggerApprovalsHistoryModal,
startIcon: function startIcon(iconProps) {
return /*#__PURE__*/_jsx(VersioningOutline, _objectSpread({}, iconProps));
},
color: "link-primary",
disabled: disabled,
children: i18n('approvalsHistoryLabel')
});
return disabled ? /*#__PURE__*/_jsx(TooltipV2, {
title: i18n('approvalsNoVersionsHistoryBtnTooltip'),
position: "bottom-end",
size: "md",
children: /*#__PURE__*/_jsx("span", {
children: button
})
}) : button;
};
if (isLoading) {
if (isModalViewMode) return /*#__PURE__*/_jsx(ModalViewSkeleton, {});
return /*#__PURE__*/_jsx(ListViewSkeleton, {});
}
var renderTitleHeader = function renderTitleHeader() {
if (isModalViewMode || forHistoryModal) return null;
return /*#__PURE__*/_jsxs(Styled.Header, {
children: [/*#__PURE__*/_jsx(Styled.HeaderTitle, {
children: i18n('approvalsListViewTitle')
}), renderHistoryButton()]
});
};
return /*#__PURE__*/_jsxs(Styled.Container, {
noPaddings: forHistoryModal,
style: approvalsListViewStyle,
children: [renderTitleHeader(), /*#__PURE__*/_jsx(Styled.Body, {
isModalViewMode: isModalViewMode,
children: renderBody()
})]
});
};
export default ListView;