@reltio/profile 1.4.1585 → 1.4.1586-mui5

package/src/components/ProfileTableAttributeView/components/TableAttributeContent/__tests__/TableAttributeContent.test.tsx

@@ -0,0 +1,600 @@
+import React, {ContextType} from 'react';
+import {act} from 'react-dom/test-utils';
+import {mount} from 'enzyme';
+import * as reactRedux from 'react-redux';
+import {Mode, ProfileViewTypes, createNewAttribute} from '@reltio/mdm-sdk';
+import {ScrollToElementContext, ViewIdContext, useScrollToAttributeError, ScrollType} from '@reltio/components';
+import {profile} from '@reltio/mdm-module';
+import {TableAttributeContext} from '../../../contexts/TableAttributeContext';
+import AttributeTable from '../../AttributeTable/AttributeTable';
+import {TableAttributeEditableContent} from '../../TableAttributeEditableContent/TableAttributeEditableContent';
+import TableAttributeContent from '../TableAttributeContent';
+
+jest.mock('@reltio/components', () => ({
+    ...(jest.requireActual('@reltio/components') as Record<string, unknown>),
+    useScrollToAttributeError: jest.fn()
+}));
+jest.mock('@reltio/mdm-sdk', () => ({
+    ...jest.requireActual<Record<string, unknown>>('@reltio/mdm-sdk'),
+    createNewAttribute: jest.fn()
+}));
+jest.mock('../../AttributeTable/AttributeTable', () => () => null);
+jest.mock('../../TableAttributeEditableContent/TableAttributeEditableContent', () => ({
+    TableAttributeEditableContent: () => null
+}));
+
+const defaultConfig = {
+    attributeUri: 'configuration/entityTypes/HCP/attributes/FirstLevelNested',
+    caption: 'Attributes View',
+    max: 15,
+    id: 'viewId',
+    class: ProfileViewTypes.AttributeTable
+};
+
+const defaultAttributeType = {
+    uri: 'configuration/entityTypes/HCP/attributes/FirstLevelNested',
+    name: 'FirstLevelNested',
+    description: 'description FirstLevelNested',
+    hidden: false,
+    type: 'Nested',
+    attributes: [
+        {
+            label: 'FirstLevelNestedSub1_HCP',
+            name: 'FirstLevelNestedSub1',
+            uri: 'configuration/entityTypes/HCP/attributes/FirstLevelNested/attributes/FirstLevelNestedSub1',
+            dependentLookupCode: 'LANG_CD',
+            searchable: true,
+            skipInDataAccess: false,
+            system: false,
+            type: 'String'
+        },
+        {
+            label: 'Date1_HCP',
+            name: 'Date1',
+            uri: 'configuration/entityTypes/HCP/attributes/FirstLevelNested/attributes/Date1',
+            attributeOrdering: {orderType: 'ASC', orderingStrategy: 'LUD'},
+            skipInDataAccess: false,
+            system: false,
+            faceted: true,
+            hidden: false,
+            type: 'Date'
+        }
+    ]
+};
+
+const defaultAllColumnsData = [
+    {
+        id: 'attributes.FirstLevelNested.FirstLevelNestedSub1',
+        label: 'FirstLevelNestedSub1_HCP'
+    },
+    {
+        id: 'attributes.FirstLevelNested.Date1',
+        label: 'Date1_HCP'
+    }
+];
+
+const defaultVisibleColumns = ['attributes.FirstLevelNested.FirstLevelNestedSub1', 'attributes.FirstLevelNested.Date1'];
+
+const defaultValues = [
+    {
+        uri: 'entities/mnGg0XB/attributes/FirstLevelNested/3YrwSm39Q',
+        ov: true,
+        label: 'Gujarati',
+        value: {
+            Date1: [
+                {
+                    ov: true,
+                    pin: true,
+                    type: 'configuration/entityTypes/HCP/attributes/FirstLevelNested/attributes/Date1',
+                    uri: 'entities/mnGg0XB/attributes/FirstLevelNested/3YrwSm39Q/Date1/3YrwSnQOa',
+                    value: '2020-09-09'
+                }
+            ],
+            FirstLevelNestedSub1: [
+                {
+                    type: 'configuration/entityTypes/HCP/attributes/FirstLevelNested/attributes/FirstLevelNestedSub1',
+                    uri: 'entities/mnGg0XB/attributes/FirstLevelNested/3YrwSm39Q/FirstLevelNestedSub1/3YrwSnHs4',
+                    value: 'Gujarati',
+                    ov: true,
+                    lookupRawValue: 'guj',
+                    lookupCode: 'guj'
+                }
+            ]
+        }
+    }
+];
+
+const defaultProps = {
+    config: defaultConfig,
+    entityUri: 'entities/1E4APrQW',
+    attributeType: defaultAttributeType
+};
+
+const defaultContextValue = {
+    values: defaultValues,
+    visibleColumns: defaultVisibleColumns,
+    onFilter: jest.fn(),
+    onSort: jest.fn(),
+    filters: null,
+    sorting: null,
+    allColumnsData: defaultAllColumnsData,
+    attributeType: defaultAttributeType
+};
+
+const defaultErrorContextValue = {
+    element: null,
+    highlightError: jest.fn(),
+    scrollIntoRef: jest.fn(),
+    type: ScrollType.Error
+};
+
+const defaultModifiedAttributeValues = [
+    {
+        uri: 'entities/mnGg0XB/attributes/FirstLevelNested/3YrwSm39Q',
+        ov: true,
+        label: 'Gujarati',
+        value: {
+            Date1: [
+                {
+                    ov: true,
+                    pin: true,
+                    type: 'configuration/entityTypes/HCP/attributes/FirstLevelNested/attributes/Date1',
+                    uri: 'entities/mnGg0XB/attributes/FirstLevelNested/3YrwSm39Q/Date1/3YrwSnQOa',
+                    value: '2020-19-09'
+                }
+            ],
+            FirstLevelNestedSub1: [
+                {
+                    type: 'configuration/entityTypes/HCP/attributes/FirstLevelNested/attributes/FirstLevelNestedSub1',
+                    uri: 'entities/mnGg0XB/attributes/FirstLevelNested/3YrwSm39Q/FirstLevelNestedSub1/3YrwSnHs4',
+                    value: 'Gujarati',
+                    ov: true,
+                    lookupRawValue: 'guj',
+                    lookupCode: 'guj'
+                }
+            ]
+        }
+    }
+];
+
+const defaultNewAttributeValue = {
+    uri: 'entities/mnGg0XB/attributes/FirstLevelNested/uri$$3YrwSm39Q',
+    label: 'GujaratiNew',
+    value: {}
+};
+
+const tenant = 'knest';
+
+const createStore = (mode = Mode.Viewing, withNewAttribute = false) => {
+    const values = [...(withNewAttribute ? [defaultNewAttributeValue] : []), ...defaultModifiedAttributeValues];
+
+    return {
+        metadata: {
+            [tenant]: {
+                uri: 'configuration',
+                entityTypes: [
+                    {
+                        uri: 'configuration/entityTypes/HCP',
+                        attributes: [defaultAttributeType]
+                    }
+                ]
+            }
+        },
+        profile: {
+            entity: {
+                uri: 'entities/1E4APrQW'
+            },
+            modifiedEntities: {
+                'entities/1E4APrQW': {
+                    uri: 'entities/1E4APrQW',
+                    type: 'configuration/entityTypes/HCP',
+                    attributes: {
+                        FirstLevelNested: values
+                    }
+                }
+            },
+            mode
+        },
+        tenant: {
+            id: tenant
+        },
+        user: {
+            roles: []
+        }
+    };
+};
+
+const setUp = ({
+    props = defaultProps,
+    contextValue = defaultContextValue,
+    errorContextValue = defaultErrorContextValue
+} = {}) => {
+    return mount(
+        <ViewIdContext.Provider value="viewId">
+            <ScrollToElementContext.Provider value={errorContextValue}>
+                <TableAttributeContext.Provider
+                    value={contextValue as unknown as ContextType<typeof TableAttributeContext>}
+                >
+                    <TableAttributeContent {...props} />
+                </TableAttributeContext.Provider>
+            </ScrollToElementContext.Provider>
+        </ViewIdContext.Provider>
+    );
+};
+
+describe('TableAttributeContent tests', () => {
+    let store;
+
+    const scrollToAttributeError = {
+        ref: React.createRef() as React.MutableRefObject<HTMLDivElement>,
+        errorClassName: 'errorClassName',
+        path: []
+    };
+
+    const emptyEditorValue = {
+        uri: 'entities/mnGg0XB/attributes/FirstLevelNested/uri$$3YrwSm39Q',
+        ov: true,
+        type: defaultAttributeType.uri,
+        value: {}
+    };
+
+    const dispatch = jest.fn();
+
+    beforeEach(() => {
+        store = createStore();
+
+        (createNewAttribute as jest.Mock).mockReturnValue(emptyEditorValue);
+        (useScrollToAttributeError as jest.Mock).mockReturnValue(scrollToAttributeError);
+
+        jest.spyOn(reactRedux, 'useSelector').mockImplementation((selector) => selector(store));
+        jest.spyOn(reactRedux, 'useDispatch').mockReturnValue(dispatch);
+    });
+
+    afterEach(() => {
+        jest.clearAllMocks();
+    });
+
+    it('should render TableAttributeEditableContent with correct props if mode is Editing', () => {
+        store = createStore(Mode.Editing);
+        const component = setUp();
+
+        expect(component.find(TableAttributeEditableContent).props()).toEqual({
+            config: defaultConfig,
+            editingValues: [],
+            modifiedValues: defaultModifiedAttributeValues,
+            onChangeAttribute: expect.any(Function),
+            onDeleteAttribute: expect.any(Function),
+            onAdd: expect.any(Function),
+            onCancel: expect.any(Function),
+            onApply: expect.any(Function),
+            onStartEditing: expect.any(Function),
+            checkHasChanges: expect.any(Function),
+            onReset: expect.any(Function),
+            highlightedError: undefined,
+            highlightedAttributeError: undefined
+        });
+    });
+
+    it('should not render TableAttributeEditableContent if mode is Viewing', () => {
+        const component = setUp();
+        expect(component.find(TableAttributeEditableContent)).toHaveLength(0);
+    });
+
+    it('should render AttributeTable with correct props if visibleColumnsData has values', () => {
+        const contextValue = {...defaultContextValue};
+        const component = setUp({contextValue});
+
+        expect(component.find(AttributeTable).props()).toEqual({
+            columnsData: contextValue.allColumnsData,
+            config: defaultConfig,
+            values: contextValue.values,
+            filters: contextValue.filters,
+            onFilter: contextValue.onFilter,
+            sorting: contextValue.sorting,
+            onSort: contextValue.onSort,
+            onEdit: expect.any(Function),
+            onDeleteAttribute: expect.any(Function),
+            deletedUris: []
+        });
+    });
+
+    it('should not render AttributeTable if there are no visible columns', () => {
+        const contextValue = {...defaultContextValue, visibleColumns: []};
+        const component = setUp({contextValue});
+        expect(component.find(AttributeTable).length).toBe(0);
+    });
+
+    it('should render AttributeTable correctly if not all columns are visible and have filter and sorting', () => {
+        const attrSearchUri = 'attributes.FirstLevelNested.FirstLevelNestedSub1';
+        const sorting = {field: attrSearchUri, order: 'asc'};
+        const visibleColumns = [attrSearchUri];
+        const filters = {[attrSearchUri]: {filter: 'equal', value: '777'}};
+        const contextValue = {...defaultContextValue, sorting, filters, visibleColumns};
+        const component = setUp({contextValue});
+        expect(component.find(AttributeTable).props()).toMatchObject({
+            columnsData: [contextValue.allColumnsData[0]],
+            filters,
+            sorting
+        });
+    });
+
+    it('should render AttributeTable with correct values if mode is Editing', () => {
+        store = createStore(Mode.Editing);
+        const component = setUp();
+        expect(component.find(AttributeTable).prop('values')).not.toEqual(defaultValues);
+        expect(component.find(AttributeTable).prop('values')).toEqual(defaultModifiedAttributeValues);
+    });
+
+    it('should pass deletedUris to AttributeTable in Editing mode', () => {
+        store = createStore(Mode.Editing);
+
+        const deletedUri = 'entities/mnGg0XB/attributes/FirstLevelNested/deletedUri';
+        const deletedValue = {
+            uri: deletedUri,
+            ov: true,
+            label: 'Gujarati',
+            value: {
+                Date1: [],
+                FirstLevelNestedSub1: []
+            }
+        };
+        const values = [deletedValue, ...defaultValues];
+        const contextValue = {...defaultContextValue, values};
+        const component = setUp({contextValue});
+        expect(component.find(AttributeTable).prop('deletedUris')).toEqual([deletedUri]);
+    });
+
+    it('should render AttributeTable with empty attribute if attribute does not exist any attributes and attribute type is required', () => {
+        const entityUri = store.profile.entity.uri;
+        store = createStore(Mode.Editing);
+        store.profile.modifiedEntities[entityUri].attributes = {};
+
+        const attributeType = {...defaultAttributeType, required: true};
+        const contextValue = {...defaultContextValue, attributeType, values: []};
+        const component = setUp({contextValue});
+        expect(component.find(AttributeTable).prop('values')).toEqual([emptyEditorValue]);
+    });
+
+    it('should replace value which is editing now with the last saved original version', () => {
+        store = createStore(Mode.Editing);
+        const component = setUp();
+
+        expect(component.find(AttributeTable).prop('values')).toEqual(defaultModifiedAttributeValues);
+
+        const editAttribute = component.find(AttributeTable).prop('onEdit');
+        const originalValue = {...defaultModifiedAttributeValues[0], label: 'originalLabel'};
+
+        act(() => {
+            editAttribute(originalValue);
+        });
+
+        component.update();
+
+        expect(component.find(AttributeTable).prop('values')).not.toEqual(defaultModifiedAttributeValues);
+        expect(component.find(AttributeTable).prop('values')).toEqual([originalValue]);
+
+        const onCancelEditing = component.find(TableAttributeEditableContent).prop('onCancel');
+
+        act(() => {
+            onCancelEditing(defaultModifiedAttributeValues[0]);
+        });
+
+        component.update();
+
+        const originalItem = {
+            uri: defaultModifiedAttributeValues[0].uri,
+            value: originalValue,
+            attributeType: defaultAttributeType,
+            viewId: 'viewId'
+        };
+
+        expect(dispatch).toHaveBeenCalledWith(profile.actions.modifyAttribute(originalItem));
+        expect(dispatch).toHaveBeenCalledWith(profile.errors.actions.errorsSet([]));
+        component.update();
+        expect(component.find(AttributeTable).prop('values')).toEqual(defaultModifiedAttributeValues);
+    });
+
+    it('should not call modifyAttribute after cancel if attribute does not exist in state', () => {
+        const entityUri = store.profile.entity.uri;
+        store = createStore(Mode.Editing);
+        store.profile.modifiedEntities[entityUri].attributes = {};
+        const component = setUp();
+        const onEdit = component.find(AttributeTable).prop('onEdit');
+        act(() => {
+            onEdit(emptyEditorValue);
+        });
+        component.update();
+        const onCancel = component.find(TableAttributeEditableContent).prop('onCancel');
+        act(() => {
+            onCancel(emptyEditorValue);
+        });
+        component.update();
+        expect(dispatch).toHaveBeenCalledWith(profile.errors.actions.errorsSet([]));
+        expect(dispatch.mock.calls.length).toBe(1);
+    });
+
+    it('should delete saved original copy on apply', () => {
+        store = createStore(Mode.Editing, true);
+
+        const component = setUp();
+        const onAdd = component.find(TableAttributeEditableContent).prop('onAdd');
+        act(() => {
+            onAdd();
+        });
+        component.update();
+        expect(component.find(AttributeTable).prop('values')).toEqual(defaultModifiedAttributeValues);
+        const onApply = component.find(TableAttributeEditableContent).prop('onApply');
+        act(() => {
+            onApply(defaultNewAttributeValue);
+        });
+        component.update();
+        const modifiedValuesWithNewValue = [defaultNewAttributeValue, ...defaultModifiedAttributeValues];
+        expect(component.find(AttributeTable).prop('values')).toEqual(modifiedValuesWithNewValue);
+    });
+
+    it('should not add new editing value to values list until it is applied or cancel', () => {
+        store = createStore(Mode.Editing, true);
+
+        const component = setUp();
+        const onAdd = component.find(TableAttributeEditableContent).prop('onAdd');
+        act(() => {
+            onAdd();
+        });
+        component.update();
+        expect(component.find(AttributeTable).prop('values')).toEqual(defaultModifiedAttributeValues);
+        const onCancel = component.find(TableAttributeEditableContent).prop('onCancel');
+        act(() => {
+            onCancel(defaultNewAttributeValue);
+        });
+        component.update();
+        const attributeItem = {
+            value: defaultNewAttributeValue,
+            attributeType: defaultAttributeType,
+            uri: 'entities/mnGg0XB/attributes/FirstLevelNested/uri$$3YrwSm39Q',
+            viewId: 'viewId'
+        };
+        expect(dispatch).toHaveBeenCalledWith(profile.actions.removeAttribute(attributeItem));
+        component.update();
+        const modifiedValuesWithNewValue = [defaultNewAttributeValue, ...defaultModifiedAttributeValues];
+        expect(component.find(AttributeTable).prop('values')).toEqual(modifiedValuesWithNewValue);
+    });
+
+    it('should support multiple editing if values contains editingValuesOriginal', () => {
+        store = createStore(Mode.Editing, true);
+
+        const component = setUp();
+
+        let editingValues = component.find(TableAttributeEditableContent).prop('editingValues');
+
+        expect(editingValues).toHaveLength(0);
+        expect(component.find(AttributeTable).prop('values')).toHaveLength(2);
+
+        const onEdit = component.find(AttributeTable).prop('onEdit');
+
+        act(() => {
+            onEdit({
+                uri: 'entities/mnGg0XB/attributes/FirstLevelNested/uri$$3YrwSm39Q',
+                label: 'GujaratiNew',
+                value: {}
+            });
+            onEdit(defaultModifiedAttributeValues[0]);
+        });
+
+        component.update();
+
+        const checkHasChanges = component.find(TableAttributeEditableContent).prop('checkHasChanges');
+        editingValues = component.find(TableAttributeEditableContent).prop('editingValues');
+
+        expect(editingValues).toHaveLength(2);
+        expect(checkHasChanges(editingValues[0])).toBeTruthy();
+        expect(checkHasChanges(editingValues[1])).toBeFalsy();
+    });
+
+    it('should pass highlightedError and highlightedAttributeError correctly if error is attribute type error', () => {
+        store = createStore(Mode.Editing);
+
+        const error = {
+            parentUri: store.profile.entity.uri,
+            attributeTypeUri: defaultAttributeType.uri,
+            uri: ''
+        };
+        const errorContextValue = {...defaultErrorContextValue, element: error};
+        const component = setUp({errorContextValue});
+        expect(useScrollToAttributeError).toHaveBeenCalledWith({highlightedError: errorContextValue, isSimple: true});
+        expect(component.find(TableAttributeEditableContent).prop('highlightedError')).toEqual(error);
+        expect(component.find(TableAttributeEditableContent).prop('highlightedAttributeError')).toEqual(undefined);
+    });
+
+    it('should pass highlightedError and highlightedAttributeError correctly if error is not attribute type error and not from subattribute', () => {
+        store = createStore(Mode.Editing);
+
+        const error = {
+            parentUri: store.profile.entity.uri,
+            attributeTypeUri: 'configuration/entityTypes/HCP/attributes/OtherAttribute',
+            uri: ''
+        };
+        const errorContextValue = {...defaultErrorContextValue, error};
+        const component = setUp({errorContextValue});
+        expect(useScrollToAttributeError).toHaveBeenCalledWith({highlightedError: null, isSimple: true});
+        expect(component.find(TableAttributeEditableContent).prop('highlightedError')).toBe(undefined);
+        expect(component.find(TableAttributeEditableContent).prop('highlightedAttributeError')).toEqual(undefined);
+    });
+
+    it('should pass highlightedError and highlightedAttributeError correctly if error is null', () => {
+        store = createStore(Mode.Editing);
+
+        const component = setUp({errorContextValue: null});
+        expect(useScrollToAttributeError).toHaveBeenCalledWith({highlightedError: null, isSimple: true});
+        expect(component.find(TableAttributeEditableContent).prop('highlightedError')).toBe(undefined);
+        expect(component.find(TableAttributeEditableContent).prop('highlightedAttributeError')).toEqual(undefined);
+    });
+
+    it('should pass highlightedError and highlightedAttributeError correctly if error is from subattribute', () => {
+        store = createStore(Mode.Editing);
+
+        const error = {
+            parentUri: `${store.profile.entity.uri}/attributes/FirstLevelNested/uri12345`,
+            attributeTypeUri: `${defaultAttributeType.uri}/attributes/Value`,
+            uri: ''
+        };
+        const errorContextValue = {...defaultErrorContextValue, element: error};
+        const component = setUp({errorContextValue});
+        expect(useScrollToAttributeError).toHaveBeenCalledWith({highlightedError: null, isSimple: true});
+        expect(component.find(TableAttributeEditableContent).prop('highlightedError')).toBe(undefined);
+        expect(component.find(TableAttributeEditableContent).prop('highlightedAttributeError')).toEqual(error);
+    });
+
+    it('should pass highlightedError and highlightedAttributeError correctly if error is from top level attribute', () => {
+        store = createStore(Mode.Editing);
+
+        const error = {
+            parentUri: store.profile.entity.uri,
+            attributeTypeUri: defaultAttributeType.uri,
+            uri: `${store.profile.entity.uri}/attributes/FirstLevelNested/uri12345`
+        };
+        const errorContextValue = {...defaultErrorContextValue, element: error};
+        const component = setUp({errorContextValue});
+        expect(useScrollToAttributeError).toHaveBeenCalledWith({highlightedError: null, isSimple: true});
+        expect(component.find(TableAttributeEditableContent).prop('highlightedError')).toBe(undefined);
+        expect(component.find(TableAttributeEditableContent).prop('highlightedAttributeError')).toEqual(error);
+    });
+
+    it('onReset should reset newAttributeUri correctly', () => {
+        store = createStore(Mode.Editing, true);
+
+        const component = setUp();
+        const onAdd = component.find(TableAttributeEditableContent).prop('onAdd');
+        act(() => {
+            onAdd();
+        });
+        component.update();
+        expect(component.find(TableAttributeEditableContent).prop('editingValues')).toHaveLength(1);
+        const onReset = component.find(TableAttributeEditableContent).prop('onReset');
+        act(() => {
+            onReset();
+        });
+        component.update();
+        expect(component.find(TableAttributeEditableContent).prop('editingValues')).toHaveLength(0);
+    });
+
+    it('onReset should reset originalValues correctly', () => {
+        store = createStore(Mode.Editing);
+
+        const component = setUp();
+        expect(component.find(AttributeTable).prop('values')).toEqual(defaultModifiedAttributeValues);
+        expect(component.find(TableAttributeEditableContent).prop('editingValues')).toHaveLength(0);
+        const onEdit = component.find(AttributeTable).prop('onEdit');
+        const originalValue = {...defaultModifiedAttributeValues[0], label: 'originalLabel'};
+        act(() => {
+            onEdit(originalValue);
+        });
+        component.update();
+        expect(component.find(TableAttributeEditableContent).prop('editingValues')).toHaveLength(1);
+        const onReset = component.find(TableAttributeEditableContent).prop('onReset');
+        act(() => {
+            onReset();
+        });
+        component.update();
+        expect(component.find(TableAttributeEditableContent).prop('editingValues')).toHaveLength(0);
+    });
+});