@reltio/profile 1.4.1585 → 1.4.1586-mui5

package/src/components/ImageAttributeView/__tests__/ImageAttributeView.test.tsx

@@ -0,0 +1,151 @@
+import React from 'react';
+import {shallow} from 'enzyme';
+import * as reactRedux from 'react-redux';
+import {Mode, findAttributeTypeByUri, ImageAttributeViewConfig} from '@reltio/mdm-sdk';
+import {ImageAttributesLine, FacetViewHeader, DescriptionIcon} from '@reltio/components';
+import {ImageAttributeView} from '../ImageAttributeView';
+import {ImageLineCaption} from '../ImageLineCaption/ImageLineCaption';
+import {ImageAttributeViewEditableContent} from '../ImageAttributeViewEditableContent/ImageAttributeViewEditableContent';
+
+const attributeType = {
+    name: 'ImageGallery',
+    type: 'Image',
+    uri: 'configuration/entityTypes/HCP/attributes/ImageGallery',
+    description: 'Image gallery description'
+};
+jest.mock('@reltio/mdm-sdk', () => ({
+    ...(jest.requireActual('@reltio/mdm-sdk') as Record<string, unknown>),
+    findAttributeTypeByUri: jest.fn().mockReturnValue(attributeType)
+}));
+
+const config = {
+    point: 'com.reltio.plugins.ui.view',
+    id: 'com.reltio.plugins.entity.SingleImageAttributeView',
+    class: 'com.reltio.plugins.entity.attributes.ImageAttributeView',
+    caption: 'Standalone Image Attribute View',
+    attributeUri: 'configuration/entityTypes/HCP/attributes/ImageGallery',
+    max: 5
+} as ImageAttributeViewConfig;
+
+let store;
+const attributes = {
+    ImageGallery: [
+        {
+            label: '',
+            value: {},
+            ov: true,
+            uri: 'entities/1TtEwdrh/attributes/ImageGallery/5d7kixVRn',
+            type: 'configuration/entityTypes/HCP/attributes/ImageGallery'
+        },
+        {
+            label: '',
+            value: {},
+            ov: true,
+            uri: 'entities/1TtEwdrh/attributes/ImageGallery/3sNdpRKCR',
+            type: 'configuration/entityTypes/HCP/attributes/ImageGallery'
+        },
+        {
+            label: '',
+            value: {},
+            ov: true,
+            uri: 'entities/1TtEwdrh/attributes/ImageGallery/3gmC5Kk2k',
+            type: 'configuration/entityTypes/HCP/attributes/ImageGallery'
+        }
+    ],
+    paging: {
+        'configuration/entityTypes/HCP/attributes/ImageGallery': {
+            totalOvValues: 3,
+            totalValues: 3
+        }
+    }
+};
+
+describe('ImageAttributeView tests', () => {
+    const dispatch = jest.fn();
+    beforeEach(() => {
+        store = {
+            profile: {
+                mode: Mode.Viewing,
+                entity: {
+                    uri: 'entities/1',
+                    type: 'configuration/entityTypes/HCP',
+                    attributes: attributes
+                },
+                history: {}
+            }
+        };
+    });
+    beforeAll(() => {
+        jest.spyOn(reactRedux, 'useSelector').mockImplementation((selector) => selector(store));
+        jest.spyOn(reactRedux, 'useDispatch').mockImplementation(() => dispatch);
+    });
+
+    it('should render main parts with props', () => {
+        const component = shallow(<ImageAttributeView config={config} />);
+        const header = component.find(FacetViewHeader);
+        expect(header).toHaveLength(1);
+        expect(header.prop('title')).toBe(config.caption);
+
+        const descriptionIcon = header.find(DescriptionIcon);
+        expect(descriptionIcon).toHaveLength(1);
+        expect(descriptionIcon.prop('description')).toBe(attributeType.description);
+
+        const imageLine = component.find(ImageAttributesLine);
+        expect(imageLine).toHaveLength(1);
+        expect(imageLine.props()).toMatchObject({
+            attributeValues: attributes.ImageGallery,
+            attributeType: attributeType,
+            paging: store.profile.entity.attributes.paging['configuration/entityTypes/HCP/attributes/ImageGallery'],
+            parentUri: store.profile.entity.uri,
+            requestNextPageOfAttributeValues: expect.any(Function)
+        });
+
+        const imageLineCaption = component.find(ImageLineCaption);
+        expect(imageLineCaption).toHaveLength(1);
+        expect(imageLineCaption.props()).toMatchObject({
+            totalImages: attributes.ImageGallery.length
+        });
+    });
+
+    it('should render ImageAttributeViewEditableContent correctly if mode is editable', () => {
+        store.profile.mode = Mode.Editing;
+        const component = shallow(<ImageAttributeView config={config} />);
+        const editableContent = component.find(ImageAttributeViewEditableContent);
+        expect(editableContent).toHaveLength(1);
+        expect(editableContent.props()).toMatchObject({
+            attributeType: attributeType,
+            config: config,
+            paging: store.profile.entity.attributes.paging['configuration/entityTypes/HCP/attributes/ImageGallery'],
+            requestNextPageOfAttributeValues: expect.any(Function)
+        });
+    });
+
+    it('should show default empty text', () => {
+        store.profile.entity.attributes.ImageGallery = [];
+        const component = shallow(<ImageAttributeView config={config} />);
+        expect(component.find(FacetViewHeader)).toHaveLength(1);
+        expect(component.find(ImageAttributesLine)).toHaveLength(0);
+        expect(component.find(ImageLineCaption)).toHaveLength(0);
+        expect(component.find('.noData').text()).toBe('No data found');
+    });
+
+    it('should show default empty text if attribute type does not exist', () => {
+        (findAttributeTypeByUri as jest.Mock).mockReturnValueOnce(null);
+        const component = shallow(<ImageAttributeView config={{...config, attributeUri: 'someIncorrect'}} />);
+        expect(component.find(FacetViewHeader)).toHaveLength(1);
+        expect(component.find(ImageAttributesLine)).toHaveLength(0);
+        expect(component.find(ImageLineCaption)).toHaveLength(0);
+        expect(component.find('.noData').text()).toBe('No data found');
+    });
+
+    it('should show the empty text from config', () => {
+        const emptyText = 'No data';
+        config['text-empty'] = emptyText;
+        store.profile.entity.attributes.ImageGallery = [];
+        const component = shallow(<ImageAttributeView config={config} />);
+        expect(component.find(FacetViewHeader)).toHaveLength(1);
+        expect(component.find(ImageAttributesLine)).toHaveLength(0);
+        expect(component.find(ImageLineCaption)).toHaveLength(0);
+        expect(component.find('.noData').text()).toBe(emptyText);
+    });
+});

package/src/components/ImageAttributeView/__tests__/IntegrationImageAttributeView.test.tsx

@@ -0,0 +1,36 @@
+import React from 'react';
+import {omit} from 'ramda';
+import {Provider} from 'react-redux';
+import {render, screen} from '@testing-library/react';
+import {ProfileViewTypes} from '@reltio/mdm-sdk';
+import {createTestStore} from '../../../../../../__mocks__/store-utils';
+import {createInitialState} from './data/store.data';
+import {ImageAttributeView} from '../ImageAttributeView';
+
+const defaultConfig = {
+    class: ProfileViewTypes.ImageAttribute,
+    id: 'com.reltio.plugins.entity.attributes.ImageAttributeView',
+    attributeUri: 'configuration/entityTypes/HCP/attributes/ImageGallery'
+};
+
+const defaultProps = {
+    config: defaultConfig
+};
+
+const setUp = ({initialState = createInitialState(), props = defaultProps} = {}) => {
+    const store = createTestStore(initialState);
+    jest.spyOn(store, 'dispatch');
+    const Providers = ({children}: {children: React.ReactNode}) => {
+        return <Provider store={store}>{children}</Provider>;
+    };
+    return {...render(<ImageAttributeView {...props} />, {wrapper: Providers}), store};
+};
+
+describe('Image Attribute View integration tests', () => {
+    it('should render No Data if attributeUri is missed in config', () => {
+        const config = omit(['attributeUri'], defaultConfig);
+        const props = {...defaultProps, config};
+        setUp({props});
+        expect(screen.queryByText('No data found')).toBeInTheDocument();
+    });
+});

package/src/components/ImageAttributeView/__tests__/data/store.data.ts

@@ -0,0 +1,22 @@
+import {Mode} from '@reltio/mdm-sdk';
+
+export const createInitialState = () => {
+    const tenant = 'alenat';
+    return {
+        metadata: {
+            [tenant]: {}
+        },
+        profile: {
+            entity: {
+                uri: 'entities/1Q8LXQaE',
+                type: 'configuration/entityTypes/HCP',
+                label: 'Entity label',
+                attributes: {}
+            },
+            mode: Mode.Viewing
+        },
+        tenant: {
+            id: tenant
+        }
+    };
+};

package/src/components/ImageAttributeView/styles.ts

@@ -0,0 +1,13 @@
+import {makeStyles} from '@mui/styles';
+
+const useStyles = makeStyles((theme) => ({
+    container: {
+        padding: '8px 16px'
+    },
+    noData: {
+        fontSize: '13px',
+        color: theme.palette.text.secondary
+    }
+}));
+
+export default useStyles;

package/src/components/Notifications/Notification.tsx

@@ -0,0 +1,98 @@
+import Snackbar from '@mui/material/Snackbar';
+import Portal from '@mui/material/Portal';
+import React, {useCallback, useState} from 'react';
+import i18n from 'ui-i18n';
+import Button from '@mui/material/Button';
+import CloseIcon from '@mui/icons-material/Close';
+import {ConfirmationDialog, SmallIconButton} from '@reltio/components';
+import {NotificationItem, Action} from './types';
+import {useStyles} from './styles';
+import {useDispatch, useSelector} from 'react-redux';
+import mdmModule, {ui as mdmModuleUi} from '@reltio/mdm-module';
+
+type Props = {
+    notification: NotificationItem;
+};
+
+const AUTO_HIDE_DURATION = 5000;
+
+export const Notification = ({notification}: Props) => {
+    const styles = useStyles({});
+    const dispatch = useDispatch();
+    const autoCloseInterval: number = useSelector(mdmModule.selectors.getAutoCloseInterval);
+    const autoHideDuration =
+        notification.autoHideDuration || (autoCloseInterval && autoCloseInterval * 1000) || AUTO_HIDE_DURATION;
+    const [action, setAction] = useState<Action>();
+    const [show, setShow] = useState(true);
+    const closeSnackbar = useCallback(
+        (_e?: unknown, reason?: string) => {
+            if (reason !== 'clickaway') {
+                dispatch(mdmModuleUi.actions.closeNotification(notification.id));
+                setShow(false);
+            }
+        },
+        [notification]
+    );
+    const onDiscard = useCallback(() => {
+        action.cancelAction && dispatch(action.cancelAction);
+        setAction(undefined);
+    }, [action]);
+    const onConfirm = useCallback(() => {
+        dispatch(action.applyAction);
+        setAction(undefined);
+        dispatch(mdmModuleUi.actions.closeNotification(notification.id));
+    }, [action, notification]);
+
+    const actions = (
+        <>
+            {notification.actions.map((action) => (
+                <Button
+                    key={action.label}
+                    color="primary"
+                    size="small"
+                    onClick={() => {
+                        if (action.needConfirmation) {
+                            setAction(action);
+                        } else {
+                            dispatch(action.applyAction);
+                        }
+                        setShow(false);
+                    }}
+                >
+                    {action.label}
+                </Button>
+            ))}
+        </>
+    );
+    const message = (
+        <>
+            <SmallIconButton className={styles.closeIcon} size="S" icon={CloseIcon} onClick={closeSnackbar} />
+            {notification.text}
+        </>
+    );
+
+    return (
+        <>
+            <Portal container={document.body}>
+                <Snackbar
+                    autoHideDuration={autoHideDuration}
+                    open={show}
+                    classes={{root: styles.snackbar}}
+                    action={actions}
+                    onClose={closeSnackbar}
+                    anchorOrigin={{vertical: 'bottom', horizontal: 'center'}}
+                    message={message}
+                />
+            </Portal>
+            <ConfirmationDialog
+                open={!!action}
+                title={action?.confirmationText}
+                content={action?.confirmationDescription}
+                onSave={onConfirm}
+                onDiscard={onDiscard}
+                saveCaption={i18n.text('Proceed')}
+                discardCaption={i18n.text('Cancel')}
+            />
+        </>
+    );
+};

package/src/components/Notifications/Notifications.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import {useSelector} from 'react-redux';
+import mdm from '@reltio/mdm-module';
+import {NotificationItem} from './types';
+import {Notification} from './Notification';
+
+export const Notifications = () => {
+    const notifications: NotificationItem[] = useSelector(mdm.selectors.getNotifications);
+    if (!notifications) return null;
+    return (
+        <>
+            {notifications.slice(-1).map((n) => (
+                <Notification key={n.id} notification={n} />
+            ))}
+        </>
+    );
+};

package/src/components/Notifications/__tests__/Notification.spec.tsx

@@ -0,0 +1,230 @@
+import {ReactWrapper, shallow} from 'enzyme';
+import {Notification} from '../Notification';
+import Snackbar from '@mui/material/Snackbar';
+import React from 'react';
+import {ConfirmationDialog, SmallIconButton} from '@reltio/components';
+import CloseIcon from '@mui/icons-material/Close';
+import Button from '@mui/material/Button';
+import * as reactRedux from 'react-redux';
+import {ui as mdmModuleUi} from '@reltio/mdm-module';
+
+const dispatch = jest.fn();
+
+const getNotification = (needConfirmation = true) => ({
+    id: 'id',
+    type: 'cloneAction',
+    text: 'Profile is cloned successfully. You can modify the attributes if required.',
+    actions: [
+        {
+            label: 'UNDO',
+            needConfirmation,
+            confirmationText: 'Are you sure you want to undo the cloning process?',
+            confirmationDescription:
+                'Undoing the cloning process will delete the cloned profile. Are you sure you want to proceed?',
+            applyAction: {
+                type: 'apply',
+                payload: {}
+            },
+            cancelAction: {
+                type: 'cancel',
+                payload: {}
+            }
+        }
+    ]
+});
+
+let store;
+
+describe('Notification', () => {
+    beforeAll(() => {
+        store = {
+            ui: {
+                autoCloseInterval: 20
+            }
+        };
+        jest.spyOn(reactRedux, 'useDispatch').mockReturnValue(dispatch);
+        jest.spyOn(reactRedux, 'useSelector').mockImplementation((selector) => selector(store));
+    });
+    beforeEach(() => {
+        jest.clearAllMocks();
+    });
+    it('should render snackbar', () => {
+        const notification = getNotification();
+        const component = shallow(<Notification notification={notification} />);
+        expect(component.find(Snackbar)).toHaveLength(1);
+        expect(component.find(Snackbar).prop('open')).toBeTruthy();
+        component.find(Snackbar).prop('onClose')({} as any, 'clickaway');
+        component.update();
+        expect(component.find(Snackbar).prop('open')).toBeTruthy();
+        const message = new ReactWrapper(component.find(Snackbar).prop('message') as React.ReactElement);
+        expect(message.find(SmallIconButton)).toHaveLength(1);
+        expect(message.find(SmallIconButton).prop('icon')).toBe(CloseIcon);
+        expect(dispatch).not.toHaveBeenCalled();
+        (message.find(SmallIconButton).prop('onClick') as () => void)();
+        component.update();
+        expect(component.find(Snackbar).prop('open')).toBeFalsy();
+        expect(dispatch).toHaveBeenCalledWith(mdmModuleUi.actions.closeNotification(notification.id));
+        expect(component.find(Snackbar).prop('anchorOrigin')).toEqual({
+            vertical: 'bottom',
+            horizontal: 'center'
+        });
+        expect(component.find(Snackbar).prop('autoHideDuration')).toBe(20000);
+        const action = new ReactWrapper(component.find(Snackbar).prop('action') as React.ReactElement);
+        expect(action.find(Button)).toHaveLength(1);
+        expect(action.find(Button).prop('color')).toBe('primary');
+        expect(action.find(Button).prop('children')).toBe('UNDO');
+    });
+
+    it('should pass autoHideDuration to snackbar', () => {
+        const notification = {
+            ...getNotification(),
+            autoHideDuration: 10000
+        };
+        const component = shallow(<Notification notification={notification} />);
+        expect(component.find(Snackbar).prop('autoHideDuration')).toBe(10000);
+    });
+
+    it('should pass default autoHideDuration to snackbar', () => {
+        const notification = getNotification();
+        store = {ui: {}};
+        const component = shallow(<Notification notification={notification} />);
+        expect(component.find(Snackbar).prop('autoHideDuration')).toBe(5000);
+    });
+
+    it('should render ConfirmationDialog properly', () => {
+        const notification = getNotification();
+        const component = shallow(<Notification notification={notification} />);
+        expect(component.find(Snackbar).prop('open')).toBeTruthy();
+        expect(component.find(ConfirmationDialog)).toHaveLength(1);
+        expect(component.find(ConfirmationDialog).prop('open')).toBeFalsy();
+        expect(component.find(ConfirmationDialog).prop('saveCaption')).toBe('Proceed');
+        expect(component.find(ConfirmationDialog).prop('discardCaption')).toBe('Cancel');
+
+        const action = new ReactWrapper(component.find(Snackbar).prop('action') as React.ReactElement);
+        expect(action.find(Button)).toHaveLength(1);
+        (action.find(Button).prop('onClick') as () => void)();
+        component.update();
+        expect(component.find(Snackbar).prop('open')).toBeFalsy();
+        expect(component.find(ConfirmationDialog).prop('open')).toBeTruthy();
+        expect(component.find(ConfirmationDialog).prop('title')).toBe(
+            'Are you sure you want to undo the cloning process?'
+        );
+        expect(component.find(ConfirmationDialog).prop('content')).toBe(
+            'Undoing the cloning process will delete the cloned profile. Are you sure you want to proceed?'
+        );
+        expect(dispatch).not.toHaveBeenCalled();
+    });
+
+    it('should call apply action without confirmation', () => {
+        const notification = getNotification(false);
+        const component = shallow(<Notification notification={notification} />);
+        expect(component.find(Snackbar).prop('open')).toBeTruthy();
+        expect(component.find(ConfirmationDialog)).toHaveLength(1);
+        expect(component.find(ConfirmationDialog).prop('open')).toBeFalsy();
+        expect(component.find(ConfirmationDialog).prop('saveCaption')).toBe('Proceed');
+        expect(component.find(ConfirmationDialog).prop('discardCaption')).toBe('Cancel');
+
+        const action = new ReactWrapper(component.find(Snackbar).prop('action') as React.ReactElement);
+        expect(action.find(Button)).toHaveLength(1);
+        (action.find(Button).prop('onClick') as () => void)();
+        component.update();
+        expect(component.find(Snackbar).prop('open')).toBeFalsy();
+        expect(component.find(ConfirmationDialog).prop('open')).toBeFalsy();
+        expect(dispatch).toHaveBeenCalledWith(notification.actions[0].applyAction);
+    });
+
+    it('should call cancel action properly', () => {
+        const notification = getNotification();
+        const component = shallow(<Notification notification={notification} />);
+        expect(component.find(Snackbar).prop('open')).toBeTruthy();
+        const action = new ReactWrapper(component.find(Snackbar).prop('action') as React.ReactElement);
+        (action.find(Button).prop('onClick') as () => void)();
+        component.update();
+        expect(component.find(Snackbar).prop('open')).toBeFalsy();
+        expect(component.find(ConfirmationDialog).prop('open')).toBeTruthy();
+        component.find(ConfirmationDialog).prop('onDiscard')();
+        expect(dispatch).toHaveBeenCalledWith(notification.actions[0].cancelAction);
+        component.update();
+        expect(component.find(Snackbar).prop('open')).toBeFalsy();
+        expect(component.find(ConfirmationDialog).prop('open')).toBeFalsy();
+    });
+
+    it('should call apply action properly', () => {
+        const notification = getNotification();
+        const component = shallow(<Notification notification={notification} />);
+        expect(component.find(Snackbar).prop('open')).toBeTruthy();
+        const action = new ReactWrapper(component.find(Snackbar).prop('action') as React.ReactElement);
+        (action.find(Button).prop('onClick') as () => void)();
+        component.update();
+        expect(component.find(Snackbar).prop('open')).toBeFalsy();
+        expect(component.find(ConfirmationDialog).prop('open')).toBeTruthy();
+        component.find(ConfirmationDialog).prop('onSave')();
+        expect(dispatch).toHaveBeenCalledWith(notification.actions[0].applyAction);
+        component.update();
+        expect(component.find(Snackbar).prop('open')).toBeFalsy();
+        expect(component.find(ConfirmationDialog).prop('open')).toBeFalsy();
+    });
+
+    it('should not render action buttons', () => {
+        const notification = {
+            id: 'id',
+            type: 'cloneAction',
+            text: 'Profile is cloned successfully. You can modify the attributes if required.',
+            actions: []
+        };
+        const component = shallow(<Notification notification={notification} />);
+        expect(component.find(Snackbar).prop('open')).toBeTruthy();
+        expect(component.find(ConfirmationDialog)).toHaveLength(1);
+        expect(component.find(ConfirmationDialog).prop('open')).toBeFalsy();
+
+        const action = new ReactWrapper(component.find(Snackbar).prop('action') as React.ReactElement);
+        expect(action.find(Button)).toHaveLength(0);
+    });
+
+    it('should render two action buttons', () => {
+        const notification = {
+            id: 'id',
+            type: 'cloneAction',
+            text: 'Profile is cloned successfully. You can modify the attributes if required.',
+            actions: [
+                {
+                    label: 'UNDO',
+                    needConfirmation: true,
+                    confirmationText: 'Are you sure you want to undo the cloning process?',
+                    confirmationDescription:
+                        'Undoing the cloning process will delete the cloned profile. Are you sure you want to proceed?',
+                    applyAction: {
+                        type: 'apply',
+                        payload: {}
+                    },
+                    cancelAction: {
+                        type: 'cancel',
+                        payload: {}
+                    }
+                },
+                {
+                    label: 'Apply',
+                    needConfirmation: false,
+                    confirmationText: 'Are you sure you want to undo the cloning process?',
+                    confirmationDescription:
+                        'Undoing the cloning process will delete the cloned profile. Are you sure you want to proceed?',
+                    applyAction: {
+                        type: 'apply',
+                        payload: {}
+                    },
+                    cancelAction: {
+                        type: 'cancel',
+                        payload: {}
+                    }
+                }
+            ]
+        };
+        const component = shallow(<Notification notification={notification} />);
+        expect(component.find(Snackbar).prop('open')).toBeTruthy();
+        expect(component.find(ConfirmationDialog)).toHaveLength(1);
+        expect(component.find(ConfirmationDialog).prop('open')).toBeFalsy();
+
+        const action = new ReactWrapper(component.find(Snackbar).prop('action') as React.ReactElement);
+        expect(action.find(Button)).toHaveLength(2);
+    });
+});

package/src/components/Notifications/__tests__/Notifications.spec.tsx

@@ -0,0 +1,37 @@
+import {shallow} from 'enzyme';
+import React from 'react';
+import * as reactRedux from 'react-redux';
+
+import {Notifications} from '../Notifications';
+import {Notification} from '../Notification';
+
+let store: {ui: {notifications?: Array<{id: string}>}} = {
+    ui: {}
+};
+
+describe('Notifications', () => {
+    beforeAll(() => {
+        jest.spyOn(reactRedux, 'useSelector').mockImplementation((selector) => selector(store));
+    });
+    it('should not render anything', () => {
+        const component = shallow(<Notifications />);
+        expect(component.find(Notification)).toHaveLength(0);
+    });
+    it('should render last Notifications', () => {
+        store = {
+            ui: {
+                notifications: [
+                    {
+                        id: 'id1'
+                    },
+                    {
+                        id: 'id2'
+                    }
+                ]
+            }
+        };
+        const component = shallow(<Notifications />);
+        expect(component.find(Notification)).toHaveLength(1);
+        expect(component.find(Notification).prop('notification')).toBe(store.ui.notifications[1]);
+    });
+});

package/src/components/Notifications/index.ts

@@ -0,0 +1 @@
+export {Notifications} from './Notifications';

package/src/components/Notifications/styles.ts

@@ -0,0 +1,17 @@
+import {makeStyles} from '@mui/styles';
+
+export const useStyles = makeStyles(() => ({
+    closeIcon: {
+        paddingRight: '12px',
+        boxSizing: 'content-box',
+        '& path': {
+            fill: '#fff'
+        }
+    },
+    snackbar: {
+        '& > div': {
+            flexWrap: 'nowrap',
+            alignItems: 'baseline'
+        }
+    }
+}));

package/src/components/Notifications/types.ts

@@ -0,0 +1,21 @@
+export type Action = {
+    label: string;
+    needConfirmation?: boolean;
+    confirmationText?: string;
+    confirmationDescription?: string;
+    applyAction: ReduxAction;
+    cancelAction?: ReduxAction;
+};
+
+type ReduxAction = {
+    type: string;
+    payload: unknown;
+};
+
+export type NotificationItem = {
+    id: string;
+    type: string;
+    text: string;
+    actions: Action[];
+    autoHideDuration?: number;
+};