@reltio/components 1.4.1861 → 1.4.1863

package/esm/components/RelationEditor/RelationEditor.js

@@ -193,7 +193,7 @@ var RelationEditor = function (_a) {
                         React.createElement(EntitySelector, { className: classnames(styles.item, (_b = {},
                                 _b[styles.dense] = errorMessage ||
                                     (connection.entity && isTempUri(connection.entity.entityUri)),
-                                _b)), entity: connection.entity || {}, entityTypesUris: getEntityTypesUris() || [], max: config.max || 20, globalSearchRequestOptions: globalSearchRequestOptions, mode: mode, onChange: onChangeEntity, onCreate: canCreateNewEntity ? onCreateEntity : undefined, metadata: metadata, attributeTypesSelectionStrategy: relationEditorAttributeTypesSelectionStrategy }))),
+                                _b)), entity: connection.entity || {}, entityTypesUris: getEntityTypesUris() || [], globalSearchRequestOptions: globalSearchRequestOptions, mode: mode, onChange: onChangeEntity, onCreate: canCreateNewEntity ? onCreateEntity : undefined, metadata: metadata, attributeTypesSelectionStrategy: relationEditorAttributeTypesSelectionStrategy }))),
                 React.createElement(EditModeAttributesList, { className: styles.item, attrTypes: firstLevelRelationAttrTypes, entity: attributeListEntity, showEmptyEditors: true, mode: mode, parentUri: relationUri, onAddAttributes: onAddAttributes, onChangeAttribute: onChangeAttribute, onDeleteAttribute: onDeleteAttribute })))),
         React.createElement("div", { className: styles.actionButtons },
             React.createElement(Button, { onClick: onCancel }, i18n.text('Cancel')),

package/esm/contexts/MaskedAttributesContext/context.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+import { SimpleAttributeValue } from '@reltio/mdm-sdk';
+type UnmaskedAttributes = Record<string, {
+    attributeValue?: SimpleAttributeValue;
+    loading?: boolean;
+    isUnmasked?: boolean;
+}>;
+export type MaskedAttributesContextType = {
+    unmaskedAttributes: UnmaskedAttributes;
+    unmaskAttributeValue: (attributeValueUri: string) => Promise<SimpleAttributeValue>;
+    maskAttributeValue: (attributeValueUri: string) => void;
+};
+export declare const MaskedAttributesContext: import("@fluentui/react-context-selector").Context<MaskedAttributesContextType>;
+type Props = {
+    children: ReactNode;
+};
+export declare const MaskedAttributesProvider: ({ children }: Props) => JSX.Element;
+export {};

package/esm/contexts/MaskedAttributesContext/context.js

@@ -0,0 +1,114 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import React, { useState, useCallback, useEffect, useRef } from 'react';
+import { createContext } from '@fluentui/react-context-selector';
+import { getUnmaskedAttributeValue } from '@reltio/mdm-sdk';
+import { showErrorMessage } from '../../core';
+import { useMdmProfileLastLoadedTime } from '../MdmModuleContext';
+export var MaskedAttributesContext = createContext({
+    unmaskedAttributes: {},
+    unmaskAttributeValue: undefined,
+    maskAttributeValue: undefined
+});
+export var MaskedAttributesProvider = function (_a) {
+    var children = _a.children;
+    var _b = useState({}), unmaskedAttributes = _b[0], setUnmaskedAttributes = _b[1];
+    var profileLastLoadedTime = useMdmProfileLastLoadedTime();
+    var unmaskedAttributesRef = useRef(unmaskedAttributes);
+    //performance optimization to avoid unnecessary re-renders
+    unmaskedAttributesRef.current = unmaskedAttributes;
+    useEffect(function () {
+        setUnmaskedAttributes({});
+    }, [profileLastLoadedTime]);
+    var unmaskAttributeValue = useCallback(function (attributeValueUri) { return __awaiter(void 0, void 0, void 0, function () {
+        var unmaskedAttributes_1, unmaskedAttributeValue_1, error_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    _a.trys.push([0, 4, , 5]);
+                    unmaskedAttributes_1 = unmaskedAttributesRef.current;
+                    if (!!unmaskedAttributes_1[attributeValueUri]) return [3 /*break*/, 2];
+                    setUnmaskedAttributes(function (prev) {
+                        var _a;
+                        return (__assign(__assign({}, prev), (_a = {}, _a[attributeValueUri] = __assign(__assign({}, prev[attributeValueUri]), { loading: true }), _a)));
+                    });
+                    return [4 /*yield*/, getUnmaskedAttributeValue(attributeValueUri)];
+                case 1:
+                    unmaskedAttributeValue_1 = _a.sent();
+                    setUnmaskedAttributes(function (prev) {
+                        var _a;
+                        return (__assign(__assign({}, prev), (_a = {}, _a[attributeValueUri] = {
+                            attributeValue: unmaskedAttributeValue_1,
+                            isUnmasked: true,
+                            loading: false
+                        }, _a)));
+                    });
+                    return [2 /*return*/, unmaskedAttributeValue_1];
+                case 2:
+                    setUnmaskedAttributes(function (prev) {
+                        var _a;
+                        return (__assign(__assign({}, prev), (_a = {}, _a[attributeValueUri] = __assign(__assign({}, prev[attributeValueUri]), { isUnmasked: true }), _a)));
+                    });
+                    return [2 /*return*/, unmaskedAttributes_1[attributeValueUri].attributeValue];
+                case 3: return [3 /*break*/, 5];
+                case 4:
+                    error_1 = _a.sent();
+                    showErrorMessage(error_1);
+                    return [2 /*return*/, null];
+                case 5: return [2 /*return*/];
+            }
+        });
+    }); }, []);
+    var maskAttributeValue = useCallback(function (attributeValueUri) {
+        setUnmaskedAttributes(function (prev) {
+            var _a;
+            return (__assign(__assign({}, prev), (_a = {}, _a[attributeValueUri] = __assign(__assign({}, prev[attributeValueUri]), { isUnmasked: false }), _a)));
+        });
+    }, []);
+    return (React.createElement(MaskedAttributesContext.Provider, { value: { unmaskedAttributes: unmaskedAttributes, unmaskAttributeValue: unmaskAttributeValue, maskAttributeValue: maskAttributeValue } }, children));
+};

package/esm/contexts/MaskedAttributesContext/hooks.d.ts

@@ -1,3 +1,7 @@
-import { SimpleAttributeValue } from '@reltio/mdm-sdk';
-export declare const useUnmaskedAttributeValue: (attributeValue: SimpleAttributeValue) => SimpleAttributeValue;
-export declare const useAddUnmaskedAttributeValue: () => (attributeValue: SimpleAttributeValue) => Promise<void>;
+export declare const useUnmaskedAttributeValue: (attributeValueUri: string) => {
+    attributeValue?: import("@reltio/mdm-sdk").SimpleAttributeValue;
+    loading?: boolean;
+    isUnmasked?: boolean;
+};
+export declare const useUnmaskAttributeValue: () => (attributeValueUri: string) => Promise<import("@reltio/mdm-sdk").SimpleAttributeValue>;
+export declare const useMaskAttributeValue: () => (attributeValueUri: string) => void;

package/esm/contexts/MaskedAttributesContext/hooks.js

@@ -1,13 +1,21 @@
 import { useContextSelector } from '@fluentui/react-context-selector';
-import { MaskedAttributesContext } from '.';
+import { MaskedAttributesContext } from './context';
 var useMaskedAttributesContext = function (selector) {
     return useContextSelector(MaskedAttributesContext, selector);
 };
-export var useUnmaskedAttributeValue = function (attributeValue) {
-    return useMaskedAttributesContext(function (context) {
-        return context ? context.unmaskedAttributesValues[attributeValue.uri] : attributeValue;
+export var useUnmaskedAttributeValue = function (attributeValueUri) {
+    return useMaskedAttributesContext(function (_a) {
+        var unmaskedAttributes = _a.unmaskedAttributes;
+        return unmaskedAttributes[attributeValueUri];
     });
 };
-export var useAddUnmaskedAttributeValue = function () {
-    return useMaskedAttributesContext(function (context) { return (context ? context.addUnmaskedAttributeValue : Promise.resolve); });
+export var useUnmaskAttributeValue = function () {
+    return useMaskedAttributesContext(function (_a) {
+        var unmaskAttributeValue = _a.unmaskAttributeValue;
+        return unmaskAttributeValue;
+    });
 };
+export var useMaskAttributeValue = function () { return useMaskedAttributesContext(function (_a) {
+    var maskAttributeValue = _a.maskAttributeValue;
+    return maskAttributeValue;
+}); };

package/esm/contexts/MaskedAttributesContext/index.d.ts

@@ -1,13 +1,2 @@
-import { ReactNode } from 'react';
-import { SimpleAttributeValue } from '@reltio/mdm-sdk';
-type UnmaskedAttributesValues = Record<string, SimpleAttributeValue>;
-export type MaskedAttributesContextType = {
-    unmaskedAttributesValues: UnmaskedAttributesValues;
-    addUnmaskedAttributeValue: (attributeValue: SimpleAttributeValue) => Promise<void>;
-};
-export declare const MaskedAttributesContext: import("@fluentui/react-context-selector").Context<MaskedAttributesContextType>;
-type Props = {
-    children: ReactNode;
-};
-export declare const MaskedAttributesProvider: ({ children }: Props) => JSX.Element;
-export {};
+export { MaskedAttributesProvider } from './context';
+export { useUnmaskedAttributeValue, useUnmaskAttributeValue, useMaskAttributeValue } from './hooks';

package/esm/contexts/MaskedAttributesContext/index.js

@@ -1,79 +1,2 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-import React, { useState, useCallback } from 'react';
-import { createContext } from '@fluentui/react-context-selector';
-import { getUnmaskedAttributeValue } from '@reltio/mdm-sdk';
-import { showErrorMessage } from '../../core/errors';
-export var MaskedAttributesContext = createContext(null);
-export var MaskedAttributesProvider = function (_a) {
-    var children = _a.children;
-    var _b = useState({}), unmaskedAttributesValues = _b[0], setUnmaskedAttributesValues = _b[1];
-    var addUnmaskedAttributeValue = useCallback(function (attributeValue) { return __awaiter(void 0, void 0, void 0, function () {
-        var unmaskedAttributeValue_1, error_1;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    _a.trys.push([0, 2, , 3]);
-                    return [4 /*yield*/, getUnmaskedAttributeValue(attributeValue.uri)];
-                case 1:
-                    unmaskedAttributeValue_1 = _a.sent();
-                    setUnmaskedAttributesValues(function (prev) {
-                        var _a;
-                        return (__assign(__assign({}, prev), (_a = {}, _a[attributeValue.uri] = unmaskedAttributeValue_1, _a)));
-                    });
-                    return [3 /*break*/, 3];
-                case 2:
-                    error_1 = _a.sent();
-                    showErrorMessage(error_1);
-                    return [3 /*break*/, 3];
-                case 3: return [2 /*return*/];
-            }
-        });
-    }); }, []);
-    return (React.createElement(MaskedAttributesContext.Provider, { value: { unmaskedAttributesValues: unmaskedAttributesValues, addUnmaskedAttributeValue: addUnmaskedAttributeValue } }, children));
-};
+export { MaskedAttributesProvider } from './context';
+export { useUnmaskedAttributeValue, useUnmaskAttributeValue, useMaskAttributeValue } from './hooks';

package/esm/contexts/index.d.ts

@@ -34,4 +34,4 @@ export { ConfigPermissionsContext, ConfigPermissionsContextProvider, useAttribut
 export * from './MdmModuleContext';
 export { ReloadDataProvider, useReloadData } from './ReloadDataContext';
 export { SegmentationContext } from './SegmentationContext';
-export { MaskedAttributesProvider } from './MaskedAttributesContext';
+export * from './MaskedAttributesContext';

package/esm/contexts/index.js

@@ -34,4 +34,4 @@ export { ConfigPermissionsContext, ConfigPermissionsContextProvider, useAttribut
 export * from './MdmModuleContext';
 export { ReloadDataProvider, useReloadData } from './ReloadDataContext';
 export { SegmentationContext } from './SegmentationContext';
-export { MaskedAttributesProvider } from './MaskedAttributesContext';
+export * from './MaskedAttributesContext';

package/esm/hooks/useMaskedAttribute.d.ts

@@ -8,6 +8,7 @@ declare const useMaskedAttribute: ({ attributeType, attributeValue }: Props) =>
     isMasked: boolean;
     toggleMasking: () => void;
     isUnmasking: boolean;
+    unmask: () => Promise<void> | Promise<SimpleAttributeValue>;
     attributeValue: SimpleAttributeValue;
 };
 export default useMaskedAttribute;

package/esm/hooks/useMaskedAttribute.js

@@ -1,27 +1,29 @@
-import { useEffect, useState, useCallback } from 'react';
-import { useUnmaskedAttributeValue, useAddUnmaskedAttributeValue } from '../contexts/MaskedAttributesContext/hooks';
+import { useCallback } from 'react';
+import { useMaskAttributeValue, useUnmaskAttributeValue, useUnmaskedAttributeValue } from '../contexts/MaskedAttributesContext';
 var useMaskedAttribute = function (_a) {
     var attributeType = _a.attributeType, attributeValue = _a.attributeValue;
-    var isUnmaskingNeeded = !!attributeType.masking;
-    var _b = useState(isUnmaskingNeeded), isMasked = _b[0], setIsMasked = _b[1];
-    var _c = useState(false), isUnmasking = _c[0], setIsUnmasking = _c[1];
-    var addUnmaskedAttributeValue = useAddUnmaskedAttributeValue();
-    var unmaskedAttributeValue = useUnmaskedAttributeValue(attributeValue);
-    useEffect(function () {
-        if (isUnmaskingNeeded && addUnmaskedAttributeValue && !isMasked && unmaskedAttributeValue === undefined) {
-            setIsUnmasking(true);
-            addUnmaskedAttributeValue(attributeValue).finally(function () { return setIsUnmasking(false); });
-        }
-    }, [isUnmaskingNeeded, isMasked, addUnmaskedAttributeValue, attributeValue, unmaskedAttributeValue]);
+    var unmaskAttributeValue = useUnmaskAttributeValue();
+    var maskAttributeValue = useMaskAttributeValue();
+    var _b = useUnmaskedAttributeValue(attributeValue.uri) || {}, unmaskedAttributeValue = _b.attributeValue, _c = _b.isUnmasked, isUnmasked = _c === void 0 ? false : _c, _d = _b.loading, loading = _d === void 0 ? false : _d;
+    var isUnmaskingNeeded = unmaskAttributeValue && maskAttributeValue && !!attributeType.masking;
+    var unmask = useCallback(function () {
+        return isUnmaskingNeeded ? unmaskAttributeValue(attributeValue.uri) : Promise.resolve();
+    }, [unmaskAttributeValue, attributeValue.uri, isUnmaskingNeeded]);
     var toggleMasking = useCallback(function () {
-        setIsMasked(function (prev) { return !prev; });
-    }, []);
+        if (isUnmasked) {
+            maskAttributeValue(attributeValue.uri);
+        }
+        else {
+            unmask();
+        }
+    }, [attributeValue.uri, isUnmasked, maskAttributeValue, unmask]);
     return {
         isUnmaskingNeeded: isUnmaskingNeeded,
-        isMasked: isMasked,
+        isMasked: !isUnmasked,
         toggleMasking: toggleMasking,
-        isUnmasking: isUnmasking,
-        attributeValue: isMasked ? attributeValue : unmaskedAttributeValue || attributeValue
+        isUnmasking: loading,
+        unmask: unmask,
+        attributeValue: isUnmaskingNeeded && isUnmasked ? unmaskedAttributeValue || attributeValue : attributeValue
     };
 };
 export default useMaskedAttribute;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reltio/components",
-  "version": "1.4.1861",
+  "version": "1.4.1863",
   "license": "SEE LICENSE IN LICENSE FILE",
   "main": "./cjs/index.js",
   "module": "./esm/index.js",