@reltio/components 1.4.2070 → 1.4.2072

package/PotentialMatchReviewCard/PotentialMatchReviewCard.spec.js

@@ -1,35 +1,100 @@
+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 = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["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 from 'react';
-import { shallow } from 'enzyme';
-import { act } from 'react-dom/test-utils';
 import i18n from 'ui-i18n';
-import { identity } from 'ramda';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import { PotentialMatchReviewCard } from './PotentialMatchReviewCard';
+var defaultProps = {
+    date: 1612265837382,
+    createdBy: 'testUser',
+    type: 'pmReviewCardType',
+    step: 'Review',
+    children: React.createElement("div", null, "Children"),
+    Actions: React.createElement("div", null, "Actions")
+};
+var setUp = function (props) {
+    if (props === void 0) { props = defaultProps; }
+    var user = userEvent.setup();
+    return __assign(__assign({}, render(React.createElement(PotentialMatchReviewCard, __assign({}, props)))), { user: user });
+};
 describe('Potential match review card tests', function () {
-    var date = 1612265837382;
-    var createdBy = 'testUser';
-    var type = 'pmReviewCardType';
-    var step = 'Review';
-    var children = React.createElement("div", { className: "children" }, "Children");
-    var Actions = React.createElement("div", { className: "actions" }, "Actions");
-    it('should render elements correctly', function () {
-        jest.spyOn(i18n, 'date').mockImplementation(identity);
-        var component = shallow(React.createElement(PotentialMatchReviewCard, { date: date, createdBy: createdBy, type: type, step: step, Actions: Actions }, children));
-        expect(component.find('CollapseButton').prop('isOpen')).toBeFalsy();
-        expect(component.find('.date').text()).toBe(String(date));
-        expect(component.find('.info').at(0).text()).toBe(type);
-        expect(component.find('.info').at(1).text()).toBe('Created by testUser');
-        expect(component.find('.info').at(2).text()).toBe('Step: Review');
-        expect(component.find('.actions').text()).toBe('Actions');
-        expect(component.find('.children').length).toBe(0);
-    });
-    it('should show children in expanded mode', function () {
-        jest.spyOn(i18n, 'date').mockImplementation(identity);
-        var component = shallow(React.createElement(PotentialMatchReviewCard, { date: date, createdBy: createdBy, type: type, step: step, Actions: Actions }, children));
-        expect(component.find('CollapseButton').prop('isOpen')).toBeFalsy();
-        act(function () {
-            component.find('CollapseButton').simulate('click');
-            component.update();
+    it('should render correctly', function () { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            setUp();
+            screen.getByTestId('SvgPmIcon');
+            screen.getByText('Match review');
+            screen.getByText(i18n.date(defaultProps.date, 'L'));
+            screen.getByText('pmReviewCardType');
+            screen.getByText('Created by testUser');
+            screen.getByText('Step: Review');
+            screen.getByText('Actions');
+            expect(screen.queryByText('Children')).not.toBeInTheDocument();
+            return [2 /*return*/];
         });
-        expect(component.find('.children').length).toBe(1);
-    });
+    }); });
+    it('should expand and collapse content 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().user;
+                    expect(screen.queryByText('Children')).not.toBeInTheDocument();
+                    return [4 /*yield*/, user.click(screen.getByTestId('collapse-button'))];
+                case 1:
+                    _a.sent();
+                    screen.getByText('Children');
+                    return [4 /*yield*/, user.click(screen.getByTestId('collapse-button'))];
+                case 2:
+                    _a.sent();
+                    expect(screen.queryByText('Children')).not.toBeInTheDocument();
+                    return [2 /*return*/];
+            }
+        });
+    }); });
 });

package/ProfileBand/ProfileBand.spec.js

@@ -10,78 +10,85 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import React from 'react';
-import { shallow } from 'enzyme';
+import { render, screen } from '@testing-library/react';
+import { MdmModuleProvider } from '../contexts/MdmModuleContext';
 import { ProfileBand } from './ProfileBand';
-import { EntityAvatar } from '../EntityAvatar';
-import { EntityTypeBadge } from '../EntityTypeBadge';
-import { useMdmMetadata, useMdmShowEntityId } from '../contexts/MdmModuleContext';
-jest.mock('@reltio/mdm-sdk', function () { return (__assign({}, jest.requireActual('@reltio/mdm-sdk'))); });
-jest.mock('../contexts/MdmModuleContext', function () { return (__assign(__assign({}, jest.requireActual('../contexts/MdmModuleContext')), { useMdmMetadata: jest.fn(), useMdmShowEntityId: jest.fn() })); });
 var metadata = {
     entityTypes: [
         {
             uri: 'configuration/entityTypes/HCP',
             attributes: [
                 {
+                    type: 'String',
                     name: 'FirstName',
                     uri: 'configuration/entityTypes/HCP/attributes/FirstName'
                 }
             ],
-            businessCardAttributeURIs: ['configuration/entityTypes/HCP/attributes/FirstName']
+            businessCardAttributeURIs: ['configuration/entityTypes/HCP/attributes/FirstName'],
+            typeImage: 'images/defaultImage/image.png'
         }
     ]
 };
-describe('Profile band tests', function () {
-    beforeEach(function () {
-        useMdmShowEntityId.mockReturnValue(true);
-        useMdmMetadata.mockReturnValue(metadata);
-    });
-    var entity = {
-        attributes: {
-            FirstName: [
-                {
-                    ov: true,
-                    value: 'First name',
-                    uri: 'entities/1MheIGmc/attributes/FirstName/2l2ktkUn0',
-                    type: 'configuration/entityTypes/HCP/attributes/FirstName'
-                }
-            ]
-        },
-        label: 'Entity one',
-        secondaryLabel: 'Entity expanded label',
-        type: 'configuration/entityTypes/HCP',
-        uri: 'entities/uioU78'
+var defaultEntity = {
+    attributes: {
+        FirstName: [
+            {
+                ov: true,
+                value: 'First name',
+                uri: 'entities/1MheIGmc/attributes/FirstName/2l2ktkUn0',
+                type: 'configuration/entityTypes/HCP/attributes/FirstName'
+            }
+        ]
+    },
+    label: 'Entity one',
+    secondaryLabel: 'Entity expanded label',
+    type: 'configuration/entityTypes/HCP',
+    uri: 'entities/uioU78'
+};
+var defaultProps = { entity: defaultEntity, children: React.createElement("div", null, "Content") };
+var defaultMdmValues = {
+    showEntityId: true,
+    absoluteImagePath: 'https://reltio.com/nui/imagePath',
+    metadata: metadata
+};
+var setUp = function (_a) {
+    var _b = _a === void 0 ? {} : _a, _c = _b.props, props = _c === void 0 ? defaultProps : _c, _d = _b.mdmValues, mdmValues = _d === void 0 ? defaultMdmValues : _d;
+    var Providers = function (_a) {
+        var children = _a.children;
+        return (React.createElement(MdmModuleProvider, { values: mdmValues }, children));
     };
-    it('should render main parts', function () {
-        var component = shallow(React.createElement(ProfileBand, { entity: entity },
-            React.createElement("div", { className: "content" }, "Content")));
-        expect(component.find(EntityAvatar)).toHaveLength(1);
-        expect(component.find(EntityTypeBadge)).toHaveLength(1);
-        expect(component.find('.label').text()).toBe(entity.label);
-        expect(component.find('.secondaryLabel').text()).toBe(entity.secondaryLabel);
-        expect(component.find('.businessCard').text()).toBe('First name');
-        expect(component.find('.entityId').text()).toBe('Entity ID: uioU78');
-        expect(component.find('.content').text()).toBe('Content');
+    return render(React.createElement(ProfileBand, __assign({}, props)), { wrapper: Providers });
+};
+describe('Profile band tests', function () {
+    it('should render main parts correctly', function () {
+        setUp();
+        expect(screen.getByRole('img')).toHaveAttribute('src', 'https://reltio.com/nui/imagePath/images/defaultImage/image.png');
+        screen.getByText('Entity one');
+        screen.getByText('Entity expanded label');
+        screen.getByText('First name');
+        screen.getByText('Entity ID: uioU78');
+        screen.getByText('Content');
     });
-    it('should render inactive profile band', function () {
-        var inactiveEntity = __assign(__assign({}, entity), { endDate: Date.now() - 10 });
-        var component = shallow(React.createElement(ProfileBand, { entity: inactiveEntity }));
-        expect(component.find('.inactive').length).toBe(1);
+    it('should render inactive profile band correctly', function () {
+        var entity = __assign(__assign({}, defaultEntity), { endDate: Date.now() - 10 });
+        var props = __assign(__assign({}, defaultProps), { entity: entity });
+        setUp({ props: props });
+        expect(screen.getByTestId('reltio-profile-band').firstChild).toHaveClass('inactive');
     });
-    it('should hide entityId for create mode', function () {
-        var tmpEntity = __assign(__assign({}, entity), { uri: 'entities/uri$$1646115317921' });
-        var component = shallow(React.createElement(ProfileBand, { entity: tmpEntity },
-            React.createElement("div", { className: "content" }, "Content")));
-        expect(component.find('.entityId').length).toBe(0);
+    it('should hide entity id for create mode', function () {
+        var entity = __assign(__assign({}, defaultEntity), { uri: 'entities/uri$$1646115317921' });
+        var props = __assign(__assign({}, defaultProps), { entity: entity });
+        setUp({ props: props });
+        expect(screen.queryByLabelText('Copy to clipboard')).not.toBeInTheDocument();
     });
-    it('should hide entityId if "showEntityId" selector returns false', function () {
-        useMdmShowEntityId.mockReturnValue(false);
-        var component = shallow(React.createElement(ProfileBand, { entity: entity },
-            React.createElement("div", { className: "content" }, "Content")));
-        expect(component.find('.entityId').length).toBe(0);
+    it('should hide entityId if "showEntityId" is false', function () {
+        var mdmValues = __assign(__assign({}, defaultMdmValues), { showEntityId: false });
+        setUp({ mdmValues: mdmValues });
+        expect(screen.queryByLabelText('Copy to clipboard')).not.toBeInTheDocument();
     });
     it('should render custom label correctly using renderLabel prop', function () {
-        var component = shallow(React.createElement(ProfileBand, { entity: entity, renderLabel: function (label) { return "custom ".concat(label); } }));
-        expect(component.find('.label').text()).toBe("custom ".concat(entity.label));
+        var props = __assign(__assign({}, defaultProps), { renderLabel: function (label) { return "custom ".concat(label); } });
+        setUp({ props: props });
+        screen.getByText('custom Entity one');
     });
 });

package/ProfileCard/ProfileCard.test.js

@@ -1,33 +1,115 @@
+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 = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["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 from 'react';
-import { shallow } from 'enzyme';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import ProfileCard from './ProfileCard';
-import { ProfileCardContent } from './components/ProfileCardContent';
-import { ProfileCardPlaceholder } from './components/ProfileCardPlaceholder';
-describe('ProfileCard tests', function () {
-    var entity = {
-        uri: 'entities/123',
-        label: 'Main label',
-        secondaryLabel: 'secondary label',
-        type: 'configuration/entityTypes/HCP'
+import { MdmModuleProvider } from '../contexts/MdmModuleContext';
+var defaultEntity = {
+    uri: 'entities/123',
+    label: 'Main label',
+    secondaryLabel: 'secondary label',
+    type: 'configuration/entityTypes/HCP'
+};
+var defaultProps = { entity: defaultEntity };
+var mdmValues = {
+    metadata: {
+        entityTypes: [
+            {
+                uri: 'configuration/entityTypes/HCP',
+                label: 'HCP',
+                typeImage: 'images/defaultImage/typeImage_gender_neutral.png'
+            }
+        ]
+    },
+    uiPath: 'https://reltio.com/nui',
+    absoluteImagePath: 'https://images.reltio.com'
+};
+var setUp = function (props) {
+    if (props === void 0) { props = defaultProps; }
+    var user = userEvent.setup();
+    var Providers = function (_a) {
+        var children = _a.children;
+        return (React.createElement(MdmModuleProvider, { values: mdmValues }, children));
     };
-    it('should render container with correctly props', function () {
-        var onClick = jest.fn();
-        var component = shallow(React.createElement(ProfileCard, { entity: entity, classes: { container: 'wrapper' }, onClick: onClick }));
-        expect(component.find('.container').props()).toMatchObject({
-            className: 'container wrapper',
-            onClick: onClick
-        });
+    return __assign(__assign({}, render(React.createElement(ProfileCard, __assign({}, props)), { wrapper: Providers })), { user: user });
+};
+describe('Profile card tests', function () {
+    it('should render profile card content correctly if variant is "normal"', function () {
+        setUp();
+        expect(screen.getByRole('img')).toHaveAttribute('src', 'https://images.reltio.com/images/defaultImage/typeImage_gender_neutral.png');
+        expect(screen.getByRole('link', { name: 'Main label' })).toHaveAttribute('href', 'https://reltio.com/nui#p~com.reltio.plugins.entity.default.DefaultPerspective_e~entities/123');
+        screen.getByText('secondary label');
+        screen.getByText('HCP');
+        screen.getByText('ID:');
+        screen.getByText('123');
     });
-    it('should render ProfileCardContent with correct props if variant is "normal"', function () {
-        var classes = { container: 'label' };
-        var component = shallow(React.createElement(ProfileCard, { entity: entity, classes: classes, variant: "normal" }));
-        expect(component.find(ProfileCardPlaceholder)).toHaveLength(0);
-        expect(component.find(ProfileCardContent)).toHaveLength(1);
-        expect(component.find(ProfileCardContent).props()).toEqual({ entity: entity, classes: classes });
-    });
-    it('should render ProfileCardPlaceholder if variant is "loading"', function () {
-        var component = shallow(React.createElement(ProfileCard, { entity: entity, variant: "loading" }));
-        expect(component.find(ProfileCardContent)).toHaveLength(0);
-        expect(component.find(ProfileCardPlaceholder)).toHaveLength(1);
+    it('should copy entity ID on click', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var user, clipboardText;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    user = setUp().user;
+                    return [4 /*yield*/, user.click(screen.getByText('123'))];
+                case 1:
+                    _a.sent();
+                    return [4 /*yield*/, navigator.clipboard.readText()];
+                case 2:
+                    clipboardText = _a.sent();
+                    expect(clipboardText).toBe('123');
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+    it('should render profile card placeholder correctly if variant is "loading"', function () {
+        var props = __assign(__assign({}, defaultProps), { variant: 'loading' });
+        setUp(props);
+        screen.getByTestId('profile-card-placeholder-avatar');
+        screen.getByTestId('profile-card-placeholder-info');
     });
 });

package/ProfilesList/ProfilesList.d.ts

@@ -6,9 +6,7 @@ type Props = {
     selectedEntityUri?: string;
     onEntityClick?: (entityUri: string) => void;
     onEntityHover?: (entityUri: string) => void;
-    entitiesImportStatus?: {
-        entityUri: string;
-    };
+    entitiesImportStatus?: Record<string, string>;
     entityButtonsRenderer?: (entity: Entity) => void;
 };
 export declare const ProfilesList: ({ entities, entityToHighlight, selectedEntityUri, onEntityClick, onEntityHover, entitiesImportStatus, entityButtonsRenderer }: Props) => React.JSX.Element;

package/ProfilesList/ProfilesList.js

@@ -53,7 +53,7 @@ export var ProfilesList = function (_a) {
                 _a[styles.highlighted] = entityUri === entityToHighlight,
                 _a[styles.inactive] = !isActive,
                 _a[styles.justImported] = importStatus === ImportModes.Success,
-                _a)), onClick: onEntityClick ? function () { return onEntityClick(entityUri); } : undefined, onMouseEnter: onEntityHover ? function () { return onEntityHover(entityUri); } : undefined, onMouseLeave: onEntityHover ? function () { return onEntityHover(null); } : undefined, "data-entity-uri": entityUri },
+                _a)), onClick: onEntityClick ? function () { return onEntityClick(entityUri); } : undefined, onMouseEnter: onEntityHover ? function () { return onEntityHover(entityUri); } : undefined, onMouseLeave: onEntityHover ? function () { return onEntityHover(null); } : undefined, "data-reltio-id": "profiles-list-item", "data-entity-uri": entityUri },
             React.createElement(EntityAvatar, { entity: entity, avatarClassName: styles.avatar, imageClassName: styles.image }),
             React.createElement("div", { className: styles.info },
                 React.createElement("div", null,