@reltio/components 1.4.2022 → 1.4.2024

package/BasicTable/IntegrationBasicTable.test.js

@@ -48,8 +48,6 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
 import React from 'react';
 import { screen, render, within, fireEvent, act } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { mockDndKit } from '../test-utils/dndKit';
-jest.mock('@dnd-kit/core', function () { return mockDndKit; });
 import { BasicTable } from './BasicTable';
 import { CollapseRowButton } from '../CollapseRowButton';
 import { mockBasicTableSizing } from '../test-utils';
@@ -74,15 +72,22 @@ var getRowCellRenderer = function (id) {
             return function () { return null; };
     }
 };
+var onHeadClickFn = jest.fn();
+var HeadCellRenderer = function (_a) {
+    var headCellData = _a.headCellData;
+    return (React.createElement("div", null,
+        React.createElement("button", { onClick: onHeadClickFn }, headCellData.label)));
+};
 var columnsData = [
     {
         autoResize: false,
-        headCellRenderer: function () { return 'first column'; },
+        headCellRenderer: HeadCellRenderer,
         id: 'id1',
         initialWidth: 300,
         label: 'column 1',
         minWidth: 250,
         resizable: true,
+        draggable: true,
         rowCellValueRenderer: getRowCellRenderer('id1'),
         sortable: false
     },
@@ -108,6 +113,8 @@ var defaultProps = {
     headRowHeight: 48,
     defaultColumnWidth: 250,
     defaultColumnMinWidth: 200,
+    dndColumnReorderingEnabled: true,
+    dndColumnReorderingHandler: function () { },
     dndRowReorderingEnabled: true,
     dndRowReorderingHandler: function () { },
     getIdFromRowValue: function (rowValue) { return rowValue.id1.name; },
@@ -121,10 +128,14 @@ var setUp = function (props) {
 };
 describe('basic table tests', function () {
     it('should collapse all rows after start dragging', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var unmockTableSizing, user, getRowByIndex, getCellByIndexes, dragIndicator;
+        var mouse, unmockTableSizing, user, getRowByIndex, getCellByIndexes, dragIndicator;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
+                    mouse = [
+                        { clientX: 0, clientY: 0 },
+                        { clientX: 20, clientY: 20 }
+                    ];
                     unmockTableSizing = mockBasicTableSizing();
                     user = setUp(defaultProps).user;
                     getRowByIndex = function (index) {
@@ -146,10 +157,11 @@ describe('basic table tests', function () {
                     expect(within(getCellByIndexes(0, 1)).queryByText('row 1 value 3')).toBeInTheDocument();
                     expect(within(getCellByIndexes(1, 1)).queryByText('row 2 value 1')).toBeInTheDocument();
                     expect(within(getCellByIndexes(1, 1)).queryByText('row 2 value 2')).toBeInTheDocument();
-                    dragIndicator = within(getCellByIndexes(1, 0)).queryByText('drag el');
+                    dragIndicator = within(getCellByIndexes(1, 0)).getByRole('button', { name: 'drag el' });
                     return [4 /*yield*/, act(function () { return __awaiter(void 0, void 0, void 0, function () {
                             return __generator(this, function (_a) {
-                                fireEvent.mouseDown(dragIndicator);
+                                fireEvent.mouseDown(dragIndicator, mouse[0]);
+                                fireEvent.mouseMove(dragIndicator, mouse[1]);
                                 return [2 /*return*/];
                             });
                         }); })];
@@ -160,9 +172,32 @@ describe('basic table tests', function () {
                     expect(within(getCellByIndexes(0, 1)).queryByText('row 1 value 3')).not.toBeInTheDocument();
                     expect(within(getCellByIndexes(1, 1)).queryByText('row 2 value 1')).toBeInTheDocument();
                     expect(within(getCellByIndexes(1, 1)).queryByText('row 2 value 2')).not.toBeInTheDocument();
+                    return [4 /*yield*/, act(function () { return __awaiter(void 0, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                fireEvent.mouseUp(dragIndicator);
+                                return [2 /*return*/];
+                            });
+                        }); })];
+                case 4:
+                    _a.sent();
                     unmockTableSizing();
                     return [2 /*return*/];
             }
         });
     }); });
+    it('should able to click on buttons in table head', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = setUp(defaultProps).user;
+                    expect(onHeadClickFn).not.toHaveBeenCalled();
+                    return [4 /*yield*/, user.click(screen.getAllByRole('button', { name: columnsData[0].label })[1])];
+                case 1:
+                    _a.sent();
+                    expect(onHeadClickFn).toHaveBeenCalled();
+                    return [2 /*return*/];
+            }
+        });
+    }); });
 });

package/cjs/BasicTable/IntegrationBasicTable.test.js

@@ -53,8 +53,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
 var react_2 = require("@testing-library/react");
 var user_event_1 = __importDefault(require("@testing-library/user-event"));
-var dndKit_1 = require("../test-utils/dndKit");
-jest.mock('@dnd-kit/core', function () { return dndKit_1.mockDndKit; });
 var BasicTable_1 = require("./BasicTable");
 var CollapseRowButton_1 = require("../CollapseRowButton");
 var test_utils_1 = require("../test-utils");
@@ -79,15 +77,22 @@ var getRowCellRenderer = function (id) {
             return function () { return null; };
     }
 };
+var onHeadClickFn = jest.fn();
+var HeadCellRenderer = function (_a) {
+    var headCellData = _a.headCellData;
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement("button", { onClick: onHeadClickFn }, headCellData.label)));
+};
 var columnsData = [
     {
         autoResize: false,
-        headCellRenderer: function () { return 'first column'; },
+        headCellRenderer: HeadCellRenderer,
         id: 'id1',
         initialWidth: 300,
         label: 'column 1',
         minWidth: 250,
         resizable: true,
+        draggable: true,
         rowCellValueRenderer: getRowCellRenderer('id1'),
         sortable: false
     },
@@ -113,6 +118,8 @@ var defaultProps = {
     headRowHeight: 48,
     defaultColumnWidth: 250,
     defaultColumnMinWidth: 200,
+    dndColumnReorderingEnabled: true,
+    dndColumnReorderingHandler: function () { },
     dndRowReorderingEnabled: true,
     dndRowReorderingHandler: function () { },
     getIdFromRowValue: function (rowValue) { return rowValue.id1.name; },
@@ -126,10 +133,14 @@ var setUp = function (props) {
 };
 describe('basic table tests', function () {
     it('should collapse all rows after start dragging', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var unmockTableSizing, user, getRowByIndex, getCellByIndexes, dragIndicator;
+        var mouse, unmockTableSizing, user, getRowByIndex, getCellByIndexes, dragIndicator;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
+                    mouse = [
+                        { clientX: 0, clientY: 0 },
+                        { clientX: 20, clientY: 20 }
+                    ];
                     unmockTableSizing = (0, test_utils_1.mockBasicTableSizing)();
                     user = setUp(defaultProps).user;
                     getRowByIndex = function (index) {
@@ -151,10 +162,11 @@ describe('basic table tests', function () {
                     expect((0, react_2.within)(getCellByIndexes(0, 1)).queryByText('row 1 value 3')).toBeInTheDocument();
                     expect((0, react_2.within)(getCellByIndexes(1, 1)).queryByText('row 2 value 1')).toBeInTheDocument();
                     expect((0, react_2.within)(getCellByIndexes(1, 1)).queryByText('row 2 value 2')).toBeInTheDocument();
-                    dragIndicator = (0, react_2.within)(getCellByIndexes(1, 0)).queryByText('drag el');
+                    dragIndicator = (0, react_2.within)(getCellByIndexes(1, 0)).getByRole('button', { name: 'drag el' });
                     return [4 /*yield*/, (0, react_2.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
                             return __generator(this, function (_a) {
-                                react_2.fireEvent.mouseDown(dragIndicator);
+                                react_2.fireEvent.mouseDown(dragIndicator, mouse[0]);
+                                react_2.fireEvent.mouseMove(dragIndicator, mouse[1]);
                                 return [2 /*return*/];
                             });
                         }); })];
@@ -165,9 +177,32 @@ describe('basic table tests', function () {
                     expect((0, react_2.within)(getCellByIndexes(0, 1)).queryByText('row 1 value 3')).not.toBeInTheDocument();
                     expect((0, react_2.within)(getCellByIndexes(1, 1)).queryByText('row 2 value 1')).toBeInTheDocument();
                     expect((0, react_2.within)(getCellByIndexes(1, 1)).queryByText('row 2 value 2')).not.toBeInTheDocument();
+                    return [4 /*yield*/, (0, react_2.act)(function () { return __awaiter(void 0, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                react_2.fireEvent.mouseUp(dragIndicator);
+                                return [2 /*return*/];
+                            });
+                        }); })];
+                case 4:
+                    _a.sent();
                     unmockTableSizing();
                     return [2 /*return*/];
             }
         });
     }); });
+    it('should able to click on buttons in table head', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = setUp(defaultProps).user;
+                    expect(onHeadClickFn).not.toHaveBeenCalled();
+                    return [4 /*yield*/, user.click(react_2.screen.getAllByRole('button', { name: columnsData[0].label })[1])];
+                case 1:
+                    _a.sent();
+                    expect(onHeadClickFn).toHaveBeenCalled();
+                    return [2 /*return*/];
+            }
+        });
+    }); });
 });

package/cjs/contexts/MaskedAttributesContext/context.js

@@ -85,28 +85,112 @@ exports.MaskedAttributesContext = (0, react_context_selector_1.createContext)({
 var MaskedAttributesProvider = function (_a) {
     var children = _a.children;
     var _b = (0, react_1.useState)({}), unmaskedAttributes = _b[0], setUnmaskedAttributes = _b[1];
+    var _c = (0, react_1.useState)({}), unmaskedEntities = _c[0], setUnmaskedEntities = _c[1];
+    var _d = (0, react_1.useState)(null), unmaskedCurrentEntity = _d[0], setUnmaskedCurrentEntity = _d[1];
     var profileLastLoadedTime = (0, MdmModuleContext_1.useMdmProfileLastLoadedTime)();
+    var historyMode = (0, MdmModuleContext_1.useMdmHistoryMode)();
+    var entityUri = (0, MdmModuleContext_1.useMdmEntityUri)();
+    var historyEvent = (0, MdmModuleContext_1.useMdmHistoryEvent)();
     var unmaskedAttributesRef = (0, react_1.useRef)(unmaskedAttributes);
     //performance optimization to avoid unnecessary re-renders
     unmaskedAttributesRef.current = unmaskedAttributes;
     (0, react_1.useEffect)(function () {
         setUnmaskedAttributes({});
-    }, [profileLastLoadedTime]);
+    }, [profileLastLoadedTime, historyEvent]);
+    (0, react_1.useEffect)(function () {
+        setUnmaskedEntities({});
+        setUnmaskedCurrentEntity(null);
+    }, [entityUri]);
+    var getUnmaskedEntity = (0, react_1.useCallback)(function (timestamp) { return __awaiter(void 0, void 0, void 0, function () {
+        var unmaskedEntity_1, _a, unmaskedEntity, _b;
+        var _c;
+        return __generator(this, function (_d) {
+            switch (_d.label) {
+                case 0:
+                    if (!!timestamp) return [3 /*break*/, 4];
+                    if (!(unmaskedCurrentEntity !== null && unmaskedCurrentEntity !== void 0)) return [3 /*break*/, 1];
+                    _a = unmaskedCurrentEntity;
+                    return [3 /*break*/, 3];
+                case 1: return [4 /*yield*/, (0, mdm_sdk_1.getEntity)(entityUri)];
+                case 2:
+                    _a = (_d.sent());
+                    _d.label = 3;
+                case 3:
+                    unmaskedEntity_1 = _a;
+                    if (!unmaskedCurrentEntity) {
+                        setUnmaskedCurrentEntity(unmaskedEntity_1);
+                    }
+                    return [2 /*return*/, unmaskedEntity_1];
+                case 4:
+                    if (!((_c = unmaskedEntities[timestamp]) !== null && _c !== void 0)) return [3 /*break*/, 5];
+                    _b = _c;
+                    return [3 /*break*/, 7];
+                case 5: return [4 /*yield*/, (0, mdm_sdk_1.getEntityTimeSlice)(entityUri, timestamp)];
+                case 6:
+                    _b = (_d.sent());
+                    _d.label = 7;
+                case 7:
+                    unmaskedEntity = _b;
+                    if (!unmaskedEntities[timestamp]) {
+                        setUnmaskedEntities(function (prev) {
+                            var _a;
+                            return (__assign(__assign({}, prev), (_a = {}, _a[timestamp] = unmaskedEntity, _a)));
+                        });
+                    }
+                    return [2 /*return*/, unmaskedEntity];
+            }
+        });
+    }); }, [entityUri, unmaskedEntities, unmaskedCurrentEntity]);
+    var unmaskAttributeValueFromEntity = (0, react_1.useCallback)(function (attributeValueUri) { return __awaiter(void 0, void 0, void 0, function () {
+        var unmaskedEntity, attributeValue, _a;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
+                case 0: return [4 /*yield*/, getUnmaskedEntity(historyEvent === null || historyEvent === void 0 ? void 0 : historyEvent.aStamp)];
+                case 1:
+                    unmaskedEntity = _b.sent();
+                    attributeValue = (0, mdm_sdk_1.findAttributeValueByUri)(unmaskedEntity, attributeValueUri);
+                    if (attributeValue) {
+                        return [2 /*return*/, attributeValue];
+                    }
+                    if (!(historyMode === mdm_sdk_1.HistoryMode.Current)) return [3 /*break*/, 3];
+                    return [4 /*yield*/, getUnmaskedEntity()];
+                case 2:
+                    _a = _b.sent();
+                    return [3 /*break*/, 5];
+                case 3: return [4 /*yield*/, getUnmaskedEntity(historyEvent === null || historyEvent === void 0 ? void 0 : historyEvent.bStamp)];
+                case 4:
+                    _a = _b.sent();
+                    _b.label = 5;
+                case 5:
+                    unmaskedEntity = _a;
+                    attributeValue = (0, mdm_sdk_1.findAttributeValueByUri)(unmaskedEntity, attributeValueUri);
+                    return [2 /*return*/, attributeValue];
+            }
+        });
+    }); }, [getUnmaskedEntity, historyEvent === null || historyEvent === void 0 ? void 0 : historyEvent.aStamp, historyEvent === null || historyEvent === void 0 ? void 0 : historyEvent.bStamp, historyMode]);
     var unmaskAttributeValue = (0, react_1.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) {
+        var unmaskedAttributes_1, unmaskedAttributeValue_1, _a, error_1;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
                 case 0:
-                    _a.trys.push([0, 4, , 5]);
+                    _b.trys.push([0, 7, , 8]);
                     unmaskedAttributes_1 = unmaskedAttributesRef.current;
-                    if (!!unmaskedAttributes_1[attributeValueUri]) return [3 /*break*/, 2];
+                    if (!!unmaskedAttributes_1[attributeValueUri]) return [3 /*break*/, 5];
                     setUnmaskedAttributes(function (prev) {
                         var _a;
                         return (__assign(__assign({}, prev), (_a = {}, _a[attributeValueUri] = __assign(__assign({}, prev[attributeValueUri]), { loading: true }), _a)));
                     });
-                    return [4 /*yield*/, (0, mdm_sdk_1.getUnmaskedAttributeValue)(attributeValueUri)];
+                    if (!historyEvent) return [3 /*break*/, 2];
+                    return [4 /*yield*/, unmaskAttributeValueFromEntity(attributeValueUri)];
                 case 1:
-                    unmaskedAttributeValue_1 = _a.sent();
+                    _a = _b.sent();
+                    return [3 /*break*/, 4];
+                case 2: return [4 /*yield*/, (0, mdm_sdk_1.getUnmaskedAttributeValue)(attributeValueUri)];
+                case 3:
+                    _a = _b.sent();
+                    _b.label = 4;
+                case 4:
+                    unmaskedAttributeValue_1 = _a;
                     setUnmaskedAttributes(function (prev) {
                         var _a;
                         return (__assign(__assign({}, prev), (_a = {}, _a[attributeValueUri] = {
@@ -116,21 +200,21 @@ var MaskedAttributesProvider = function (_a) {
                         }, _a)));
                     });
                     return [2 /*return*/, unmaskedAttributeValue_1];
-                case 2:
+                case 5:
                     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();
+                case 6: return [3 /*break*/, 8];
+                case 7:
+                    error_1 = _b.sent();
                     (0, errors_1.showErrorMessage)(error_1);
                     return [2 /*return*/, null];
-                case 5: return [2 /*return*/];
+                case 8: return [2 /*return*/];
             }
         });
-    }); }, []);
+    }); }, [historyEvent, unmaskAttributeValueFromEntity]);
     var maskAttributeValue = (0, react_1.useCallback)(function (attributeValueUri) {
         setUnmaskedAttributes(function (prev) {
             var _a;

package/contexts/MaskedAttributesContext/context.js

@@ -47,9 +47,9 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
 };
 import React, { useState, useCallback, useEffect, useRef } from 'react';
 import { createContext } from '@fluentui/react-context-selector';
-import { getUnmaskedAttributeValue } from '@reltio/mdm-sdk';
+import { HistoryMode, findAttributeValueByUri, getEntity, getEntityTimeSlice, getUnmaskedAttributeValue } from '@reltio/mdm-sdk';
 import { showErrorMessage } from '../../helpers/errors';
-import { useMdmProfileLastLoadedTime } from '../MdmModuleContext';
+import { useMdmEntityUri, useMdmHistoryEvent, useMdmHistoryMode, useMdmProfileLastLoadedTime } from '../MdmModuleContext';
 export var MaskedAttributesContext = createContext({
     unmaskedAttributes: {},
     unmaskAttributeValue: undefined,
@@ -59,28 +59,112 @@ export var MaskedAttributesContext = createContext({
 export var MaskedAttributesProvider = function (_a) {
     var children = _a.children;
     var _b = useState({}), unmaskedAttributes = _b[0], setUnmaskedAttributes = _b[1];
+    var _c = useState({}), unmaskedEntities = _c[0], setUnmaskedEntities = _c[1];
+    var _d = useState(null), unmaskedCurrentEntity = _d[0], setUnmaskedCurrentEntity = _d[1];
     var profileLastLoadedTime = useMdmProfileLastLoadedTime();
+    var historyMode = useMdmHistoryMode();
+    var entityUri = useMdmEntityUri();
+    var historyEvent = useMdmHistoryEvent();
     var unmaskedAttributesRef = useRef(unmaskedAttributes);
     //performance optimization to avoid unnecessary re-renders
     unmaskedAttributesRef.current = unmaskedAttributes;
     useEffect(function () {
         setUnmaskedAttributes({});
-    }, [profileLastLoadedTime]);
+    }, [profileLastLoadedTime, historyEvent]);
+    useEffect(function () {
+        setUnmaskedEntities({});
+        setUnmaskedCurrentEntity(null);
+    }, [entityUri]);
+    var getUnmaskedEntity = useCallback(function (timestamp) { return __awaiter(void 0, void 0, void 0, function () {
+        var unmaskedEntity_1, _a, unmaskedEntity, _b;
+        var _c;
+        return __generator(this, function (_d) {
+            switch (_d.label) {
+                case 0:
+                    if (!!timestamp) return [3 /*break*/, 4];
+                    if (!(unmaskedCurrentEntity !== null && unmaskedCurrentEntity !== void 0)) return [3 /*break*/, 1];
+                    _a = unmaskedCurrentEntity;
+                    return [3 /*break*/, 3];
+                case 1: return [4 /*yield*/, getEntity(entityUri)];
+                case 2:
+                    _a = (_d.sent());
+                    _d.label = 3;
+                case 3:
+                    unmaskedEntity_1 = _a;
+                    if (!unmaskedCurrentEntity) {
+                        setUnmaskedCurrentEntity(unmaskedEntity_1);
+                    }
+                    return [2 /*return*/, unmaskedEntity_1];
+                case 4:
+                    if (!((_c = unmaskedEntities[timestamp]) !== null && _c !== void 0)) return [3 /*break*/, 5];
+                    _b = _c;
+                    return [3 /*break*/, 7];
+                case 5: return [4 /*yield*/, getEntityTimeSlice(entityUri, timestamp)];
+                case 6:
+                    _b = (_d.sent());
+                    _d.label = 7;
+                case 7:
+                    unmaskedEntity = _b;
+                    if (!unmaskedEntities[timestamp]) {
+                        setUnmaskedEntities(function (prev) {
+                            var _a;
+                            return (__assign(__assign({}, prev), (_a = {}, _a[timestamp] = unmaskedEntity, _a)));
+                        });
+                    }
+                    return [2 /*return*/, unmaskedEntity];
+            }
+        });
+    }); }, [entityUri, unmaskedEntities, unmaskedCurrentEntity]);
+    var unmaskAttributeValueFromEntity = useCallback(function (attributeValueUri) { return __awaiter(void 0, void 0, void 0, function () {
+        var unmaskedEntity, attributeValue, _a;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
+                case 0: return [4 /*yield*/, getUnmaskedEntity(historyEvent === null || historyEvent === void 0 ? void 0 : historyEvent.aStamp)];
+                case 1:
+                    unmaskedEntity = _b.sent();
+                    attributeValue = findAttributeValueByUri(unmaskedEntity, attributeValueUri);
+                    if (attributeValue) {
+                        return [2 /*return*/, attributeValue];
+                    }
+                    if (!(historyMode === HistoryMode.Current)) return [3 /*break*/, 3];
+                    return [4 /*yield*/, getUnmaskedEntity()];
+                case 2:
+                    _a = _b.sent();
+                    return [3 /*break*/, 5];
+                case 3: return [4 /*yield*/, getUnmaskedEntity(historyEvent === null || historyEvent === void 0 ? void 0 : historyEvent.bStamp)];
+                case 4:
+                    _a = _b.sent();
+                    _b.label = 5;
+                case 5:
+                    unmaskedEntity = _a;
+                    attributeValue = findAttributeValueByUri(unmaskedEntity, attributeValueUri);
+                    return [2 /*return*/, attributeValue];
+            }
+        });
+    }); }, [getUnmaskedEntity, historyEvent === null || historyEvent === void 0 ? void 0 : historyEvent.aStamp, historyEvent === null || historyEvent === void 0 ? void 0 : historyEvent.bStamp, historyMode]);
     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) {
+        var unmaskedAttributes_1, unmaskedAttributeValue_1, _a, error_1;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
                 case 0:
-                    _a.trys.push([0, 4, , 5]);
+                    _b.trys.push([0, 7, , 8]);
                     unmaskedAttributes_1 = unmaskedAttributesRef.current;
-                    if (!!unmaskedAttributes_1[attributeValueUri]) return [3 /*break*/, 2];
+                    if (!!unmaskedAttributes_1[attributeValueUri]) return [3 /*break*/, 5];
                     setUnmaskedAttributes(function (prev) {
                         var _a;
                         return (__assign(__assign({}, prev), (_a = {}, _a[attributeValueUri] = __assign(__assign({}, prev[attributeValueUri]), { loading: true }), _a)));
                     });
-                    return [4 /*yield*/, getUnmaskedAttributeValue(attributeValueUri)];
+                    if (!historyEvent) return [3 /*break*/, 2];
+                    return [4 /*yield*/, unmaskAttributeValueFromEntity(attributeValueUri)];
                 case 1:
-                    unmaskedAttributeValue_1 = _a.sent();
+                    _a = _b.sent();
+                    return [3 /*break*/, 4];
+                case 2: return [4 /*yield*/, getUnmaskedAttributeValue(attributeValueUri)];
+                case 3:
+                    _a = _b.sent();
+                    _b.label = 4;
+                case 4:
+                    unmaskedAttributeValue_1 = _a;
                     setUnmaskedAttributes(function (prev) {
                         var _a;
                         return (__assign(__assign({}, prev), (_a = {}, _a[attributeValueUri] = {
@@ -90,21 +174,21 @@ export var MaskedAttributesProvider = function (_a) {
                         }, _a)));
                     });
                     return [2 /*return*/, unmaskedAttributeValue_1];
-                case 2:
+                case 5:
                     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();
+                case 6: return [3 /*break*/, 8];
+                case 7:
+                    error_1 = _b.sent();
                     showErrorMessage(error_1);
                     return [2 /*return*/, null];
-                case 5: return [2 /*return*/];
+                case 8: return [2 /*return*/];
             }
         });
-    }); }, []);
+    }); }, [historyEvent, unmaskAttributeValueFromEntity]);
     var maskAttributeValue = useCallback(function (attributeValueUri) {
         setUnmaskedAttributes(function (prev) {
             var _a;

package/package.json

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