@reltio/components 1.4.877 → 1.4.881

package/cjs/components/VerticalHeadingsTable/VerticalHeadingsTable.js

@@ -0,0 +1,72 @@
+"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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var prop_types_1 = __importDefault(require("prop-types"));
+var DefaultHeadCellRenderer = function (_a) {
+    var label = _a.label;
+    return label || null;
+};
+var DefaultCellRenderer = function (_a) {
+    var value = _a.value;
+    return value || null;
+};
+var VerticalHeadingsTable = function (_a) {
+    var className = _a.className, rowsData = _a.rowsData, columnsData = _a.columnsData, _b = _a.theadRowsNumber, theadRowsNumber = _b === void 0 ? 0 : _b;
+    var renderRow = function (rowData) {
+        var CellRenderer = rowData.cellRenderer || DefaultCellRenderer;
+        var HeadCellRenderer = rowData.headCellRenderer || DefaultHeadCellRenderer;
+        return (react_1.default.createElement("tr", { key: rowData.id },
+            react_1.default.createElement("th", { key: rowData.id },
+                react_1.default.createElement(HeadCellRenderer, __assign({}, rowData))),
+            columnsData.map(function (columnValue, index) { return (react_1.default.createElement("td", { key: index },
+                react_1.default.createElement(CellRenderer, { value: columnValue[rowData.id], columnValue: columnValue, rowData: rowData }))); })));
+    };
+    return (react_1.default.createElement("table", { className: className },
+        theadRowsNumber > 0 && react_1.default.createElement("thead", null, rowsData.slice(0, theadRowsNumber).map(renderRow)),
+        react_1.default.createElement("tbody", null, rowsData.slice(theadRowsNumber).map(renderRow))));
+};
+VerticalHeadingsTable.propTypes = {
+    rowsData: prop_types_1.default.arrayOf(prop_types_1.default.shape({
+        id: prop_types_1.default.string,
+        label: prop_types_1.default.string,
+        headCellRenderer: prop_types_1.default.func,
+        cellRenderer: prop_types_1.default.func
+    })),
+    columnsData: prop_types_1.default.arrayOf(prop_types_1.default.object),
+    theadRowsNumber: prop_types_1.default.number,
+    className: prop_types_1.default.string
+};
+exports.default = react_1.memo(VerticalHeadingsTable);

package/cjs/components/ViewMoreToggle/ViewMoreToggle.js

@@ -0,0 +1,26 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var prop_types_1 = __importDefault(require("prop-types"));
+var Link_1 = __importDefault(require("@material-ui/core/Link"));
+var ArrowDropDown_1 = __importDefault(require("@material-ui/icons/ArrowDropDown"));
+var styles_1 = require("./styles");
+var classnames_1 = __importDefault(require("classnames"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
+var ViewMoreToggle = function (_a) {
+    var _b;
+    var active = _a.active, onClick = _a.onClick, className = _a.className;
+    var styles = styles_1.useStyles();
+    return (react_1.default.createElement(Link_1.default, { className: classnames_1.default(styles.viewMoreLessLink, className), onClick: onClick, underline: "none" },
+        react_1.default.createElement(ArrowDropDown_1.default, { className: classnames_1.default(styles.arrow, (_b = {}, _b[styles.rotated] = active, _b)) }),
+        active ? ui_i18n_1.default.text('View less') : ui_i18n_1.default.text('View more')));
+};
+ViewMoreToggle.propTypes = {
+    active: prop_types_1.default.bool,
+    onClick: prop_types_1.default.func,
+    className: prop_types_1.default.string
+};
+exports.default = ViewMoreToggle;

package/cjs/components/ViewMoreToggle/styles.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useStyles = void 0;
+var styles_1 = require("@material-ui/core/styles");
+exports.useStyles = styles_1.makeStyles(function () { return ({
+    viewMoreLessLink: {
+        display: 'flex',
+        alignItems: 'center',
+        cursor: 'pointer'
+    },
+    arrow: {
+        marginRight: '8px',
+        marginLeft: '-2px',
+        transform: 'rotate(0deg)',
+        transition: 'transform 0.35s ease'
+    },
+    rotated: {
+        transform: 'rotate(-180deg)'
+    }
+}); });

package/cjs/components/VirtualGroupedList/VirtualGroupedList.js

@@ -0,0 +1,223 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from) {
+    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
+        to[j] = from[i];
+    return to;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isTitleItem = void 0;
+var react_1 = __importStar(require("react"));
+var prop_types_1 = __importDefault(require("prop-types"));
+var react_window_1 = require("react-window");
+var react_resize_detector_1 = __importDefault(require("react-resize-detector"));
+var styles_1 = require("./styles");
+var helpers_1 = require("./helpers");
+/*
+items = [
+    {
+        item: {
+            item: {},
+            level: number
+        },
+        titleItemIndex: number,
+        index: number,
+        moveTo: true|false,
+        items: [...]
+        ...
+    }
+]
+*/
+var OVERSCAN_COUNT = 5;
+var isTitleItem = function (listItem) { return listItem.titleItemIndex === listItem.index; };
+exports.isTitleItem = isTitleItem;
+var VirtualGroupedList = function (_a) {
+    var items = _a.items, getItemSize = _a.getItemSize, renderItem = _a.renderItem, renderGroupTitle = _a.renderGroupTitle, _b = _a.width, width = _b === void 0 ? '100%' : _b, height = _a.height, _c = _a.fixedTitle, fixedTitle = _c === void 0 ? true : _c, _d = _a.itemKey, itemKey = _d === void 0 ? function (i) { return i; } : _d, disableHorizontalScrollbar = _a.disableHorizontalScrollbar, hideSubtitles = _a.hideSubtitles, _e = _a.focusIndex, focusIndex = _e === void 0 ? null : _e, onInnerContainerResize = _a.onInnerContainerResize;
+    var styles = styles_1.useStyles();
+    var listRef = react_1.useRef(null);
+    var itemsRef = react_1.useRef(null);
+    var titlesRef = react_1.useRef(null);
+    var itemOffsets = react_1.useRef([0]);
+    var stepCalcOffset = 10;
+    var stickyItemClass = 'stickyTitleItem';
+    var currentTitleParams = {
+        topMargin: 0
+    };
+    var isGroupHasSubTitles = function (groupedItems) { return (groupedItems || []).some(function (item) { return item.titleItemIndex !== null; }); };
+    var hasSubTitles = react_1.useMemo(function () { return !hideSubtitles || isGroupHasSubTitles(items); }, [items, hideSubtitles]);
+    var calcOffsetsToIndex = react_1.useCallback(function (index) {
+        var curItemsLength = itemOffsets.current.length;
+        var prevItemSize = 0;
+        items.slice(curItemsLength - 1, index + 1).forEach(function (listItem, i) {
+            var realIndex = curItemsLength + i - 1;
+            if (i > 0)
+                itemOffsets.current[realIndex] = itemOffsets.current[realIndex - 1] + prevItemSize;
+            prevItemSize = getItemSize(realIndex, listItem.item);
+        });
+    }, [getItemSize, items]);
+    var getTitleByIndex = react_1.useCallback(function (index) { return items[index].titleItemIndex; }, [items]);
+    var getItemByIndex = react_1.useCallback(function (index) { return items[index]; }, [items]);
+    react_1.useEffect(function () {
+        requestAnimationFrame(function () {
+            listRef.current && listRef.current.scrollTo(0);
+        });
+    }, [items.length]);
+    react_1.useEffect(function () {
+        var calcMoveToOffset = function (items) {
+            var indexItem = items.findIndex(function (listItem) { return listItem.item.moveTo; });
+            if (indexItem > -1) {
+                calcOffsetsToIndex(indexItem);
+                var titleIndex = getTitleByIndex(indexItem);
+                return {
+                    offset: itemOffsets.current[indexItem],
+                    titleHeight: getItemSize(titleIndex, getItemByIndex(titleIndex).item)
+                };
+            }
+        };
+        listRef.current && listRef.current.resetAfterIndex(0);
+        setTitleWidth();
+        var scrollToOffset = calcMoveToOffset(items);
+        if (scrollToOffset && scrollToOffset.offset && listRef.current) {
+            var titleHeight_1 = scrollToOffset.titleHeight;
+            var offset_1 = scrollToOffset.offset - titleHeight_1;
+            if (offset_1 < listRef.current.state.scrollOffset || offset_1 > listRef.current.state.scrollOffset + height) {
+                requestAnimationFrame(function () {
+                    listRef.current && listRef.current.scrollTo(offset_1 - (height - titleHeight_1) / 2);
+                });
+            }
+        }
+    }, [calcOffsetsToIndex, getItemByIndex, getItemSize, getTitleByIndex, height, itemOffsets, items, listRef]);
+    var setTitleWidth = function () {
+        if (titlesRef.current && itemsRef.current) {
+            titlesRef.current.style.width = itemsRef.current.offsetWidth + 'px';
+        }
+    };
+    var getNextTitleIndex = function (fromIndex) {
+        return items.findIndex(function (listItem, index) { return isTitleItem(listItem) && fromIndex < index; });
+    };
+    var getItemByOffset = react_1.useCallback(function (scrollOffset) {
+        var result = null;
+        var offset = 0;
+        items.some(function (listItem, index) {
+            calcOffsetsToIndex(index + stepCalcOffset);
+            var nextOffset = itemOffsets.current[index + 1];
+            if (scrollOffset >= offset && scrollOffset < nextOffset)
+                result = {
+                    index: index,
+                    offset: offset,
+                    listItem: listItem
+                };
+            offset = nextOffset;
+            return result;
+        });
+        return result;
+    }, [calcOffsetsToIndex, itemOffsets, items]);
+    var setTitleTopMargin = function (topMargin) {
+        if (titlesRef.current) {
+            currentTitleParams.topMargin = -topMargin;
+            titlesRef.current.style.top = -topMargin + 'px';
+        }
+    };
+    var setTitleByIndex = function (index) {
+        titlesRef.current &&
+            __spreadArray([], titlesRef.current.querySelectorAll('.' + stickyItemClass)).forEach(function (title) {
+                if (title.dataset.index === index.toString()) {
+                    title.style.visibility = 'visible';
+                    currentTitleParams.index = index;
+                }
+                else
+                    title.style.visibility = 'hidden';
+            });
+    };
+    var getOffsetByIndex = function (index) {
+        calcOffsetsToIndex(index);
+        return itemOffsets.current[index];
+    };
+    var onScroll = function (_a) {
+        var scrollOffset = _a.scrollOffset, scrollDirection = _a.scrollDirection;
+        if (!fixedTitle || !hasSubTitles)
+            return;
+        var topItem = getItemByOffset(scrollOffset);
+        var currentTitleIndex = topItem && getTitleByIndex(topItem.index);
+        currentTitleIndex !== null && setTitleByIndex(currentTitleIndex);
+        setTitleWidth();
+        var titleHeight = currentTitleIndex !== null && getItemSize(currentTitleIndex, getItemByIndex(currentTitleIndex).item);
+        var itemAfterTitle = getItemByOffset(scrollOffset + titleHeight + currentTitleParams.topMargin);
+        var topMargin = 0;
+        if (itemAfterTitle) {
+            switch (scrollDirection) {
+                case 'forward':
+                    if (itemAfterTitle.offset - scrollOffset > 0 && isTitleItem(itemAfterTitle.listItem))
+                        topMargin = titleHeight - (itemAfterTitle.offset - scrollOffset);
+                    break;
+                case 'backward':
+                    {
+                        var nextTitleIndex = currentTitleIndex > -1 && getNextTitleIndex(currentTitleIndex);
+                        var nextTitleOffset = getOffsetByIndex(nextTitleIndex);
+                        if (nextTitleIndex > -1 &&
+                            scrollOffset < nextTitleOffset &&
+                            titleHeight >= nextTitleOffset - scrollOffset)
+                            topMargin = titleHeight - (nextTitleOffset - scrollOffset);
+                    }
+                    break;
+            }
+            setTitleTopMargin(topMargin);
+        }
+    };
+    var _getItemSize = react_1.useCallback(function (index) { return getItemSize(index, getItemByIndex(index).item); }, [
+        getItemByIndex,
+        getItemSize
+    ]);
+    var render = react_1.useCallback(function (_a) {
+        var index = _a.index, style = _a.style, data = _a.data;
+        var listItem = getItemByIndex(index);
+        return (listItem.item &&
+            ((isTitleItem(listItem) && renderGroupTitle(style, listItem.item)) ||
+                renderItem(style, listItem.item, index, data)));
+    }, [getItemByIndex, renderGroupTitle, renderItem]);
+    var handleOnItemsRendered = helpers_1.useScrollToFocusItem({ items: items, focusIndex: focusIndex, listRef: listRef }).handleOnItemsRendered;
+    var renderTitles = react_1.useCallback(function () {
+        var renderTitle = function (listItem) { return (react_1.default.createElement("div", { className: stickyItemClass, style: { visibility: 'hidden' }, "data-index": listItem.index, key: listItem.index }, renderGroupTitle({ height: getItemSize(listItem.index, listItem.item) }, listItem.item))); };
+        return items.filter(function (listItem) { return isTitleItem(listItem); }).map(function (listItem) { return renderTitle(listItem); });
+    }, [getItemSize, items, renderGroupTitle]);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { ref: titlesRef, className: styles.stickyTitlesWrapper }, fixedTitle && renderTitles()),
+        onInnerContainerResize && itemsRef.current && (react_1.default.createElement(react_resize_detector_1.default, { handleHeight: true, onResize: onInnerContainerResize, targetDomEl: itemsRef.current })),
+        react_1.default.createElement(react_window_1.VariableSizeList, { ref: listRef, itemCount: items.length, itemSize: _getItemSize, width: width, height: height, itemKey: itemKey, innerRef: itemsRef, onScroll: onScroll, style: disableHorizontalScrollbar ? { overflowX: 'hidden' } : undefined, overscanCount: OVERSCAN_COUNT, onItemsRendered: handleOnItemsRendered }, render)));
+};
+VirtualGroupedList.propTypes = {
+    items: prop_types_1.default.arrayOf(prop_types_1.default.object).isRequired,
+    getItemSize: prop_types_1.default.func.isRequired,
+    renderItem: prop_types_1.default.func.isRequired,
+    width: prop_types_1.default.oneOfType([prop_types_1.default.number, prop_types_1.default.string]),
+    height: prop_types_1.default.number.isRequired,
+    renderGroupTitle: prop_types_1.default.func,
+    fixedTitle: prop_types_1.default.bool,
+    hideSubtitles: prop_types_1.default.bool,
+    itemKey: prop_types_1.default.func,
+    disableHorizontalScrollbar: prop_types_1.default.bool,
+    focusIndex: prop_types_1.default.number,
+    onInnerContainerResize: prop_types_1.default.func
+};
+exports.default = VirtualGroupedList;

package/cjs/components/VirtualGroupedList/helpers.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useScrollToFocusItem = exports.flattenGroupedItemsData = exports.SCROLL_COUNT = void 0;
+var ramda_1 = require("ramda");
+var react_1 = require("react");
+exports.SCROLL_COUNT = 3;
+var flattenGroupedItemsData = function (groupedItems) {
+    var getFlattenedItems = function (items) {
+        return ramda_1.flatten(items.map(function (item) { return [item].concat(item.items ? getFlattenedItems(item.items) : []); }));
+    };
+    var titleItemIndex = null;
+    var items = getFlattenedItems(groupedItems).map(function (item, index) {
+        if (item && item.items) {
+            titleItemIndex = index;
+        }
+        return { item: item, index: index, titleItemIndex: titleItemIndex };
+    });
+    return items;
+};
+exports.flattenGroupedItemsData = flattenGroupedItemsData;
+var useScrollToFocusItem = function (_a) {
+    var focusIndex = _a.focusIndex, listRef = _a.listRef, items = _a.items;
+    var visibleStartIndexRef = react_1.useRef(null);
+    var visibleStopIndexRef = react_1.useRef(null);
+    var handleOnItemsRendered = react_1.useCallback(function (_a) {
+        var visibleStartIndex = _a.visibleStartIndex, visibleStopIndex = _a.visibleStopIndex;
+        visibleStartIndexRef.current = visibleStartIndex;
+        visibleStopIndexRef.current = visibleStopIndex;
+    }, []);
+    react_1.useEffect(function () {
+        if (!listRef.current || focusIndex === null || items.length === 0) {
+            return;
+        }
+        if (focusIndex < Math.max(visibleStartIndexRef.current + exports.SCROLL_COUNT, 0)) {
+            listRef.current.scrollToItem(Math.max(focusIndex - exports.SCROLL_COUNT, 0), 'start');
+        }
+        else if (focusIndex > Math.min(visibleStopIndexRef.current - exports.SCROLL_COUNT, items.length - 1)) {
+            listRef.current.scrollToItem(Math.min(focusIndex + exports.SCROLL_COUNT, items.length - 1), 'end');
+        }
+    }, [focusIndex, items.length, listRef]);
+    return { handleOnItemsRendered: handleOnItemsRendered };
+};
+exports.useScrollToFocusItem = useScrollToFocusItem;

package/cjs/components/VirtualGroupedList/styles.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useStyles = void 0;
+var styles_1 = require("@material-ui/core/styles");
+exports.useStyles = styles_1.makeStyles({
+    stickyTitlesWrapper: {
+        position: 'absolute',
+        top: 0,
+        '& > div': {
+            zIndex: 1,
+            position: 'absolute',
+            top: 0,
+            width: '100%',
+            visibility: 'hidden'
+        }
+    }
+});

package/cjs/components/activityLog/ActivityExportButton/ActivityExportButton.js

@@ -0,0 +1,80 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var react_redux_1 = require("react-redux");
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
+var Button_1 = __importDefault(require("@material-ui/core/Button"));
+var Portal_1 = __importDefault(require("@material-ui/core/Portal"));
+var Snackbar_1 = __importDefault(require("@material-ui/core/Snackbar"));
+var GetApp_1 = __importDefault(require("@material-ui/icons/GetApp"));
+var SmallIconButton_1 = require("../../SmallIconButton");
+var ErrorPopup_1 = __importDefault(require("../../ErrorPopup/ErrorPopup"));
+var DropDownMenuButton_1 = __importDefault(require("../../DropDownMenuButton/DropDownMenuButton"));
+var mdm_module_1 = __importStar(require("@reltio/mdm-module"));
+var mdm_sdk_1 = require("@reltio/mdm-sdk");
+var filters_1 = require("../utils/filters");
+var styles_1 = require("./styles");
+var ActivityExportButton = function (_a) {
+    var filters = _a.filters, _b = _a.exportTypes, exportTypes = _b === void 0 ? [] : _b;
+    var styles = styles_1.useStyles();
+    var dispatch = react_redux_1.useDispatch();
+    var _c = react_1.useState(false), showSnackbar = _c[0], setShowSnackbar = _c[1];
+    var exportPath = react_redux_1.useSelector(mdm_module_1.default.selectors.getExportPath);
+    var handleClickExport = react_1.useCallback(function (type) {
+        var options = {
+            filter: filters_1.buildActivitiesFilterString(filters),
+            fileFormat: type
+        };
+        mdm_sdk_1.exportActivities({ exportPath: exportPath, options: options })
+            .then(function () { return setShowSnackbar(true); })
+            .catch(onError);
+    }, [filters, exportPath]);
+    var onError = function (error) {
+        console.error(error);
+        ErrorPopup_1.default.addError({
+            title: ui_i18n_1.default.text('Error'),
+            message: mdm_sdk_1.getRequestErrorMessage(error, ui_i18n_1.default.text("Can't export activities"))
+        });
+    };
+    var handleOpenAppClick = react_1.useCallback(function () {
+        dispatch(mdm_module_1.ui.actions.openConsoleApp('Export'));
+    }, [dispatch]);
+    var menuItems = react_1.useMemo(function () {
+        return exportTypes.map(function (type) { return ({
+            text: type.toUpperCase(),
+            onClick: function () { return handleClickExport(type); }
+        }); });
+    }, [exportTypes, handleClickExport]);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        menuItems.length ? (react_1.default.createElement(DropDownMenuButton_1.default, { buttonComponent: SmallIconButton_1.SmallIconButtonWithTooltip, buttonProps: {
+                icon: GetApp_1.default,
+                tooltipTitle: ui_i18n_1.default.text('Export'),
+                size: 'L',
+                className: styles.icon
+            }, menuItems: menuItems, menuId: "export-menu" })) : (react_1.default.createElement(SmallIconButton_1.SmallIconButtonWithTooltip, { icon: GetApp_1.default, size: "L", onClick: function () { return handleClickExport(); }, tooltipTitle: ui_i18n_1.default.text('Export'), className: styles.icon })),
+        react_1.default.createElement(Portal_1.default, { container: document.body },
+            react_1.default.createElement(Snackbar_1.default, { open: showSnackbar, autoHideDuration: 5000, className: styles.snackbar, onClose: function () { return setShowSnackbar(false); }, message: ui_i18n_1.default.text('Export operation is currently in progress. You will receive an email notification once completed. Go to Export Application to view the status.'), action: react_1.default.createElement(Button_1.default, { className: styles.exportButton, onClick: handleOpenAppClick }, ui_i18n_1.default.text('Export application')) }))));
+};
+exports.default = ActivityExportButton;

package/cjs/components/activityLog/ActivityExportButton/styles.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useStyles = void 0;
+var styles_1 = require("@material-ui/core/styles");
+exports.useStyles = styles_1.makeStyles(function (theme) { return ({
+    snackbar: {
+        maxWidth: 500
+    },
+    icon: {
+        margin: '4px'
+    },
+    exportButton: {
+        color: theme.palette.primary.main
+    }
+}); });

package/cjs/components/activityLog/ActivityFilterEditor/ActivityFilterEditor.js

@@ -0,0 +1,82 @@
+"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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var react_redux_1 = require("react-redux");
+var mdm_module_1 = __importDefault(require("@reltio/mdm-module"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
+var classnames_1 = __importDefault(require("classnames"));
+var Button_1 = __importDefault(require("@material-ui/core/Button"));
+var types_1 = require("../types");
+var getSelectorActivityTypes_1 = require("./utils/getSelectorActivityTypes");
+var ActivitySelector_1 = __importDefault(require("./ActivitySelector"));
+var AttributeSelector_1 = __importDefault(require("../../AttributeSelector/AttributeSelector"));
+var SourceSelector_1 = __importDefault(require("./SourceSelector"));
+var UserSelector_1 = __importDefault(require("../../UserSelector/UserSelector"));
+var DateRangeSelector_1 = __importDefault(require("./DateRangeSelector"));
+var hooks_1 = require("../../../hooks");
+var ramda_1 = require("ramda");
+var styles_1 = require("./styles");
+var ActivityFilterEditor = function (_a) {
+    var value = _a.value, open = _a.open, entityType = _a.entityType, onApply = _a.onApply, onCancel = _a.onCancel, onClear = _a.onClear;
+    var styles = styles_1.useStyles();
+    var metadata = react_redux_1.useSelector(mdm_module_1.default.selectors.getMetadata);
+    var _b = react_1.useState(value), currentValue = _b[0], setCurrentValue = _b[1];
+    var clearCurrentValue = function () { return setCurrentValue(null); };
+    var handlePropChange = ramda_1.curry(function (propName, value) {
+        setCurrentValue(function (filterValue) {
+            var _a;
+            return (__assign(__assign({}, filterValue), (_a = {}, _a[propName] = value, _a)));
+        });
+    });
+    hooks_1.useDidUpdateEffect(function () {
+        setCurrentValue(value);
+    }, [value]);
+    var _c = currentValue || {}, _d = _c.activities, activities = _d === void 0 ? [] : _d, _e = _c.attributes, attributes = _e === void 0 ? [] : _e, _f = _c.sources, sources = _f === void 0 ? [] : _f, _g = _c.dateRange, dateRange = _g === void 0 ? null : _g, _h = _c.users, users = _h === void 0 ? [] : _h;
+    var hasEntityChanged = activities.includes(types_1.ActivityTypes.ENTITY_CHANGED);
+    var ActivityFilterRenderer = (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(ActivitySelector_1.default, { activityTypes: getSelectorActivityTypes_1.getSelectorActivityTypes(metadata, entityType), selectedActivityTypes: activities, onChange: handlePropChange('activities') }),
+        hasEntityChanged && entityType && (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(AttributeSelector_1.default, { selectedAttributes: attributes, entityType: entityType, onChange: handlePropChange('attributes'), className: styles.borderBottom, disableUnderline: true }),
+            react_1.default.createElement(SourceSelector_1.default, { selectedSources: sources, onChange: handlePropChange('sources') }))),
+        react_1.default.createElement(DateRangeSelector_1.default, { value: dateRange, onChange: handlePropChange('dateRange') }),
+        react_1.default.createElement(UserSelector_1.default, { selectedUsers: users, onChange: handlePropChange('users'), disableUnderline: true }),
+        react_1.default.createElement("div", { className: classnames_1.default(styles.borderBottom, styles.filterControls) },
+            react_1.default.createElement(Button_1.default, { onClick: ramda_1.pipe(clearCurrentValue, onClear), className: styles.clearButton }, ui_i18n_1.default.text('Clear all')),
+            react_1.default.createElement(Button_1.default, { onClick: onCancel }, ui_i18n_1.default.text('Cancel')),
+            react_1.default.createElement(Button_1.default, { color: "primary", onClick: function () { return onApply(currentValue); } }, ui_i18n_1.default.text('Apply')))));
+    return open && react_1.default.createElement("div", { className: styles.container }, ActivityFilterRenderer);
+};
+exports.default = ActivityFilterEditor;

package/cjs/components/activityLog/ActivityFilterEditor/ActivitySelector.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var ui_i18n_1 = __importDefault(require("ui-i18n"));
+var ramda_1 = require("ramda");
+var classnames_1 = __importDefault(require("classnames"));
+var Typography_1 = __importDefault(require("@material-ui/core/Typography"));
+var MultiSelect_1 = __importDefault(require("../../ReactSelect/MultiSelect"));
+var DropdownIndicatorWithIconButton_1 = __importDefault(require("../../commonReactSelectComponents/DropdownIndicatorWithIconButton"));
+var activities_1 = require("../utils/activities");
+var styles_1 = require("./styles");
+var ActivitySelector = function (_a) {
+    var activityTypes = _a.activityTypes, selectedActivityTypes = _a.selectedActivityTypes, onChange = _a.onChange;
+    var styles = styles_1.useStyles();
+    var valueToOption = function (value) { return ({ value: value, label: activities_1.getActivityLabel(value) }); };
+    var prepareValues = function (values) { return values.map(valueToOption); };
+    var options = ramda_1.pipe(ramda_1.sortBy(function (option) { return activities_1.getActivityLabel(option); }), prepareValues)(activityTypes);
+    return (react_1.default.createElement("div", { className: styles.borderBottom },
+        react_1.default.createElement(Typography_1.default, { className: classnames_1.default(styles.filterSubtitle, styles.labels), variant: 'subtitle1' }, ui_i18n_1.default.text('Activity')),
+        react_1.default.createElement(MultiSelect_1.default, { value: prepareValues(selectedActivityTypes), onChange: ramda_1.pipe(ramda_1.defaultTo([]), ramda_1.pluck('value'), onChange), options: options, TextFieldProps: {
+                InputProps: { disableUnderline: true },
+                classes: { root: styles.dropDownInput }
+            }, components: {
+                DropdownIndicator: DropdownIndicatorWithIconButton_1.default
+            }, styles: styles_1.customStyles, classes: styles, menuPlacement: "bottom" })));
+};
+exports.default = ActivitySelector;