@reltio/components 1.4.1896 → 1.4.1897

package/cjs/ModeSwitcherSelect/ModeSwitcherSelect.d.ts

@@ -13,8 +13,9 @@ type ModeSwitcherSelectProps = {
     buttonsGroup?: Button[];
     value: string;
     onChange?: (value: string) => void;
+    loading?: boolean;
     disabled?: boolean;
     variant?: 'normal' | 'thin';
 };
-export declare const ModeSwitcherSelect: ({ optionsGroup, buttonsGroup, value, onChange, disabled, variant }: ModeSwitcherSelectProps) => JSX.Element;
+export declare const ModeSwitcherSelect: ({ optionsGroup, buttonsGroup, value, onChange, loading, disabled, variant }: ModeSwitcherSelectProps) => JSX.Element;
 export {};

package/cjs/ModeSwitcherSelect/ModeSwitcherSelect.js

@@ -32,10 +32,11 @@ var MenuItem_1 = __importDefault(require("@mui/material/MenuItem"));
 var Box_1 = __importDefault(require("@mui/material/Box"));
 var Typography_1 = __importDefault(require("@mui/material/Typography"));
 var Tooltip_1 = __importDefault(require("@mui/material/Tooltip"));
+var CircularProgress_1 = __importDefault(require("@mui/material/CircularProgress"));
 var styles_1 = require("./styles");
 var isButton = function (value) { return 'onClick' in value; };
 var ModeSwitcherSelect = function (_a) {
-    var _b = _a.optionsGroup, optionsGroup = _b === void 0 ? [] : _b, _c = _a.buttonsGroup, buttonsGroup = _c === void 0 ? [] : _c, value = _a.value, onChange = _a.onChange, _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.variant, variant = _e === void 0 ? 'normal' : _e;
+    var _b = _a.optionsGroup, optionsGroup = _b === void 0 ? [] : _b, _c = _a.buttonsGroup, buttonsGroup = _c === void 0 ? [] : _c, value = _a.value, onChange = _a.onChange, _d = _a.loading, loading = _d === void 0 ? false : _d, _e = _a.disabled, disabled = _e === void 0 ? false : _e, _f = _a.variant, variant = _f === void 0 ? 'normal' : _f;
     var styles = (0, styles_1.useStyles)();
     var handleChange = function (e) {
         var value = e.target.value;
@@ -66,14 +67,14 @@ var ModeSwitcherSelect = function (_a) {
                         react_1.default.createElement(Typography_1.default, { className: styles.menuItemDescription }, description)))));
         });
     };
-    return (react_1.default.createElement(Select_1.default, { classes: {
+    return (react_1.default.createElement(Select_1.default, { className: styles.select, classes: {
             select: (0, classnames_1.default)(styles.root, styles[variant]),
             icon: (0, classnames_1.default)(styles.arrowIcon, styles[variant]),
             outlined: styles.outlined
         }, value: value, onChange: handleChange, variant: "outlined", renderValue: function (value) {
             var _a = optionsGroup.find((0, ramda_1.propEq)('value', value)) || {}, IconComponent = _a.icon, _b = _a.label, label = _b === void 0 ? value : _b;
             return (react_1.default.createElement(Box_1.default, { className: styles.currentValue },
-                IconComponent && react_1.default.createElement(IconComponent, { className: styles.currentValueIcon }),
+                loading ? (react_1.default.createElement(CircularProgress_1.default, { size: "1em", "data-reltio-id": "mode-loading-spinner", className: styles.currentValueIcon })) : (IconComponent && react_1.default.createElement(IconComponent, { className: styles.currentValueIcon })),
                 react_1.default.createElement(Tooltip_1.default, { title: label },
                     react_1.default.createElement(Typography_1.default, { className: styles.currentValueText }, label))));
         }, MenuProps: {

package/cjs/ModeSwitcherSelect/ModeSwitcherSelect.test.js

@@ -1,4 +1,51 @@
 "use strict";
+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 };
+    }
+};
 var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
         if (ar || !(i in from)) {
@@ -13,105 +60,201 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
-var enzyme_1 = require("enzyme");
-var Select_1 = __importDefault(require("@mui/material/Select"));
+var react_2 = require("@testing-library/react");
+var user_event_1 = __importDefault(require("@testing-library/user-event"));
+var Add_1 = __importDefault(require("@mui/icons-material/Add"));
 var Create_1 = __importDefault(require("@mui/icons-material/Create"));
 var Visibility_1 = __importDefault(require("@mui/icons-material/Visibility"));
 var Delete_1 = __importDefault(require("@mui/icons-material/Delete"));
+var test_utils_1 = require("../test-utils");
 var ModeSwitcherSelect_1 = require("./ModeSwitcherSelect");
+var optionsGroup = [
+    {
+        label: 'Editing label',
+        value: 'Editing',
+        description: 'Edit profile directly',
+        icon: Create_1.default
+    },
+    {
+        label: 'Suggesting label',
+        value: 'Suggesting',
+        description: 'Suggest changes and initiate a workflow review',
+        icon: Add_1.default
+    },
+    {
+        label: 'Viewing label',
+        value: 'Viewing',
+        description: 'Read or print profile',
+        icon: Visibility_1.default
+    }
+];
+var buttonsGroup = [
+    {
+        label: 'Delete label',
+        value: 'Delete',
+        description: 'Permanently delete profile',
+        icon: Delete_1.default,
+        onClick: jest.fn()
+    },
+    {
+        label: 'Clone label',
+        value: 'Clone',
+        description: 'Clone profile',
+        icon: Create_1.default,
+        onClick: jest.fn()
+    }
+];
+var defaultProps = {
+    optionsGroup: optionsGroup,
+    buttonsGroup: buttonsGroup,
+    value: 'Viewing',
+    onChange: jest.fn()
+};
+var setUp = function (props) {
+    if (props === void 0) { props = {}; }
+    var user = user_event_1.default.setup();
+    return __assign({ user: user }, (0, react_2.render)(react_1.default.createElement(ModeSwitcherSelect_1.ModeSwitcherSelect, __assign({}, defaultProps, props))));
+};
 describe('ModeSwitcherSelect tests', function () {
-    var onClick = jest.fn();
-    var optionsGroup = [
-        {
-            label: 'Editing label',
-            value: 'Editing',
-            description: 'Edit profile directly',
-            icon: Create_1.default
-        },
-        {
-            label: 'Suggesting label',
-            value: 'Suggesting',
-            description: 'Suggest changes and initiate a workflow review',
-            icon: Create_1.default
-        },
-        {
-            label: 'Viewing label',
-            value: 'Viewing',
-            description: 'Read or print profile',
-            icon: Visibility_1.default
-        }
-    ];
-    var buttonsGroup = [
-        {
-            label: 'Delete label',
-            value: 'Delete',
-            description: 'Permanently delete profile',
-            icon: Delete_1.default,
-            onClick: onClick
-        }
-    ];
-    it('should render optionsGroups', function () {
-        var component = (0, enzyme_1.shallow)(react_1.default.createElement(ModeSwitcherSelect_1.ModeSwitcherSelect, { optionsGroup: optionsGroup, buttonsGroup: [], value: "Viewing" }));
-        var menuItems = component.find('.menuItem');
-        expect(menuItems.length).toBe(3);
-        menuItems.forEach(function (node, idx) {
-            expect(node.find(optionsGroup[idx].icon)).toHaveLength(1);
-            expect(node.find('.menuItemLabel').text()).toBe(optionsGroup[idx].label);
-            expect(node.find('.menuItemDescription').text()).toBe(optionsGroup[idx].description);
-        });
+    beforeEach(function () {
+        jest.clearAllMocks();
     });
-    it('should render optionsGroup and buttonsGroup', function () {
-        var component = (0, enzyme_1.shallow)(react_1.default.createElement(ModeSwitcherSelect_1.ModeSwitcherSelect, { optionsGroup: optionsGroup, buttonsGroup: buttonsGroup, value: "Viewing" }));
-        var menuItems = component.find('.menuItem');
-        expect(menuItems.length).toBe(4);
-        var optionsAndButtonsGroup = __spreadArray(__spreadArray([], optionsGroup, true), buttonsGroup, true);
-        menuItems.forEach(function (node, idx) {
-            expect(node.find(optionsAndButtonsGroup[idx].icon)).toHaveLength(1);
-            expect(node.find('.menuItemLabel').text()).toBe(optionsAndButtonsGroup[idx].label);
-            expect(node.find('.menuItemDescription').text()).toBe(optionsAndButtonsGroup[idx].description);
+    it('should render optionsGroups', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user, button, options;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = setUp({ buttonsGroup: [] }).user;
+                    button = react_2.screen.getByText('Viewing label');
+                    return [4 /*yield*/, user.click(button)];
+                case 1:
+                    _a.sent();
+                    options = react_2.screen.getAllByRole('option');
+                    expect(options.length).toBe(3);
+                    expect((0, test_utils_1.getMuiIconByName)('Create', options[0])).toBeInTheDocument();
+                    expect((0, test_utils_1.getMuiIconByName)('Add', options[1])).toBeInTheDocument();
+                    expect((0, test_utils_1.getMuiIconByName)('Visibility', options[2])).toBeInTheDocument();
+                    options.forEach(function (item, i) {
+                        (0, react_2.within)(item).getByText(optionsGroup[i].label);
+                        (0, react_2.within)(item).getByText(optionsGroup[i].description);
+                    });
+                    return [2 /*return*/];
+            }
         });
-    });
-    it('should get current value on ModeSwitcherSelect change', function () {
-        var onChange = jest.fn();
-        var component = (0, enzyme_1.shallow)(react_1.default.createElement(ModeSwitcherSelect_1.ModeSwitcherSelect, { optionsGroup: optionsGroup, buttonsGroup: buttonsGroup, value: "Editing", onChange: onChange }));
-        var select = component.find(Select_1.default);
-        select.simulate('change', { target: { value: 'Viewing' } });
-        expect(onChange.mock.calls.length).toBe(1);
-        expect(onChange).toHaveBeenCalledWith('Viewing');
-    });
-    it('button onClick event should work correctly', function () {
-        var component = (0, enzyme_1.shallow)(react_1.default.createElement(ModeSwitcherSelect_1.ModeSwitcherSelect, { optionsGroup: optionsGroup, buttonsGroup: buttonsGroup, value: "Editing" }));
-        var button = component.find('.menuItem').findWhere(function (n) { return n.prop('value') === 'Delete'; });
-        button.simulate('click');
-        expect(onClick.mock.calls.length).toBe(1);
-        expect(onClick).toHaveBeenCalledWith('Delete');
-    });
-    it('should first button has .firstMenuItemButton className and options hasn`t', function () {
-        var component = (0, enzyme_1.shallow)(react_1.default.createElement(ModeSwitcherSelect_1.ModeSwitcherSelect, { optionsGroup: optionsGroup, buttonsGroup: buttonsGroup, value: "Viewing" }));
-        var menuItems = component.find('.menuItem');
-        menuItems.forEach(function (node, idx) {
-            var isFirstButton = idx === 3;
-            if (isFirstButton) {
-                expect(node.hasClass('firstMenuItemButton')).toBe(true);
+    }); });
+    it('should render optionsGroup and buttonsGroup', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user, button, options, allOptions;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = setUp().user;
+                    button = react_2.screen.getByText('Viewing label');
+                    return [4 /*yield*/, user.click(button)];
+                case 1:
+                    _a.sent();
+                    options = react_2.screen.getAllByRole('option');
+                    expect(options.length).toBe(5);
+                    expect((0, test_utils_1.getMuiIconByName)('Create', options[0])).toBeInTheDocument();
+                    expect((0, test_utils_1.getMuiIconByName)('Add', options[1])).toBeInTheDocument();
+                    expect((0, test_utils_1.getMuiIconByName)('Visibility', options[2])).toBeInTheDocument();
+                    expect((0, test_utils_1.getMuiIconByName)('Delete', options[3])).toBeInTheDocument();
+                    expect((0, test_utils_1.getMuiIconByName)('Create', options[4])).toBeInTheDocument();
+                    allOptions = __spreadArray(__spreadArray([], optionsGroup, true), buttonsGroup, true);
+                    options.forEach(function (item, i) {
+                        (0, react_2.within)(item).getByText(allOptions[i].label);
+                        (0, react_2.within)(item).getByText(allOptions[i].description);
+                    });
+                    return [2 /*return*/];
             }
-            else {
-                expect(node.hasClass('firstMenuItemButton')).toBe(false);
+        });
+    }); });
+    it('should call onChange with correct value', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user, button;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = setUp().user;
+                    button = react_2.screen.getByText('Viewing label');
+                    return [4 /*yield*/, user.click(button)];
+                case 1:
+                    _a.sent();
+                    return [4 /*yield*/, user.click(react_2.screen.getByText('Suggesting label'))];
+                case 2:
+                    _a.sent();
+                    expect(defaultProps.onChange).toHaveBeenCalledWith('Suggesting');
+                    return [2 /*return*/];
             }
         });
+    }); });
+    it('button onClick event should work correctly', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user, button;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = setUp().user;
+                    button = react_2.screen.getByText('Viewing label');
+                    return [4 /*yield*/, user.click(button)];
+                case 1:
+                    _a.sent();
+                    return [4 /*yield*/, user.click(react_2.screen.getByText('Delete label'))];
+                case 2:
+                    _a.sent();
+                    expect(defaultProps.onChange).not.toHaveBeenCalled();
+                    expect(buttonsGroup[0].onClick).toHaveBeenCalled();
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    it('should first button has .firstMenuItemButton className and options hasn`t', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user, button, options;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = setUp().user;
+                    button = react_2.screen.getByText('Viewing label');
+                    return [4 /*yield*/, user.click(button)];
+                case 1:
+                    _a.sent();
+                    options = react_2.screen.getAllByRole('option');
+                    expect(options[2]).not.toHaveClass('firstMenuItemButton');
+                    expect(options[3]).toHaveClass('firstMenuItemButton');
+                    expect(options[4]).not.toHaveClass('firstMenuItemButton');
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    it('should render current value correctly', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = setUp({ value: 'Suggesting' }).user;
+                    return [4 /*yield*/, user.click(react_2.screen.getByText('Suggesting label'))];
+                case 1:
+                    _a.sent();
+                    react_2.screen.getByRole('option', {
+                        name: 'Suggesting label Suggest changes and initiate a workflow review',
+                        selected: true
+                    });
+                    react_2.screen.getByRole('option', { name: 'Viewing label Read or print profile', selected: false });
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    it('should not crash when current value is not from options/buttons', function () { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            setUp({ value: 'NonExisting' });
+            expect(react_2.screen.getByRole('button')).toHaveTextContent('NonExisting');
+            return [2 /*return*/];
+        });
+    }); });
+    it('should disable button', function () {
+        setUp({ disabled: true });
+        expect(react_2.screen.getByRole('button')).toHaveClass('Mui-disabled');
     });
-    it('should render current value correctly', function () {
-        var component = (0, enzyme_1.shallow)(react_1.default.createElement(ModeSwitcherSelect_1.ModeSwitcherSelect, { optionsGroup: optionsGroup, buttonsGroup: buttonsGroup, value: "Viewing" }));
-        var select = component.find(Select_1.default);
-        var renderValue = function () { return select.renderProp('renderValue')(select.prop('value')); };
-        expect(renderValue().find('.currentValue')).toHaveLength(1);
-        expect(renderValue().find(Visibility_1.default)).toHaveLength(1);
-        expect(renderValue().find('.currentValueText').text()).toBe('Viewing label');
-    });
-    it('should not crash when current value is not from options/buttons', function () {
-        var component = (0, enzyme_1.shallow)(react_1.default.createElement(ModeSwitcherSelect_1.ModeSwitcherSelect, { optionsGroup: optionsGroup, buttonsGroup: buttonsGroup, value: "Viewing1" }));
-        var select = component.find(Select_1.default);
-        var renderValue = function () { return select.renderProp('renderValue')(select.prop('value')); };
-        expect(renderValue().find('.currentValue')).toHaveLength(1);
-        expect(renderValue().find('.currentValueText').text()).toBe('Viewing1');
+    it('should show loader instead of icon', function () {
+        setUp({ loading: true });
+        react_2.screen.getByTestId('mode-loading-spinner');
+        expect((0, test_utils_1.getMuiIconByName)('Visibility', react_2.screen.getByRole('button'))).not.toBeInTheDocument();
     });
 });

package/cjs/ModeSwitcherSelect/styles.d.ts

@@ -1 +1 @@
-export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"normal" | "thin" | "root" | "menuItem" | "outlined" | "currentValue" | "arrowIcon" | "currentValueIcon" | "currentValueText" | "firstMenuItemButton" | "menuItemInner" | "menuItemIcon" | "menuItemLabel" | "menuItemDescription">;
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"normal" | "thin" | "select" | "root" | "menuItem" | "outlined" | "currentValue" | "arrowIcon" | "currentValueIcon" | "currentValueText" | "firstMenuItemButton" | "menuItemInner" | "menuItemIcon" | "menuItemLabel" | "menuItemDescription">;

package/cjs/ModeSwitcherSelect/styles.js

@@ -10,6 +10,8 @@ exports.useStyles = (0, styles_1.makeStyles)(function (theme) { return ({
     normal: {},
     thin: {},
     root: {
+        display: 'inline-flex',
+        alignItems: 'center',
         maxWidth: CALCULATED_MAX_WIDTH_SELECT,
         '&$outlined': {
             minHeight: '1.1876em'
@@ -23,6 +25,16 @@ exports.useStyles = (0, styles_1.makeStyles)(function (theme) { return ({
             paddingBottom: '6px'
         }
     },
+    select: {
+        '&.Mui-disabled': {
+            '& .MuiOutlinedInput-notchedOutline': {
+                borderColor: theme.palette.text.disabled
+            },
+            '& $currentValueIcon, & $currentValueText': {
+                color: theme.palette.text.disabled
+            }
+        }
+    },
     outlined: {
         paddingRight: SELECT_PADDING_RIGHT,
         paddingLeft: SELECT_PADDING_LEFT
@@ -41,6 +53,9 @@ exports.useStyles = (0, styles_1.makeStyles)(function (theme) { return ({
         alignItems: 'center'
     },
     currentValueIcon: {
+        width: '1em',
+        height: '1em',
+        display: 'inline-block',
         fontSize: '18px',
         marginRight: '8px',
         color: theme.palette.text.secondary
@@ -66,6 +81,9 @@ exports.useStyles = (0, styles_1.makeStyles)(function (theme) { return ({
         alignItems: 'flex-start'
     },
     menuItemIcon: {
+        width: '1em',
+        height: '1em',
+        display: 'inline-block',
         fontSize: '18px',
         color: theme.palette.text.secondary,
         marginRight: '9px'

package/cjs/contexts/MdmModuleContext/context.d.ts

@@ -93,6 +93,7 @@ export type MdmModuleActionsContextProps = Partial<{
     errorSet: (payload: string) => void;
     setHistoryMode: (payload: HistoryMode) => void;
     modeUpdated: (payload: Mode) => void;
+    modeUpdateRequested: (payload: Mode) => void;
     setHistoryEvent: (payload: HistoryEvent) => void;
     clearHistoryEvent: () => void;
     clearHistoryDiff: () => void;
@@ -162,6 +163,7 @@ export declare const MdmModuleActionsContext: import("@fluentui/react-context-se
     errorSet: (payload: string) => void;
     setHistoryMode: (payload: HistoryMode) => void;
     modeUpdated: (payload: Mode) => void;
+    modeUpdateRequested: (payload: Mode) => void;
     setHistoryEvent: (payload: HistoryEvent) => void;
     clearHistoryEvent: () => void;
     clearHistoryDiff: () => void;

package/cjs/contexts/MdmModuleContext/hooks.d.ts

@@ -71,7 +71,7 @@ export declare const useMdmDependentLookupEditorContext: (attributeValue: Simple
 };
 export declare const useMdmGlobalSearchRequestOptions: (omittingFields?: string[]) => import("@reltio/mdm-sdk").GlobalSearchRequestOptions;
 export declare const useMdmAuthoringItemsByEntityType: (entityTypeUri: string) => import("@reltio/mdm-sdk").AuthoringItem[];
-export declare const useMdmAction: <T extends "openSearch" | "openHistoryEvent" | "openConsoleApp" | "addAttributes" | "modifyAttribute" | "removeAttribute" | "entityDeleted" | "entityCreated" | "errorDeactivated" | "requestNextPageOfAttributeValues" | "openEntity" | "setDefaultProfilePicForModifiedEntity" | "setDefaultProfilePicForEntity" | "dependentLookupsEditorTouched" | "openPivotingPerspective" | "lookupsLoaded" | "lookupsForTypeResolved" | "errorSet" | "setHistoryMode" | "modeUpdated" | "setHistoryEvent" | "clearHistoryEvent" | "clearHistoryDiff" | "setHistoryDiff" | "setHistorySlice" | "updateSearchNavigationDataFields" | "openPerspective" | "entityDeletionFinished" | "loadEntity" | "updateSearchNavigationDataOnMerge" | "lookupsListResolved" | "relationsLoaded" | "setInitialInfo" | "setRelationType" | "closeRelationEditor" | "openRelationEditor" | "setRelationEntity" | "errorsSet" | "addRelation" | "editRelation" | "updateHiddenAttributes" | "resetHiddenAttributes" | "updateControlAttributes">(action: T) => Partial<{
+export declare const useMdmAction: <T extends "openSearch" | "openHistoryEvent" | "openConsoleApp" | "addAttributes" | "modifyAttribute" | "removeAttribute" | "entityDeleted" | "entityCreated" | "errorDeactivated" | "requestNextPageOfAttributeValues" | "openEntity" | "setDefaultProfilePicForModifiedEntity" | "setDefaultProfilePicForEntity" | "dependentLookupsEditorTouched" | "openPivotingPerspective" | "lookupsLoaded" | "lookupsForTypeResolved" | "errorSet" | "setHistoryMode" | "modeUpdated" | "modeUpdateRequested" | "setHistoryEvent" | "clearHistoryEvent" | "clearHistoryDiff" | "setHistoryDiff" | "setHistorySlice" | "updateSearchNavigationDataFields" | "openPerspective" | "entityDeletionFinished" | "loadEntity" | "updateSearchNavigationDataOnMerge" | "lookupsListResolved" | "relationsLoaded" | "setInitialInfo" | "setRelationType" | "closeRelationEditor" | "openRelationEditor" | "setRelationEntity" | "errorsSet" | "addRelation" | "editRelation" | "updateHiddenAttributes" | "resetHiddenAttributes" | "updateControlAttributes">(action: T) => Partial<{
     openSearch: (payload: import("@reltio/mdm-sdk").SearchState) => void;
     openHistoryEvent: (payload: {
         entityUri: string;
@@ -108,6 +108,7 @@ export declare const useMdmAction: <T extends "openSearch" | "openHistoryEvent"
     errorSet: (payload: string) => void;
     setHistoryMode: (payload: import("@reltio/mdm-sdk").HistoryMode) => void;
     modeUpdated: (payload: import("@reltio/mdm-sdk").Mode) => void;
+    modeUpdateRequested: (payload: import("@reltio/mdm-sdk").Mode) => void;
     setHistoryEvent: (payload: import("@reltio/mdm-sdk").HistoryEvent) => void;
     clearHistoryEvent: () => void;
     clearHistoryDiff: () => void;

package/cjs/features/history/HistoryGraph/components/HistoryCircle/HistoryCircle.js

@@ -51,7 +51,7 @@ var constants_1 = require("./constants");
 exports.HistoryCircle = (0, react_1.forwardRef)(function (_a, ref) {
     var x = _a.x, y = _a.y, color = _a.color, isDashed = _a.isDashed, isCollapsed = _a.isCollapsed, showCollapseIcon = _a.showCollapseIcon, showLine = _a.showLine, otherProps = __rest(_a, ["x", "y", "color", "isDashed", "isCollapsed", "showCollapseIcon", "showLine"]);
     var radius = showCollapseIcon ? constants_1.BUMP_RADIUS * 2 : constants_1.BUMP_RADIUS;
-    return (react_1.default.createElement("g", __assign({}, otherProps, { ref: ref }),
+    return (react_1.default.createElement("g", __assign({ "data-reltio-id": "history-circle" }, otherProps, { ref: ref }),
         showLine && (react_1.default.createElement("rect", { id: "line", x: x - radius - constants_1.LINE_MARGIN, y: y - radius - constants_1.LINE_MARGIN, width: radius * 2 + constants_1.LINE_MARGIN * 2, height: 2, fill: color })),
         react_1.default.createElement("circle", { cx: x, cy: y, r: radius, fill: isDashed ? '#fff' : color, stroke: color, strokeDasharray: isDashed ? '1,1' : undefined, strokeWidth: 2 }),
         showCollapseIcon && (react_1.default.createElement("g", { id: "icon" },

package/cjs/features/history/HistoryRow/HistoryRow.js

@@ -18,7 +18,9 @@ var HistoryRow = function (_a) {
     var colorUri = fakeType && uris ? uris[0] : uri;
     var color = (0, mdm_sdk_1.getContributorColor)(colorUri);
     var styles = (0, styles_1.useStyles)({ color: color });
-    return (react_1.default.createElement("div", { className: (0, classnames_1.default)(styles.historyRow, (_b = {}, _b[styles.selected] = isSelected, _b)), onClick: onClick },
+    return (react_1.default.createElement("div", { "data-reltio-id": "history-row", className: (0, classnames_1.default)(styles.historyRow, (_b = {},
+            _b[styles.selected] = isSelected,
+            _b)), onClick: onClick },
         react_1.default.createElement("div", { className: styles.rowHeader },
             react_1.default.createElement("div", { className: styles.badge }),
             react_1.default.createElement(Typography_1.default, { className: (0, classnames_1.default)(styles.title, { bold: isCurrent }) }, isCurrent ? ui_i18n_1.default.text('Current view') : (0, activity_log_1.getActivityLabel)(type)),

package/cjs/features/history/HistoryTree/HistoryTree.js

@@ -59,7 +59,7 @@ var HistoryTree = function (_a) {
     var _e = (0, react_1.useState)(-1), selectedIndex = _e[0], setSelectedIndex = _e[1];
     var setHistoryEvent = (0, MdmModuleContext_1.useMdmAction)('setHistoryEvent');
     var clearHistoryEvent = (0, MdmModuleContext_1.useMdmAction)('clearHistoryEvent');
-    var modeUpdated = (0, MdmModuleContext_1.useMdmAction)('modeUpdated');
+    var modeUpdateRequested = (0, MdmModuleContext_1.useMdmAction)('modeUpdateRequested');
     var metadata = (0, MdmModuleContext_1.useMdmMetadata)();
     var isEditableMode = (0, MdmModuleContext_1.useMdmIsEditableMode)();
     (0, react_1.useEffect)(function () {
@@ -106,12 +106,7 @@ var HistoryTree = function (_a) {
     };
     var handleHistoryRowClick = function (index, change, isSelected, isCurrent) {
         if (isEditableMode) {
-            if (window.confirm(ui_i18n_1.default.text('Are you sure you want to go in history mode? All your changes will be lost.'))) {
-                modeUpdated(mdm_sdk_1.Mode.Viewing);
-            }
-            else {
-                return;
-            }
+            modeUpdateRequested(mdm_sdk_1.Mode.Viewing);
         }
         if ((isCurrent && !isSelected) || (!isCurrent && isSelected)) {
             clearHistoryEvent();