@orfeas126/box-ui-elements
Version:
Box UI Elements
593 lines (536 loc) • 35.8 kB
JavaScript
/*!
* Box UI Element
*
* Copyright 2019 Box, Inc. All rights reserved.
*
* This product includes software developed by Box, Inc. ("Box")
* (http://www.box.com)
*
* ALL BOX SOFTWARE IS PROVIDED "AS IS" AND ANY EXPRESS OR IMPLIED
* WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED.
* IN NO EVENT SHALL BOX BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
* SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
* LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
* DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
* THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
* (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
* OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*
* See the Box license for the specific language governing permissions
* and limitations under the license.
*/
;
(globalThis["webpackChunk_orfeas126_box_ui_elements"] = globalThis["webpackChunk_orfeas126_box_ui_elements"] || []).push([["metadata-sidebar-redesigned"],{
/***/ "./src/elements/content-sidebar/MetadataInstanceEditor.tsx":
/*!*****************************************************************!*\
!*** ./src/elements/content-sidebar/MetadataInstanceEditor.tsx ***!
\*****************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _box_metadata_editor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @box/metadata-editor */ "./node_modules/@box/metadata-editor/esm/lib/components/metadata-instance-editor/subcomponents/metadata-instance-form/metadata-instance-form.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
const MetadataInstanceEditor = ({
areAiSuggestionsAvailable,
isBoxAiSuggestionsEnabled,
isDeleteButtonDisabled,
isUnsavedChangesModalOpen,
onCancel,
onDelete,
onDiscardUnsavedChanges,
onSubmit,
setIsUnsavedChangesModalOpen,
taxonomyOptionsFetcher,
template
}) => {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_box_metadata_editor__WEBPACK_IMPORTED_MODULE_1__.MetadataInstanceForm, {
areAiSuggestionsAvailable: areAiSuggestionsAvailable,
isAiSuggestionsFeatureEnabled: isBoxAiSuggestionsEnabled,
isDeleteButtonDisabled: isDeleteButtonDisabled,
isUnsavedChangesModalOpen: isUnsavedChangesModalOpen,
onCancel: onCancel,
onDelete: onDelete,
onDiscardUnsavedChanges: onDiscardUnsavedChanges,
onSubmit: onSubmit,
selectedTemplateInstance: template,
setIsUnsavedChangesModalOpen: setIsUnsavedChangesModalOpen,
taxonomyOptionsFetcher: taxonomyOptionsFetcher
});
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MetadataInstanceEditor);
/***/ }),
/***/ "./src/elements/content-sidebar/MetadataSidebarRedesign.tsx":
/*!******************************************************************!*\
!*** ./src/elements/content-sidebar/MetadataSidebarRedesign.tsx ***!
\******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ MetadataSidebarRedesignComponent: () => (/* binding */ MetadataSidebarRedesign),
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var lodash_flow__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lodash/flow */ "./node_modules/lodash/flow.js");
/* harmony import */ var lodash_flow__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash_flow__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! react-intl */ "./node_modules/react-intl/lib/src/components/useIntl.js");
/* harmony import */ var react_intl__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! react-intl */ "./node_modules/react-intl/lib/src/components/message.js");
/* harmony import */ var _box_blueprint_web__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! @box/blueprint-web */ "./node_modules/@box/blueprint-web/lib-esm/primitives/inline-error/inline-error.js");
/* harmony import */ var _box_blueprint_web__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @box/blueprint-web */ "./node_modules/@box/blueprint-web/lib-esm/loading-indicator/loading-indicator.js");
/* harmony import */ var _box_metadata_editor__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! @box/metadata-editor */ "./node_modules/@box/metadata-editor/esm/lib/components/add-metadata-template-dropdown/add-metadata-template-dropdown.js");
/* harmony import */ var _box_metadata_editor__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @box/metadata-editor */ "./node_modules/@box/metadata-editor/esm/lib/components/metadata-empty-state/metadata-empty-state.js");
/* harmony import */ var _box_metadata_editor__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @box/metadata-editor */ "./node_modules/@box/metadata-editor/esm/lib/utils/autofill-context.js");
/* harmony import */ var _box_metadata_editor__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @box/metadata-editor */ "./node_modules/@box/metadata-editor/esm/lib/components/metadata-instance-list/metadata-instance-list.js");
/* harmony import */ var _SidebarContent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./SidebarContent */ "./src/elements/content-sidebar/SidebarContent.js");
/* harmony import */ var _common_api_context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../common/api-context */ "./src/elements/common/api-context/index.js");
/* harmony import */ var _common_error_boundary__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../common/error-boundary */ "./src/elements/common/error-boundary/index.js");
/* harmony import */ var _common_logger__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../common/logger */ "./src/elements/common/logger/index.js");
/* harmony import */ var _common_feature_checking__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../common/feature-checking */ "./src/elements/common/feature-checking/index.js");
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../constants */ "./src/constants.js");
/* harmony import */ var _common_logger_constants__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../common/logger/constants */ "./src/elements/common/logger/constants.js");
/* harmony import */ var _utils_performance__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../utils/performance */ "./src/utils/performance.js");
/* harmony import */ var _hooks_useSidebarMetadataFetcher__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./hooks/useSidebarMetadataFetcher */ "./src/elements/content-sidebar/hooks/useSidebarMetadataFetcher.ts");
/* harmony import */ var _common_messages__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../common/messages */ "./src/elements/common/messages.js");
/* harmony import */ var _MetadataSidebarRedesign_scss__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./MetadataSidebarRedesign.scss */ "./src/elements/content-sidebar/MetadataSidebarRedesign.scss");
/* harmony import */ var _MetadataInstanceEditor__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./MetadataInstanceEditor */ "./src/elements/content-sidebar/MetadataInstanceEditor.tsx");
/* harmony import */ var _utils_convertTemplateToTemplateInstance__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./utils/convertTemplateToTemplateInstance */ "./src/elements/content-sidebar/utils/convertTemplateToTemplateInstance.ts");
/* harmony import */ var _utils_isExtensionSupportedForMetadataSuggestions__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./utils/isExtensionSupportedForMetadataSuggestions */ "./src/elements/content-sidebar/utils/isExtensionSupportedForMetadataSuggestions.ts");
/* harmony import */ var _fetchers_metadataTaxonomyFetcher__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./fetchers/metadataTaxonomyFetcher */ "./src/elements/content-sidebar/fetchers/metadataTaxonomyFetcher.ts");
/**
* @file Redesigned Metadata sidebar component
* @author Box
*/
const MARK_NAME_JS_READY = `${_constants__WEBPACK_IMPORTED_MODULE_7__.ORIGIN_METADATA_SIDEBAR_REDESIGN}_${_common_logger_constants__WEBPACK_IMPORTED_MODULE_8__.EVENT_JS_READY}`;
(0,_utils_performance__WEBPACK_IMPORTED_MODULE_9__.mark)(MARK_NAME_JS_READY);
function MetadataSidebarRedesign({
api,
elementId,
fileId,
onError,
isFeatureEnabled
}) {
const {
extractSuggestions,
file,
handleCreateMetadataInstance,
handleDeleteMetadataInstance,
handleUpdateMetadataInstance,
templates,
errorMessage,
status,
templateInstances
} = (0,_hooks_useSidebarMetadataFetcher__WEBPACK_IMPORTED_MODULE_10__["default"])(api, fileId, onError, isFeatureEnabled);
const {
formatMessage
} = (0,react_intl__WEBPACK_IMPORTED_MODULE_17__["default"])();
const isBoxAiSuggestionsEnabled = (0,_common_feature_checking__WEBPACK_IMPORTED_MODULE_6__.useFeatureEnabled)('metadata.aiSuggestions.enabled');
const [editingTemplate, setEditingTemplate] = react__WEBPACK_IMPORTED_MODULE_0__.useState(null);
const [isUnsavedChangesModalOpen, setIsUnsavedChangesModalOpen] = react__WEBPACK_IMPORTED_MODULE_0__.useState(false);
const [isDeleteButtonDisabled, setIsDeleteButtonDisabled] = react__WEBPACK_IMPORTED_MODULE_0__.useState(false);
const [selectedTemplates, setSelectedTemplates] = react__WEBPACK_IMPORTED_MODULE_0__.useState(templateInstances);
const [pendingTemplateToEdit, setPendingTemplateToEdit] = react__WEBPACK_IMPORTED_MODULE_0__.useState(null);
react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {
// disable only pre-existing template instances from dropdown if not editing or editing pre-exiting one
const isEditingTemplateAlreadyExisting = editingTemplate && templateInstances.some(t => t.templateKey === editingTemplate.templateKey && t.scope === editingTemplate.scope);
if (!editingTemplate || isEditingTemplateAlreadyExisting) {
setSelectedTemplates(templateInstances);
} else {
setSelectedTemplates([...templateInstances, editingTemplate]);
}
}, [editingTemplate, templateInstances, templateInstances.length]);
const handleTemplateSelect = selectedTemplate => {
if (editingTemplate) {
setPendingTemplateToEdit((0,_utils_convertTemplateToTemplateInstance__WEBPACK_IMPORTED_MODULE_14__.convertTemplateToTemplateInstance)(file, selectedTemplate));
setIsUnsavedChangesModalOpen(true);
} else {
setEditingTemplate((0,_utils_convertTemplateToTemplateInstance__WEBPACK_IMPORTED_MODULE_14__.convertTemplateToTemplateInstance)(file, selectedTemplate));
setIsDeleteButtonDisabled(true);
}
};
const handleCancel = () => {
setEditingTemplate(null);
};
const handleDiscardUnsavedChanges = () => {
// check if user tried to edit another template before unsaved changes modal
if (pendingTemplateToEdit) {
setEditingTemplate(pendingTemplateToEdit);
setIsDeleteButtonDisabled(true);
setPendingTemplateToEdit(null);
} else {
handleCancel();
}
setIsUnsavedChangesModalOpen(false);
};
const handleDeleteInstance = async metadataInstance => {
try {
await handleDeleteMetadataInstance(metadataInstance);
} catch {
// ignore error, handled in useSidebarMetadataFetcher
}
setEditingTemplate(null);
};
const isExistingMetadataInstance = () => {
return editingTemplate && !!templateInstances.find(templateInstance => templateInstance.id === editingTemplate.id);
};
const handleSubmit = async (values, operations) => {
if (isExistingMetadataInstance()) {
await handleUpdateMetadataInstance(values.metadata, operations, () => setEditingTemplate(null));
} else {
await handleCreateMetadataInstance(values.metadata, () => setEditingTemplate(null));
}
};
const metadataDropdown = status === _hooks_useSidebarMetadataFetcher__WEBPACK_IMPORTED_MODULE_10__.STATUS.SUCCESS && templates && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_box_metadata_editor__WEBPACK_IMPORTED_MODULE_18__.AddMetadataTemplateDropdown, {
availableTemplates: templates,
selectedTemplates: selectedTemplates,
onSelect: handleTemplateSelect
});
const errorMessageDisplay = status === _hooks_useSidebarMetadataFetcher__WEBPACK_IMPORTED_MODULE_10__.STATUS.ERROR && errorMessage && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_box_blueprint_web__WEBPACK_IMPORTED_MODULE_19__.InlineError, {
className: "bcs-MetadataSidebarRedesign-inline-error"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_intl__WEBPACK_IMPORTED_MODULE_20__["default"], errorMessage));
const showTemplateInstances = file && templates && templateInstances;
const showLoading = status === _hooks_useSidebarMetadataFetcher__WEBPACK_IMPORTED_MODULE_10__.STATUS.LOADING;
const showEmptyState = !showLoading && showTemplateInstances && templateInstances.length === 0 && !editingTemplate;
const showEditor = !showEmptyState && editingTemplate;
const showList = !showEditor && templateInstances.length > 0 && !editingTemplate;
const areAiSuggestionsAvailable = (0,_utils_isExtensionSupportedForMetadataSuggestions__WEBPACK_IMPORTED_MODULE_15__.isExtensionSupportedForMetadataSuggestions)(file?.extension ?? '');
const taxonomyOptionsFetcher = async (scope, templateKey, fieldKey, level, options) => (0,_fetchers_metadataTaxonomyFetcher__WEBPACK_IMPORTED_MODULE_16__.metadataTaxonomyFetcher)(api, fileId, scope, templateKey, fieldKey, level, options);
const taxonomyNodeFetcher = async (scope, taxonomyKey, nodeID) => (0,_fetchers_metadataTaxonomyFetcher__WEBPACK_IMPORTED_MODULE_16__.metadataTaxonomyNodeAncestorsFetcher)(api, fileId, scope, taxonomyKey, nodeID);
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_SidebarContent__WEBPACK_IMPORTED_MODULE_2__["default"], {
actions: metadataDropdown,
className: 'bcs-MetadataSidebarRedesign',
elementId: elementId,
sidebarView: _constants__WEBPACK_IMPORTED_MODULE_7__.SIDEBAR_VIEW_METADATA,
title: formatMessage(_common_messages__WEBPACK_IMPORTED_MODULE_11__["default"].sidebarMetadataTitle)
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("div", {
className: "bcs-MetadataSidebarRedesign-content"
}, errorMessageDisplay, showLoading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_box_blueprint_web__WEBPACK_IMPORTED_MODULE_21__.LoadingIndicator, {
"aria-label": formatMessage(_common_messages__WEBPACK_IMPORTED_MODULE_11__["default"].loading)
}), showEmptyState && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_box_metadata_editor__WEBPACK_IMPORTED_MODULE_22__.MetadataEmptyState, {
level: 'file',
isBoxAiSuggestionsFeatureEnabled: isBoxAiSuggestionsEnabled
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_box_metadata_editor__WEBPACK_IMPORTED_MODULE_23__.AutofillContextProvider, {
fetchSuggestions: extractSuggestions,
isAiSuggestionsFeatureEnabled: isBoxAiSuggestionsEnabled
}, editingTemplate && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_MetadataInstanceEditor__WEBPACK_IMPORTED_MODULE_13__["default"], {
areAiSuggestionsAvailable: areAiSuggestionsAvailable,
isBoxAiSuggestionsEnabled: isBoxAiSuggestionsEnabled,
isDeleteButtonDisabled: isDeleteButtonDisabled,
isUnsavedChangesModalOpen: isUnsavedChangesModalOpen,
onCancel: handleCancel,
onDelete: handleDeleteInstance,
onDiscardUnsavedChanges: handleDiscardUnsavedChanges,
onSubmit: handleSubmit,
setIsUnsavedChangesModalOpen: setIsUnsavedChangesModalOpen,
taxonomyOptionsFetcher: taxonomyOptionsFetcher,
template: editingTemplate
}), showList && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_box_metadata_editor__WEBPACK_IMPORTED_MODULE_24__.MetadataInstanceList, {
areAiSuggestionsAvailable: areAiSuggestionsAvailable,
isAiSuggestionsFeatureEnabled: isBoxAiSuggestionsEnabled,
onEdit: templateInstance => {
setEditingTemplate(templateInstance);
setIsDeleteButtonDisabled(false);
},
templateInstances: templateInstances,
taxonomyNodeFetcher: taxonomyNodeFetcher
}))));
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (lodash_flow__WEBPACK_IMPORTED_MODULE_1___default()([(0,_common_logger__WEBPACK_IMPORTED_MODULE_5__.withLogger)(_constants__WEBPACK_IMPORTED_MODULE_7__.ORIGIN_METADATA_SIDEBAR_REDESIGN), (0,_common_error_boundary__WEBPACK_IMPORTED_MODULE_4__.withErrorBoundary)(_constants__WEBPACK_IMPORTED_MODULE_7__.ORIGIN_METADATA_SIDEBAR_REDESIGN), _common_api_context__WEBPACK_IMPORTED_MODULE_3__.withAPIContext])(MetadataSidebarRedesign));
/***/ }),
/***/ "./src/elements/content-sidebar/fetchers/metadataTaxonomyFetcher.ts":
/*!**************************************************************************!*\
!*** ./src/elements/content-sidebar/fetchers/metadataTaxonomyFetcher.ts ***!
\**************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ metadataTaxonomyFetcher: () => (/* binding */ metadataTaxonomyFetcher),
/* harmony export */ metadataTaxonomyNodeAncestorsFetcher: () => (/* binding */ metadataTaxonomyNodeAncestorsFetcher)
/* harmony export */ });
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); }
const metadataTaxonomyFetcher = async (api, fileId, scope, templateKey, fieldKey, level, options) => {
const metadataOptions = await api.getMetadataAPI(false).getMetadataOptions(fileId, scope, templateKey, fieldKey, level, options);
const {
marker = null
} = options;
return {
options: metadataOptions.entries.map(metadataOption => ({
value: metadataOption.id,
displayValue: metadataOption.display_name
})),
marker
};
};
const metadataTaxonomyNodeAncestorsFetcher = async (api, fileID, scope, taxonomyKey, nodeID) => {
const [metadataTaxonomy, metadataTaxonomyNode] = await Promise.all([api.getMetadataAPI(false).getMetadataTaxonomy(fileID, scope, taxonomyKey), api.getMetadataAPI(false).getMetadataTaxonomyNode(fileID, scope, taxonomyKey, nodeID, true)]);
if (!metadataTaxonomy?.levels) {
return [];
}
// Create a hashmap of levels to easily hydrate with data from metadataTaxonomyNode
const levelsMap = new Map();
for (const item of metadataTaxonomy.levels) {
const levelData = {
level: item.level,
levelName: item.displayName,
description: item.description
};
// If the level matches the metadataTaxonomyNode level, hydrate the level with the node data
if (metadataTaxonomyNode.level === item.level) {
levelsMap.set(item.level, _objectSpread(_objectSpread({}, levelData), {}, {
id: metadataTaxonomyNode.id,
levelValue: metadataTaxonomyNode.displayName
}));
// If the level is not the metadataTaxonomyNode level, just add the level data
} else {
levelsMap.set(item.level, levelData);
}
}
// Hydrate the levels with the ancestors data from the metadataTaxonomyNode
if (metadataTaxonomyNode.ancestors?.length) {
for (const ancestor of metadataTaxonomyNode.ancestors) {
const levelData = levelsMap.get(ancestor.level);
if (levelData) {
levelsMap.set(ancestor.level, _objectSpread(_objectSpread({}, levelData), {}, {
levelValue: ancestor.displayName,
id: ancestor.id
}));
}
}
}
// Filter out levels that were not hydrated by metadataTaxonomyNode
const hydratedLevels = Array.from(levelsMap.values()).filter(level => !!level.id);
// Return the hydrated levels as an array
return hydratedLevels;
};
/***/ }),
/***/ "./src/elements/content-sidebar/hooks/useSidebarMetadataFetcher.ts":
/*!*************************************************************************!*\
!*** ./src/elements/content-sidebar/hooks/useSidebarMetadataFetcher.ts ***!
\*************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ STATUS: () => (/* binding */ STATUS),
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var lodash_get__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lodash/get */ "./node_modules/lodash/get.js");
/* harmony import */ var lodash_get__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lodash_get__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var lodash_isEmpty__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! lodash/isEmpty */ "./node_modules/lodash/isEmpty.js");
/* harmony import */ var lodash_isEmpty__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(lodash_isEmpty__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _utils_error__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../utils/error */ "./src/utils/error.js");
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../constants */ "./src/constants.js");
/* harmony import */ var _common_messages__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../common/messages */ "./src/elements/common/messages.js");
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); }
let STATUS = /*#__PURE__*/function (STATUS) {
STATUS["IDLE"] = "idle";
STATUS["LOADING"] = "loading";
STATUS["ERROR"] = "error";
STATUS["SUCCESS"] = "success";
return STATUS;
}({});
function useSidebarMetadataFetcher(api, fileId, onError, isFeatureEnabled) {
const [status, setStatus] = react__WEBPACK_IMPORTED_MODULE_0__.useState(STATUS.IDLE);
const [file, setFile] = react__WEBPACK_IMPORTED_MODULE_0__.useState(null);
const [templates, setTemplates] = react__WEBPACK_IMPORTED_MODULE_0__.useState(null);
const [errorMessage, setErrorMessage] = react__WEBPACK_IMPORTED_MODULE_0__.useState(null);
const [templateInstances, setTemplateInstances] = react__WEBPACK_IMPORTED_MODULE_0__.useState([]);
const onApiError = react__WEBPACK_IMPORTED_MODULE_0__.useCallback((error, code, message) => {
const {
status: errorStatus
} = error;
const isValidError = (0,_utils_error__WEBPACK_IMPORTED_MODULE_3__.isUserCorrectableError)(errorStatus);
setStatus(STATUS.ERROR);
setErrorMessage(message);
onError(error, code, {
error,
isErrorDisplayed: isValidError
});
}, [onError]);
const fetchMetadataSuccessCallback = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(({
templates: fetchedTemplates,
templateInstances: fetchedTemplateInstances
}) => {
setErrorMessage(null);
setStatus(STATUS.SUCCESS);
setTemplateInstances(fetchedTemplateInstances);
setTemplates(fetchedTemplates);
}, []);
const fetchMetadataErrorCallback = react__WEBPACK_IMPORTED_MODULE_0__.useCallback((e, code) => {
setTemplates(null);
setTemplateInstances(null);
onApiError(e, code, _common_messages__WEBPACK_IMPORTED_MODULE_5__["default"].sidebarMetadataFetchingErrorContent);
}, [onApiError]);
const fetchMetadata = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(fetchedFile => {
api.getMetadataAPI(false).getMetadata(fetchedFile, fetchMetadataSuccessCallback, fetchMetadataErrorCallback, isFeatureEnabled, {
refreshCache: true
}, true);
}, [api, fetchMetadataErrorCallback, fetchMetadataSuccessCallback, isFeatureEnabled]);
const fetchFileSuccessCallback = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(fetchedFile => {
const {
currentFile
} = file ?? {};
const currentFileCanUpload = lodash_get__WEBPACK_IMPORTED_MODULE_1___default()(currentFile, _constants__WEBPACK_IMPORTED_MODULE_4__.FIELD_PERMISSIONS_CAN_UPLOAD, false);
const newFileCanUpload = lodash_get__WEBPACK_IMPORTED_MODULE_1___default()(fetchedFile, _constants__WEBPACK_IMPORTED_MODULE_4__.FIELD_PERMISSIONS_CAN_UPLOAD, false);
const shouldFetchMetadata = !currentFile || currentFileCanUpload !== newFileCanUpload;
setFile(fetchedFile);
if (shouldFetchMetadata && fetchedFile) {
fetchMetadata(fetchedFile);
} else {
setStatus(STATUS.SUCCESS);
}
}, [fetchMetadata, file]);
const fetchFileErrorCallback = react__WEBPACK_IMPORTED_MODULE_0__.useCallback((e, code) => {
setFile(undefined);
onApiError(e, code, _common_messages__WEBPACK_IMPORTED_MODULE_5__["default"].sidebarMetadataEditingErrorContent);
}, [onApiError]);
const handleDeleteMetadataInstance = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(async metadataInstance => {
if (!file || !metadataInstance) {
return;
}
setStatus(STATUS.LOADING);
await api.getMetadataAPI(false).deleteMetadata(file, metadataInstance, () => setStatus(STATUS.SUCCESS), (error, code) => {
onApiError(error, code, _common_messages__WEBPACK_IMPORTED_MODULE_5__["default"].sidebarMetadataEditingErrorContent);
}, true);
}, [api, onApiError, file]);
const handleCreateMetadataInstance = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(async (templateInstance, successCallback) => {
await api.getMetadataAPI(false).createMetadataRedesign(file, templateInstance, successCallback, (error, code) => onApiError(error, code, _common_messages__WEBPACK_IMPORTED_MODULE_5__["default"].sidebarMetadataEditingErrorContent));
}, [api, file, onApiError]);
const handleUpdateMetadataInstance = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(async (metadataInstance, JSONPatch, successCallback) => {
await api.getMetadataAPI(false).updateMetadataRedesign(file, metadataInstance, JSONPatch, successCallback, (error, code) => {
onApiError(error, code, _common_messages__WEBPACK_IMPORTED_MODULE_5__["default"].sidebarMetadataEditingErrorContent);
});
}, [api, file, onApiError]);
const [, setError] = react__WEBPACK_IMPORTED_MODULE_0__.useState();
const extractSuggestions = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(async (templateKey, fields) => {
const aiAPI = api.getIntelligenceAPI();
let answer = null;
try {
answer = await aiAPI.extractStructured({
items: [{
id: file.id,
type: file.type
}],
fields
});
} catch (error) {
if ((0,_utils_error__WEBPACK_IMPORTED_MODULE_3__.isUserCorrectableError)(error.status)) {
onError(error, _constants__WEBPACK_IMPORTED_MODULE_4__.ERROR_CODE_FETCH_METADATA_SUGGESTIONS, {
showNotification: true
});
} else {
// react way of throwing errors from async callbacks - https://github.com/facebook/react/issues/14981#issuecomment-468460187
setError(() => {
throw error;
});
}
return [];
}
if (lodash_isEmpty__WEBPACK_IMPORTED_MODULE_2___default()(answer)) {
const error = new Error('No suggestions found.');
onError(error, _constants__WEBPACK_IMPORTED_MODULE_4__.ERROR_CODE_EMPTY_METADATA_SUGGESTIONS, {
showNotification: true
});
}
return fields.map(field => {
const value = answer[field.key];
// TODO: @box/metadadata-editor does not support AI suggestions, enable once supported
if (!value || field.type === 'taxonomy') {
return field;
}
return _objectSpread(_objectSpread({}, field), {}, {
aiSuggestion: value
});
});
}, [api, file, onError]);
react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => {
if (status === STATUS.IDLE) {
setStatus(STATUS.LOADING);
api.getFileAPI().getFile(fileId, fetchFileSuccessCallback, fetchFileErrorCallback, {
fields: [_constants__WEBPACK_IMPORTED_MODULE_4__.FIELD_IS_EXTERNALLY_OWNED, _constants__WEBPACK_IMPORTED_MODULE_4__.FIELD_PERMISSIONS],
refreshCache: true
});
}
}, [api, fetchFileErrorCallback, fetchFileSuccessCallback, fileId, status]);
return {
extractSuggestions,
handleCreateMetadataInstance,
handleDeleteMetadataInstance,
handleUpdateMetadataInstance,
errorMessage,
file,
status,
templateInstances,
templates
};
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useSidebarMetadataFetcher);
/***/ }),
/***/ "./src/elements/content-sidebar/utils/convertTemplateToTemplateInstance.ts":
/*!*********************************************************************************!*\
!*** ./src/elements/content-sidebar/utils/convertTemplateToTemplateInstance.ts ***!
\*********************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ convertTemplateToTemplateInstance: () => (/* binding */ convertTemplateToTemplateInstance)
/* harmony export */ });
/* harmony import */ var lodash_uniqueId__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! lodash/uniqueId */ "./node_modules/lodash/uniqueId.js");
/* harmony import */ var lodash_uniqueId__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(lodash_uniqueId__WEBPACK_IMPORTED_MODULE_0__);
const convertTemplateToTemplateInstance = (file, template) => {
return {
canEdit: !!file.permissions.can_upload,
displayName: template.displayName,
hidden: template.hidden,
id: lodash_uniqueId__WEBPACK_IMPORTED_MODULE_0___default()('metadata_template_'),
fields: template.fields,
scope: template.scope,
templateKey: template.templateKey,
type: template.type
};
};
/***/ }),
/***/ "./src/elements/content-sidebar/utils/isExtensionSupportedForMetadataSuggestions.ts":
/*!******************************************************************************************!*\
!*** ./src/elements/content-sidebar/utils/isExtensionSupportedForMetadataSuggestions.ts ***!
\******************************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ isExtensionSupportedForMetadataSuggestions: () => (/* binding */ isExtensionSupportedForMetadataSuggestions)
/* harmony export */ });
/**
* @file Metadata suggestions supported extensions
* @author Box
*/
const SUPPORTED_FILE_EXTENSIONS = new Set([
// Text-Based Documents
'as', 'as3', 'asm', 'bat', 'c', 'cc', 'cmake', 'cpp', 'cs', 'css', 'csv', 'cxx', 'diff', 'doc', 'docx', 'erb', 'gdoc', 'groovy', 'gsheet', 'h', 'haml', 'hh', 'htm', 'html', 'java', 'js', 'json', 'less', 'log', 'm', 'make', 'md', 'ml', 'mm', 'msg', 'ods', 'odt', 'pages', 'pdf', 'php', 'pl', 'properties', 'py', 'rb', 'rst', 'rtf', 'sass', 'scala', 'scm', 'script', 'sh', 'sml', 'sql', 'txt', 'vi', 'vim', 'webdoc', 'wpd', 'xhtml', 'xls', 'xlsb', 'xlsm', 'xlsx', 'xml', 'xsd', 'xsl', 'xbd', 'xdw', 'yaml',
// Presentations
'gslide', 'gslides', 'key', 'odp', 'ppt', 'pptx']);
function isExtensionSupportedForMetadataSuggestions(extension) {
return SUPPORTED_FILE_EXTENSIONS.has(extension);
}
/***/ }),
/***/ "./src/elements/content-sidebar/MetadataSidebarRedesign.scss":
/*!*******************************************************************!*\
!*** ./src/elements/content-sidebar/MetadataSidebarRedesign.scss ***!
\*******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ })
}]);
//# sourceMappingURL=metadata-sidebar-redesigned.no.react.js.map